@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@100;300;400;500;600;700;900&display=swap');
/* ==== themes/red/css/uikit.css ==== */
 
/* Selection pseudo-element
 ========================================================================== */
::selection {
  background: rgb(38, 16, 80);
  color: #fff;
  text-shadow: none;
} 
/* Reset
 ========================================================================== */
/*
 * `!important` needed to override inverse component
 */
a.uk-link-reset,
.uk-link-reset a {

  text-decoration: none !important;
}
/* Toggle
 ========================================================================== */
.uk-link-toggle {
  color: inherit !important;
  text-decoration: none !important;
}
.uk-link-toggle:focus {
  outline: none;
}
/* ========================================================================
   Component: Heading
 ========================================================================== */
.uk-heading-small {
  font-size: 2.6rem;
  line-height: 1.2;
}
.uk-heading-medium {
  font-size: 2.8875rem;
  line-height: 1.1;
}
.uk-heading-large {
  font-size: 3.4rem;
  line-height: 1.1;
}
.uk-heading-xlarge {
  font-size: 4rem;
  line-height: 1;
}
.uk-heading-2xlarge {
  font-size: 6rem;
  line-height: 1;
}
/* Tablet Landscape and bigger */
@media (min-width: 960px) {
  .uk-heading-small {
    font-size: 3.25rem;
  }
  .uk-heading-medium {
    font-size: 3.5rem;
  }
  .uk-heading-large {
    font-size: 4rem;
  }
  .uk-heading-xlarge {
    font-size: 6rem;
  }
  .uk-heading-2xlarge {
    font-size: 8rem;
  }
}
/* Laptop and bigger */
@media (min-width: 1200px) {
  .uk-heading-medium {
    font-size: 4rem;
  }
  .uk-heading-large {
    font-size: 6rem;
  }
  .uk-heading-xlarge {
    font-size: 8rem;
  }
  .uk-heading-2xlarge {
    font-size: 11rem;
  }
}
/* Primary
   Deprecated: Use `uk-heading-medium` instead
 ========================================================================== */
/* Tablet landscape and bigger */
/* Desktop and bigger */
/* Hero
   Deprecated: Use `uk-heading-xlarge` instead
 ========================================================================== */
/* Tablet landscape and bigger */
/* Desktop and bigger */
/* Divider
 ========================================================================== */
.uk-heading-divider {
  padding-bottom: calc(5px + 0.1em);
  border-bottom: calc(0.2px + 0.05em) solid #e5e5e5;
}
/* Bullet
 ========================================================================== */
.uk-heading-bullet {
  position: relative;
}
/*
 * 1. Using `inline-block` to make it work with text alignment
 * 2. Center vertically
 * 3. Style
 */
.uk-heading-bullet::before {
  content: "";
  /* 1 */
  display: inline-block;
  /* 2 */
  position: relative;
  top: calc(-0.1 * 1em);
  vertical-align: middle;
  /* 3 */
  height: calc(4px + 0.7em);
  margin-right: calc(5px + 0.2em);
  border-left: calc(5px + 0.1em) solid #e5e5e5;
}
/* Line
 ========================================================================== */
/*
 * Clip the child element
 */
.uk-heading-line {
  overflow: hidden;
}
/*
 * Extra markup is needed to make it work with text align
 */
.uk-heading-line > * {
  display: inline-block;
  position: relative;
}
/*
 * 1. Center vertically
 * 2. Make the element as large as possible. It's clipped by the container.
 * 3. Style
 */
.uk-heading-line > ::before,
.uk-heading-line > ::after {
  content: "";
  /* 1 */
  position: absolute;
  top: calc(50% - ((0.2px + 0.05em) / 2));
  /* 2 */
  width: 2000px;
  /* 3 */
  border-bottom: calc(0.2px + 0.05em) solid #e5e5e5;
}
.uk-heading-line > ::before {
  right: 100%;
  margin-right: calc(5px + 0.3em);
}
.uk-heading-line > ::after {
  left: 100%;
  margin-left: calc(5px + 0.3em);
}
/* ========================================================================
   Component: Divider
 ========================================================================== */
/*
 * 1. Reset default `hr`
 * 2. Set margin if a `div` is used for semantical reason
 */
[class*='uk-divider'] {
  /* 1 */
  border: none;
  /* 2 */
  margin-bottom: 20px;
}
/* Add margin if adjacent element */
* + [class*='uk-divider'] {
  margin-top: 20px;
}
/* Icon
 ========================================================================== */
.uk-divider-icon {
  position: relative;
  height: 20px;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22none%22%20stroke%3D%22%23e5e5e5%22%20stroke-width%3D%222%22%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%227%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.uk-divider-icon::before,
.uk-divider-icon::after {
  content: "";
  position: absolute;
  top: 50%;
  max-width: calc(50% - (50px / 2));
  border-bottom: 1px solid #e5e5e5;
}
.uk-divider-icon::before {
  right: calc(50% + (50px / 2));
  width: 100%;
}
.uk-divider-icon::after {
  left: calc(50% + (50px / 2));
  width: 100%;
}
/* Small
 ========================================================================== */
/*
 * 1. Fix height because of `inline-block`
 * 2. Using ::after and inline-block to make `text-align` work
 */
/* 1 */
.uk-divider-small {
  line-height: 0;
}
/* 2 */
.uk-divider-small::after {
  content: "";
  display: inline-block;
  width: 100px;
  max-width: 100%;
  border-top: 1px solid #e5e5e5;
  vertical-align: top;
}
/* Vertical
 ========================================================================== */
.uk-divider-vertical {
  width: 1px;
  height: 100px;
  margin-left: auto;
  margin-right: auto;
  border-left: 1px solid #e5e5e5;
}
/* ========================================================================
   Component: List
 ========================================================================== */
.uk-list {
  padding: 0;
  list-style: none;
}
/*
 * Micro clearfix
 */
.uk-list > li::before,
.uk-list > li::after {
  content: "";
  display: table;
}
.uk-list > li::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-list > li > :last-child {
  margin-bottom: 0;
}
/*
 * Nested lists
 */
.uk-list ul {
  margin: 0;
  padding-left: 30px;
  list-style: none;
}
/*
 * Style
 */
.uk-list > li:nth-child(n+2),
.uk-list > li > ul {
  margin-top: 10px;
}
/* Style modifiers
 ========================================================================== */
/*
 * Divider
 */
.uk-list-divider > li:nth-child(n+2) {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #e5e5e5;
}
/*
 * Striped
 */
.uk-list-striped > li {
  padding: 10px 10px;
}
.uk-list-striped > li:nth-of-type(odd) {
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}
.uk-list-striped > li:nth-of-type(odd) {
  background: #f8f8f8;
}
.uk-list-striped > li:nth-child(n+2) {
  margin-top: 0;
}
/*
 * Bullet
 * 1. Reset display `table` which causes issues in combination with multi column layouts.
 */
.uk-list-bullet > li {
  position: relative;
  padding-left: calc(1.5em + 10px);
}
.uk-list-bullet > li::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 1.5em;
  height: 1.5em;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23666%22%20cx%3D%223%22%20cy%3D%223%22%20r%3D%223%22%20%2F%3E%0A%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  /* 1 */
  display: block;
}
/* Size modifier
 ========================================================================== */
.uk-list-large > li:nth-child(n+2),
.uk-list-large > li > ul {
  margin-top: 20px;
}
/*
 * Divider
 */
.uk-list-large.uk-list-divider > li:nth-child(n+2) {
  margin-top: 20px;
  padding-top: 20px;
}
/*
 * Striped
 */
.uk-list-large.uk-list-striped > li {
  padding: 20px 10px;
}
.uk-list-large.uk-list-striped > li:nth-of-type(odd) {
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}
.uk-list-large.uk-list-striped > li:nth-child(n+2) {
  margin-top: 0;
}
/* ========================================================================
   Component: Description list
 ========================================================================== */
/*
 * Term
 */
.uk-description-list > dt {
  color: #333;
  font-size: 0.875rem;
  font-weight: normal;
  text-transform: uppercase;
}
.uk-description-list > dt:nth-child(n+2) {
  margin-top: 20px;
}
/*
 * Description
 */
/* Style modifier
 ========================================================================== */
/*
 * Line
 */
.uk-description-list-divider > dt:nth-child(n+2) {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid #e5e5e5;
}
/* ========================================================================
   Component: Table
 ========================================================================== */
/*
 * 1. Remove most spacing between table cells.
 * 2. Behave like a block element
 * 3. Style
 */
.uk-table {
  /* 1 */
  border-collapse: collapse;
  border-spacing: 0;
  /* 2 */
  width: 100%;
  /* 3 */
  margin-bottom: 20px;
}
/* Add margin if adjacent element */
* + .uk-table {
  margin-top: 20px;
}
/* Header cell
 ========================================================================== */
/*
 * 1. Style
 */
.uk-table th {
  padding: 16px 12px;
  text-align: left;
  vertical-align: bottom;
  /* 1 */
  font-size: 0.875rem;
  font-weight: normal;
  color: #999;
  text-transform: uppercase;
}
/* Cell
 ========================================================================== */
.uk-table td {
  padding: 16px 12px;
  vertical-align: top;
}
/*
 * Remove margin from the last-child
 */
.uk-table td > :last-child {
  margin-bottom: 0;
}
/* Footer
 ========================================================================== */
.uk-table tfoot {
  font-size: 0.875rem;
}
/* Caption
 ========================================================================== */
.uk-table caption {
  font-size: 0.875rem;
  text-align: left;
  color: #999;
}
/* Alignment modifier
 ========================================================================== */
.uk-table-middle,
.uk-table-middle td {
  vertical-align: middle !important;
}
/* Style modifiers
 ========================================================================== */
/*
 * Divider
 */
.uk-table-divider > tr:not(:first-child),
.uk-table-divider > :not(:first-child) > tr,
.uk-table-divider > :first-child > tr:not(:first-child) {
  border-top: 1px solid #e5e5e5;
}
/*
 * Striped
 */
.uk-table-striped > tr:nth-of-type(odd),
.uk-table-striped tbody tr:nth-of-type(odd) {
  background: #f8f8f8;
  border-top: 1px solid #e5e5e5;
  border-bottom: 1px solid #e5e5e5;
}
/*
 * Hover
 */
.uk-table-hover > tr:hover,
.uk-table-hover tbody tr:hover {
  background: #eaffef;
}
/* Active state
 ========================================================================== */
.uk-table > tr.uk-active,
.uk-table tbody tr.uk-active {
  background: #ffd;
}
/* Size modifier
 ========================================================================== */
.uk-table-small th,
.uk-table-small td {
  padding: 10px 12px;
}
.uk-table-large th,
.uk-table-large td {
  padding: 22px 12px;
}
/* Justify modifier
 ========================================================================== */
.uk-table-justify th:first-child,
.uk-table-justify td:first-child {
  padding-left: 0;
}
.uk-table-justify th:last-child,
.uk-table-justify td:last-child {
  padding-right: 0;
}
/* Cell size modifier
 ========================================================================== */
.uk-table-shrink {
  width: 1px;
}
.uk-table-expand {
  min-width: 150px;
}
/* Cell link modifier
 ========================================================================== */
/*
 * Does not work with `uk-table-justify` at the moment
 */
.uk-table-link {
  padding: 0 !important;
}
.uk-table-link > a {
  display: block;
  padding: 16px 12px;
}
.uk-table-small .uk-table-link > a {
  padding: 10px 12px;
}
/* Responsive table
 ========================================================================== */
/* Phone landscape and smaller */
@media (max-width: 959px) {
  .uk-table-responsive,
  .uk-table-responsive tbody,
  .uk-table-responsive th,
  .uk-table-responsive td,
  .uk-table-responsive tr {
    display: block;
  }
  .uk-table-responsive thead {
    display: none;
  }
  .uk-table-responsive th,
  .uk-table-responsive td {
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: visible !important;
    white-space: normal !important;
  }
  .uk-table-responsive th:not(:first-child):not(.uk-table-link),
  .uk-table-responsive td:not(:first-child):not(.uk-table-link),
  .uk-table-responsive .uk-table-link:not(:first-child) > a {
    padding-top: 5px !important;
  }
  .uk-table-responsive th:not(:last-child):not(.uk-table-link),
  .uk-table-responsive td:not(:last-child):not(.uk-table-link),
  .uk-table-responsive .uk-table-link:not(:last-child) > a {
    padding-bottom: 5px !important;
  }
  .uk-table-justify.uk-table-responsive th,
  .uk-table-justify.uk-table-responsive td {
    padding-left: 0;
    padding-right: 0;
  }
}
.uk-table tbody tr {
  transition: background-color 0.1s linear;
}
/* ========================================================================
   Component: Icon
 ========================================================================== */
/*
 * Note: 1. - 7. is required for `button` elements. Needed for Close and Form Icon component.
 * 1. Remove margins in Chrome, Safari and Opera.
 * 2. Remove borders for `button`.
 * 3. Remove border-radius in Chrome.
 * 4. Address `overflow` set to `hidden` in IE.
 * 5. Correct `font` properties and `color` not being inherited for `button`.
 * 6. Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 7. Remove default `button` padding and background color
 * 8. Style
 * 9. Fill all SVG elements with the current text color if no `fill` attribute is set
 * 10. Let the container fit the height of the icon
 */
.uk-icon {
  /* 1 */
  margin: 0;
  /* 2 */
  border: none;
  /* 3 */
  border-radius: 0;
  /* 4 */
  overflow: visible;
  /* 5 */
  font: inherit;
  color: inherit;
  /* 6 */
  text-transform: none;
  /* 7. */
  padding: 0;
  background-color: transparent;
  /* 8 */
  display: inline-block;
  /* 9 */
  fill: currentcolor;
  /* 10 */
  line-height: 0;
}
/* Required for `button`. */
button.uk-icon:not(:disabled) {
  cursor: pointer;
}
/*
 * Remove the inner border and padding in Firefox.
 */
.uk-icon::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/*
 * Set the fill and stroke color of all SVG elements to the current text color
 */
.uk-icon:not(.uk-preserve) [fill*='#']:not(.uk-preserve) {
  fill: currentcolor;
}
.uk-icon:not(.uk-preserve) [stroke*='#']:not(.uk-preserve) {
  stroke: currentcolor;
}
/*
 * Fix Firefox blurry SVG rendering: https://bugzilla.mozilla.org/show_bug.cgi?id=1046835
 */
.uk-icon > * {
  transform: translate(0, 0);
}
/* Image modifier
 ========================================================================== */
/*
 * Display images in icon dimensions
 */
.uk-icon-image {
  width: 20px;
  height: 20px;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  background-size: contain;
  vertical-align: middle;
}
/* Style modifiers
 ========================================================================== */
/*
 * Link
 */
.uk-icon-link {
  color: #999;
}
.uk-icon-link:hover,
.uk-icon-link:focus {
  color: #666;
  outline: none;
}
/* OnClick + Active */
.uk-icon-link:active,
.uk-active > .uk-icon-link {
  color: #595959;
}
/*
 * Button
 * 1. Center icon vertically and horizontally
 */
.uk-icon-button {
  box-sizing: border-box;
  width: 36px;
  height: 36px;
  border-radius: 500px;
  background: #f8f8f8;
  color: #999;
  vertical-align: middle;
  /* 1 */
  display: inline-flex;
  justify-content: center;
  align-items: center;
  transition: 0.1s ease-in-out;
  transition-property: color, background-color;
}
/* Hover + Focus */
.uk-icon-button:hover,
.uk-icon-button:focus {
  background-color: #ebebeb;
  color: #666;
  outline: none;
}
/* OnClick + Active */
.uk-icon-button:active,
.uk-active > .uk-icon-button {
  background-color: #dfdfdf;
  color: #666;
}
/* ========================================================================
   Component: Form Range
 ========================================================================== */
/*
 * 1. Normalize and defaults
 * 2. Prevent content overflow if a fixed width is used
 * 3. Take the full width
 * 4. Remove default style
 * 5. Remove white background in Chrome
 * 6. Remove padding in IE11
 */
.uk-range {
  /* 1 */
  box-sizing: border-box;
  margin: 0;
  vertical-align: middle;
  /* 2 */
  max-width: 100%;
  /* 3 */
  width: 100%;
  /* 4 */
  -webkit-appearance: none;
  /* 5 */
  background: transparent;
  /* 6 */
  padding: 0;
}
/* Focus */
.uk-range:focus {
  outline: none;
}
.uk-range::-moz-focus-outer {
  border: none;
}
/* IE11 Reset */
.uk-range::-ms-track {
  height: 15px;
  background: transparent;
  border-color: transparent;
  color: transparent;
}
/*
 * Improves consistency of cursor style for clickable elements
 */
.uk-range:not(:disabled)::-webkit-slider-thumb {
  cursor: pointer;
}
.uk-range:not(:disabled)::-moz-range-thumb {
  cursor: pointer;
}
.uk-range:not(:disabled)::-ms-thumb {
  cursor: pointer;
}
/* Thumb
 ========================================================================== */
/*
 * 1. Reset
 * 2. Style
 */
/* Webkit */
.uk-range::-webkit-slider-thumb {
  /* 1 */
  -webkit-appearance: none;
  margin-top: -7px;
  /* 2 */
  height: 15px;
  width: 15px;
  border-radius: 500px;
  background: #fff;
  border: 1px solid #cccccc;
}
/* Firefox */
.uk-range::-moz-range-thumb {
  /* 1 */
  border: none;
  /* 2 */
  height: 15px;
  width: 15px;
  border-radius: 500px;
  background: #fff;
  border: 1px solid #cccccc;
}
/* Edge */
.uk-range::-ms-thumb {
  /* 1 */
  margin-top: 0;
}
/* IE11 */
.uk-range::-ms-thumb {
  /* 1 */
  border: none;
  /* 2 */
  height: 15px;
  width: 15px;
  border-radius: 500px;
  background: #fff;
  border: 1px solid #cccccc;
}
/* Edge + IE11 */
.uk-range::-ms-tooltip {
  display: none;
}
/* Track
 ========================================================================== */
/*
 * 1. Safari doesn't have a focus state. Using active instead.
 */
/* Webkit */
.uk-range::-webkit-slider-runnable-track {
  height: 3px;
  background: #ebebeb;
  border-radius: 500px;
}
.uk-range:focus::-webkit-slider-runnable-track,
.uk-range:active::-webkit-slider-runnable-track {
  background: #d2d2d2;
}
/* Firefox */
.uk-range::-moz-range-track {
  height: 3px;
  background: #ebebeb;
  border-radius: 500px;
}
.uk-range:focus::-moz-range-track {
  background: #d2d2d2;
}
/* Edge */
.uk-range::-ms-fill-lower,
.uk-range::-ms-fill-upper {
  height: 3px;
  background: #ebebeb;
  border-radius: 500px;
}
.uk-range:focus::-ms-fill-lower,
.uk-range:focus::-ms-fill-upper {
  background: #d2d2d2;
}
/* ========================================================================
   Component: Form
 ========================================================================== */
/*
 * 1. Define consistent box sizing.
 *    Default is `content-box` with following exceptions set to `border-box`
 *    `select`, `input[type="checkbox"]` and `input[type="radio"]`
 *    `input[type="search"]` in Chrome, Safari and Opera
 *    `input[type="color"]` in Firefox
 * 2. Address margins set differently in Firefox/IE and Chrome/Safari/Opera.
 * 3. Remove `border-radius` in iOS.
 * 4. Change font properties to `inherit` in all browsers.
 */
.uk-input,
.uk-select,
.uk-textarea,
.uk-radio,
.uk-checkbox {
  /* 1 */
  box-sizing: border-box;
  /* 2 */
  margin: 0;
  /* 3 */
  border-radius: 0;
  /* 4 */
  font: inherit;
}
/*
 * Show the overflow in Edge.
 */
.uk-input {
  overflow: visible;
}
/*
 * Remove the inheritance of text transform in Firefox.
 */
.uk-select {
  text-transform: none;
}
/*
 * 1. Change font properties to `inherit` in all browsers
 * 2. Don't inherit the `font-weight` and use `bold` instead.
 * NOTE: Both declarations don't work in Chrome, Safari and Opera.
 */
.uk-select optgroup {
  /* 1 */
  font: inherit;
  /* 2 */
  font-weight: bold;
}
/*
 * Remove the default vertical scrollbar in IE 10+.
 */
.uk-textarea {
  overflow: auto;
}
/*
 * Remove the inner padding and cancel buttons in Chrome on OS X and Safari on OS X.
 */
.uk-input[type="search"]::-webkit-search-cancel-button,
.uk-input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}
/*
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
.uk-input[type="number"]::-webkit-inner-spin-button,
.uk-input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}
/*
 * Removes placeholder transparency in Firefox.
 */
.uk-input::-moz-placeholder,
.uk-textarea::-moz-placeholder {
  opacity: 1;
}
/*
 * Improves consistency of cursor style for clickable elements
 */
.uk-radio:not(:disabled),
.uk-checkbox:not(:disabled) {
  cursor: pointer;
}
/*
 * Define consistent border, margin, and padding.
 */
.uk-fieldset {
  border: none;
  margin: 0;
  padding: 0;
}
/* Input, select and textarea
 * Allowed: `text`, `password`, `datetime`, `datetime-local`, `date`,  `month`,
            `time`, `week`, `number`, `email`, `url`, `search`, `tel`, `color`
 * Disallowed: `range`, `radio`, `checkbox`, `file`, `submit`, `reset` and `image`
 ========================================================================== */
/*
 * Remove default style in iOS.
 */
.uk-input,
.uk-textarea {
  -webkit-appearance: none;
}
/*
 * 1. Prevent content overflow if a fixed width is used
 * 2. Take the full width
 * 3. Reset default
 * 4. Style
 */
.uk-input,
.uk-select,
.uk-textarea {
  /* 1 */
  max-width: 100%;
  /* 2 */
  width: 100%;
  /* 3 */
  border: 0 none;
  /* 4 */
  padding: 0px 16px;
  background: #fff;
  color: #666; 
  border: 1px solid #eceff5;
  border-radius: 7px;
  transition: 0.2s ease-in-out;
  transition-property: color, background-color, border;
}
/*
 * Single-line
 * 1. Allow any element to look like an `input` or `select` element
 * 2. Make sure line-height is not larger than height
 *    Also needed to center the text vertically
 */
.uk-input,
.uk-select:not([multiple]):not([size]) {
  height: 41px;
  vertical-align: middle;
  /* 1 */
  display: inline-block;
}
/* 2 */
.uk-input:not(input),
.uk-select:not(select) {
  line-height: 38px;
}
/*
 * Multi-line
 */
.uk-select[multiple],
.uk-select[size],
.uk-textarea {
  padding-top: 4px;
  padding-bottom: 4px;
  vertical-align: top;
}
/* Focus */
.uk-input:focus,
.uk-select:focus,
.uk-textarea:focus {
  outline: none;
  background-color: #fff;
  color: #666;
  border-color: #6a6b77;
}
/* Disabled */
.uk-input:disabled,
.uk-select:disabled,
.uk-textarea:disabled {
  background-color: #f8f8f8;
  color: #999;
  border-color: #e5e5e5;
}
/*
 * Placeholder
 */
.uk-input::-ms-input-placeholder {
  color: #999 !important;
}
.uk-input::placeholder {
  color: #999;
}
.uk-textarea::-ms-input-placeholder {
  color: #999 !important;
}
.uk-textarea::placeholder {
  color: #999;
}
/* Style modifier (`uk-input`, `uk-select` and `uk-textarea`)
 ========================================================================== */
/*
 * Small
 */
.uk-form-small {
  font-size: 0.875rem;
}
.uk-form-small:not(textarea):not([multiple]):not([size]) {
  height: 37px;
  padding: 0px 11px;
}
.uk-form-small:not(select):not(input):not(textarea) {
  line-height: 28px;
}
/*
 * Large
 */
.uk-form-large {
  font-size: 1.25rem;
}
.uk-form-large:not(textarea):not([multiple]):not([size]) {
  height: 55px;
  padding-left: 12px;
  padding-right: 12px;
}
.uk-form-large:not(select):not(input):not(textarea) {
  line-height: 53px;
}
/* Style modifier (`uk-input`, `uk-select` and `uk-textarea`)
 ========================================================================== */
/*
 * Error
 */
.uk-form-danger,
.uk-form-danger:focus {
  color: #f0506e;
  border-color: #f0506e;
}
/*
 * Success
 */
.uk-form-success,
.uk-form-success:focus {
  color: #32d296;
  border-color: #32d296;
}
/*
 * Blank
 */
.uk-form-blank {
  background: none;
  border-color: transparent;
}
.uk-form-blank:focus {
  border-color: #e5e5e5;
  border-style: dashed;
}
/* Width modifiers (`uk-input`, `uk-select` and `uk-textarea`)
 ========================================================================== */
/*
 * Fixed widths
 * Different widths for mini sized `input` and `select` elements
 */
input.uk-form-width-xsmall {
  width: 50px;
}
select.uk-form-width-xsmall {
  width: 75px;
}
.uk-form-width-small {
  width: 130px;
}
.uk-form-width-medium {
  width: 200px;
}
.uk-form-width-large {
  width: 500px;
}
/* Select
 ========================================================================== */
/*
 * 1. Remove default style. Also works in Firefox
 * 2. Style
 * 3. Remove default style in IE 10/11
 * 4. Set `color` for options in the select dropdown, because the inherited `color` might be too light.
 */
.uk-select:not([multiple]):not([size]) {
  /* 1 */
  -webkit-appearance: none;
  -moz-appearance: none;
  /* 2 */
  padding-right: 20px;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%201%209%206%2015%206%22%20%2F%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%2013%209%208%2015%208%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
  background-repeat: no-repeat;
  background-position: 100% 50%;
}
/* 3 */
.uk-select:not([multiple]):not([size])::-ms-expand {
  display: none;
}
/* 4 */
.uk-select:not([multiple]):not([size]) option {
  color: #444;
}
/*
 * Disabled
 */
.uk-select:not([multiple]):not([size]):disabled {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23999%22%20points%3D%2212%201%209%206%2015%206%22%20%2F%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23999%22%20points%3D%2212%2013%209%208%2015%208%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
/* Datalist
 ========================================================================== */
/*
 * 1. Remove default style in Chrome
 */
.uk-input[list] {
  padding-right: 20px;
  background-repeat: no-repeat;
  background-position: 100% 50%;
}
.uk-input[list]:hover,
.uk-input[list]:focus {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%2012%208%206%2016%206%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
/* 1 */
.uk-input[list]::-webkit-calendar-picker-indicator {
  display: none;
}
/* Radio and checkbox
 * Note: Does not work in IE11
 ========================================================================== */
/*
 * 1. Style
 * 2. Make box more robust so it clips the child element
 * 3. Vertical alignment
 * 4. Remove default style
 * 5. Fix black background on iOS
 * 6. Center icons
 */
.uk-radio,
.uk-checkbox {
  /* 1 */
  display: inline-block;
  height: 16px;
  width: 16px;
  /* 2 */
  overflow: hidden;
  /* 3 */
  margin-top: -4px;
  vertical-align: middle;
  /* 4 */
  -webkit-appearance: none;
  -moz-appearance: none;
  /* 5 */
  background-color: transparent;
  /* 6 */
  background-repeat: no-repeat;
  background-position: 50% 50%;
  border: 1px solid #cccccc;
  transition: 0.2s ease-in-out;
  transition-property: background-color, border;
  border-radius: 4px;
}
.uk-radio {
  border-radius: 50%;
}
/* Focus */
.uk-radio:focus,
.uk-checkbox:focus {
  outline: none;
  border-color: #383a62;
}
/*
 * Checked
 */
.uk-radio:checked,
.uk-checkbox:checked,
.uk-checkbox:indeterminate {
  background-color: #383a62;
  border-color: transparent;
}
/* Focus */
.uk-radio:checked:focus,
.uk-checkbox:checked:focus,
.uk-checkbox:indeterminate:focus {
  background-color: #383a62;
}
/*
 * Icons
 */
.uk-radio:checked {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23fff%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-checkbox:checked {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23fff%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.uk-checkbox:indeterminate {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23fff%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
/*
 * Disabled
 */
.uk-radio:disabled,
.uk-checkbox:disabled {
  background-color: #f8f8f8;
  border-color: #e5e5e5;
}
.uk-radio:disabled:checked {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23999%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-checkbox:disabled:checked {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23999%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.uk-checkbox:disabled:indeterminate {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23999%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
/* Legend
 ========================================================================== */
/*
 * Legend
 * 1. Behave like block element
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove padding so people aren't caught out if they zero out fieldsets.
 * 4. Style
 */
.uk-legend {
  /* 1 */
  width: 100%;
  /* 2 */
  color: inherit;
  /* 3 */
  padding: 0;
  /* 4 */
  font-size: 1.5rem;
  line-height: 1.4;
}
/* Custom controls
 ========================================================================== */
/*
 * 1. Container fits its content
 * 2. Create position context
 * 3. Prevent content overflow
 * 4. Behave like most inline-block elements
 */
.uk-form-custom {
  /* 1 */
  display: inline-block;
  /* 2 */
  position: relative;
  /* 3 */
  max-width: 100%;
  /* 4 */
  vertical-align: middle;
}
/*
 * 1. Position and resize the form control to always cover its container
 * 2. Required for Firefox for positioning to the left
 * 3. Required for Webkit to make `height` work
 * 4. Hide controle and show cursor
 * 5. Needed for the cursor
 * 6. Clip height caused by 5. Needed for Webkit only
 */
.uk-form-custom select,
.uk-form-custom input[type="file"] {
  /* 1 */
  position: absolute;
  top: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  /* 2 */
  left: 0;
  /* 3 */
  -webkit-appearance: none;
  /* 4 */
  opacity: 0;
  cursor: pointer;
}
.uk-form-custom input[type="file"] {
  /* 5 */
  font-size: 500px;
  /* 6 */
  overflow: hidden;
}
/* Label
 ========================================================================== */
.uk-form-label {
  color: #3e416d;
  font-size: 15px;
  margin-bottom: 5px;
  display: block;
  font-weight: 600;
}
/* form group
 ========================================================================== */
 .uk-form-group {
  margin-bottom: 15px;
}
/* Layout
 ========================================================================== */
/*
 * Stacked
 */
.uk-form-stacked .uk-form-label {
  display: block;
  margin-bottom: 5px;
}
/*
 * Horizontal
 */
/* Tablet portrait and smaller */
@media (max-width: 959px) {
  /* Behave like `uk-form-stacked` */
  .uk-form-horizontal .uk-form-label {
    display: block;
    margin-bottom: 5px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-form-horizontal .uk-form-label {
    width: 200px;
    margin-top: 7px;
    float: left;
  }
  .uk-form-horizontal .uk-form-controls {
    margin-left: 215px;
  }
  /* Better vertical alignment if controls are checkboxes and radio buttons with text */
  .uk-form-horizontal .uk-form-controls-text {
    padding-top: 7px;
  }
}
/* Icons
 ========================================================================== */
/*
 * 1. Set position
 * 2. Set width
 * 3. Center icon vertically and horizontally
 * 4. Style
 */
.uk-form-icon {
  /* 1 */
  position: absolute;
  top: 0;
  bottom: 0;
  left: 5px;
  /* 2 */
  width: 40px;
  /* 3 */
  display: inline-flex;
  justify-content: center;
  align-items: center;
  /* 4 */
  color: #999;
}
/*
 * Required for `a`.
 */
.uk-form-icon:hover {
  color: #666;
}
/*
 * Make `input` element clickable through icon, e.g. if it's a `span`
 */
.uk-form-icon:not(a):not(button):not(input) {
  pointer-events: none;
}
/*
 * Input padding
 */
.uk-form-icon:not(.uk-form-icon-flip) ~ .uk-input {
  padding-left: 40px !important;
}
/*
 * Position modifier
 */
.uk-form-icon-flip {
  right: 5px;
  left: auto;
}
.uk-form-icon-flip ~ .uk-input {
  padding-right: 40px !important;
}
/* ========================================================================
   Component: Button
 ========================================================================== */
/*
 * 1. Remove margins in Chrome, Safari and Opera.
 * 2. Remove borders for `button`.
 * 3. Address `overflow` set to `hidden` in IE.
 * 4. Correct `font` properties and `color` not being inherited for `button`.
 * 5. Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 6. Remove default style for `input type="submit"`in iOS.
 * 7. Style
 * 8. `line-height` is used to create a height because it also centers the text vertically for `a` elements.
 *    Better would be to use height and flexbox to center the text vertically but flexbox doesn't work in Firefox on `button` elements.
 * 9. Align text if button has a width
 * 10. Required for `a`.
 */
.uk-button {
  position: relative;
    display: inline-block;
    font-weight: 600;
    /* color: #ffffff; */
    /* background-color: #d4d4d4; */
    text-align: center;
    vertical-align: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    /* box-shadow: 0 4px 12px rgba(102,103,107,0.15); */
    border: 1px solid transparent;
    padding: 10px 17px;
    line-height: 17px;
    font-size: 13px;
    border-radius: 6px;
  
}
.uk-button:not(:disabled) {
  cursor: pointer;
}
/*
 * Remove the inner border and padding in Firefox.
 */
.uk-button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
/* Hover */
.uk-button:hover {
  /* 9 */
  text-decoration: none;
}
/* Focus */
.uk-button:focus {
  outline: none;
}
/* OnClick + Active */
/* Style modifiers
 ========================================================================== */
/*
 * Default
 */
.uk-button-default {
  background-color: transparent;
  color: #333;
  border: 1px solid #e5e5e5;
}
/* Hover + Focus */
.uk-button-default:hover,
.uk-button-default:focus {
  background-color: transparent;
  color: #333;
  border-color: #b2b2b2;
}
/* OnClick + Active */
.uk-button-default:active,
.uk-button-default.uk-active {
  background-color: transparent;
  color: #333;
  border-color: #999999;
}
/*
 * Primary
 */
.uk-button-primary {
  background-color: #1e87f0;
  color: #fff;
  border: 1px solid transparent;
}
/* Hover + Focus */
.uk-button-primary:hover,
.uk-button-primary:focus {
  background-color: #0f7ae5;
  color: #fff;
}
/* OnClick + Active */
.uk-button-primary:active,
.uk-button-primary.uk-active {
  background-color: #0e6dcd;
  color: #fff;
}
/*
 * Secondary
 */
.uk-button-secondary {
  background-color: #222;
  color: #fff;
  border: 1px solid transparent;
}
/* Hover + Focus */
.uk-button-secondary:hover,
.uk-button-secondary:focus {
  background-color: #151515;
  color: #fff;
}
/* OnClick + Active */
.uk-button-secondary:active,
.uk-button-secondary.uk-active {
  background-color: #080808;
  color: #fff;
}
/*
 * Danger
 */
.uk-button-danger {
  background-color: #f0506e;
  color: #fff;
  border: 1px solid transparent;
}
/* Hover + Focus */
.uk-button-danger:hover,
.uk-button-danger:focus {
  background-color: #ee395b;
  color: #fff;
}
/* OnClick + Active */
.uk-button-danger:active,
.uk-button-danger.uk-active {
  background-color: #ec2147;
  color: #fff;
}
/*
 * Disabled
 * The same for all style modifiers
 */
.uk-button-default:disabled,
.uk-button-primary:disabled,
.uk-button-secondary:disabled,
.uk-button-danger:disabled {
  background-color: transparent;
  color: #999;
  border-color: #e5e5e5;
}
/* Size modifiers
 ========================================================================== */
.uk-button-small {
  padding: 0 15px;
  line-height: 28px;
  font-size: 0.875rem;
}
.uk-button-large {
  padding: 0 40px;
  line-height: 53px;
  /* font-size: 0.875rem; */
}
/* Text modifiers
 ========================================================================== */
/*
 * Text
 * 1. Reset
 * 2. Style
 */
.uk-button-text {
  /* 1 */
  padding: 0;
  line-height: 1.5;
  background: none;
  /* 2 */
  color: #333;
  position: relative;
}
.uk-button-text::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 100%;
  border-bottom: 1px solid #333;
  transition: right 0.3s ease-out;
}
/* Hover + Focus */
.uk-button-text:hover,
.uk-button-text:focus {
  color: #333;
}
.uk-button-text:hover::before,
.uk-button-text:focus::before {
  right: 0;
}
/* Disabled */
.uk-button-text:disabled {
  color: #999;
}
.uk-button-text:disabled::before {
  display: none;
}
/*
 * Link
 * 1. Reset
 * 2. Style
 */
.uk-button-link {
  /* 1 */
  padding: 0;
  line-height: 1.5;
  background: none;
  /* 2 */
  color: #1e87f0;
}
/* Hover + Focus */
.uk-button-link:hover,
.uk-button-link:focus {
  color: #0f6ecd;
  text-decoration: underline;
}
/* Disabled */
.uk-button-link:disabled {
  color: #999;
  text-decoration: none;
}
/* Group
 ========================================================================== */
/*
 * 1. Using `flex` instead of `inline-block` to prevent whitespace betweent child elements
 * 2. Behave like button
 * 3. Create position context
 */
.uk-button-group {
  /* 1 */
  display: inline-flex;
  /* 2 */
  vertical-align: middle;
  /* 3 */
  position: relative;
}
/* Group
     ========================================================================== */
/*
     * Collapse border
     */
.uk-button-group > .uk-button:nth-child(n+2),
.uk-button-group > div:nth-child(n+2) .uk-button {
  margin-left: -1px;
}
/*
     * Create position context to superimpose the successor elements border
     * Known issue: If you use an `a` element as button and an icon inside,
     * the active state will not work if you click the icon inside the button
     * Workaround: Just use a `button` or `input` element as button
     */
.uk-button-group .uk-button:hover,
.uk-button-group .uk-button:focus,
.uk-button-group .uk-button:active,
.uk-button-group .uk-button.uk-active {
  position: relative;
  z-index: 1;
}
/* ========================================================================
   Component: Section
 ========================================================================== */
/*
 * 1. Make it work with `100vh` and height in general
 */
.uk-section {
  box-sizing: border-box;
  /* 1 */
  padding-top: 40px;
  padding-bottom: 40px;
}
/* Desktop and bigger */
@media (min-width: 960px) {
  .uk-section {
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
/*
 * Micro clearfix
 */
.uk-section::before,
.uk-section::after {
  content: "";
  display: table;
}
.uk-section::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-section > :last-child {
  margin-bottom: 0;
}
/* Size modifiers
 ========================================================================== */
/*
 * XSmall
 */
.uk-section-xsmall {
  padding-top: 20px;
  padding-bottom: 20px;
}
/*
 * Small
 */
.uk-section-small {
  padding-top: 40px;
  padding-bottom: 40px;
}
/*
 * Large
 */
.uk-section-large {
  padding-top: 70px;
  padding-bottom: 70px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-section-large {
    padding-top: 140px;
    padding-bottom: 140px;
  }
}
/*
 * XLarge
 */
.uk-section-xlarge {
  padding-top: 140px;
  padding-bottom: 140px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-section-xlarge {
    padding-top: 210px;
    padding-bottom: 210px;
  }
}
/* Style modifiers
 ========================================================================== */
/*
 * Default
 */
.uk-section-default {
  background: #fff;
}
/*
 * Muted
 */
.uk-section-muted {
  background: #f8f8f8;
}
/*
 * Primary
 */
.uk-section-primary {
  background: #1e87f0;
}
/*
 * Secondary
 */
.uk-section-secondary {
  background: #222;
}
/* Overlap modifier
 ========================================================================== */
/*
 * Reserved modifier to make a section overlap another section with an border image
 * Implemented by the theme
 */
/* ========================================================================
   Component: Container
 ========================================================================== */
/*
 * 1. Box sizing has to be `content-box` so the max-width is always the same and
 *    unaffected by the padding on different breakpoints. It's important for the size modifiers.
 */
.uk-container {
  /* 1 */
  box-sizing: content-box;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-container {
    padding-left: 30px;
    padding-right: 30px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-container {
    padding-left: 40px;
    padding-right: 40px;
  }
}
/*
 * Micro clearfix
 */
.uk-container::before,
.uk-container::after {
  content: "";
  display: table;
}
.uk-container::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-container > :last-child {
  margin-bottom: 0;
}
/*
 * Remove padding from nested containers
 */
.uk-container .uk-container {
  padding-left: 0;
  padding-right: 0;
}
/* Size modifier
 ========================================================================== */
.uk-container-xsmall {
  max-width: 750px;
}
.uk-container-small {
  max-width: 900px;
}
.uk-container-large {
  max-width: 1600px;
}
.uk-container-expand {
  max-width: none;
}
/* Expand modifier
 ========================================================================== */
/*
 * Expand one side only
 */
.uk-container-expand-left {
  margin-left: 0;
}
.uk-container-expand-right {
  margin-right: 0;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-container-expand-left.uk-container-xsmall,
  .uk-container-expand-right.uk-container-xsmall {
    max-width: calc(50% + (750px / 2) - 30px);
  }
  .uk-container-expand-left.uk-container-small,
  .uk-container-expand-right.uk-container-small {
    max-width: calc(50% + (900px / 2) - 30px);
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-container-expand-left,
  .uk-container-expand-right {
    max-width: calc(50% + (1200px / 2) - 40px);
  }
  .uk-container-expand-left.uk-container-xsmall,
  .uk-container-expand-right.uk-container-xsmall {
    max-width: calc(50% + (750px / 2) - 40px);
  }
  .uk-container-expand-left.uk-container-small,
  .uk-container-expand-right.uk-container-small {
    max-width: calc(50% + (900px / 2) - 40px);
  }
  .uk-container-expand-left.uk-container-large,
  .uk-container-expand-right.uk-container-large {
    max-width: calc(50% + (1600px / 2) - 40px);
  }
}
/* Item
 ========================================================================== */
/*
 * Utility classes to reset container padding on the left or right side
 * Note: It has to be negative margin on the item, because it's specific to the item.
 */
.uk-container-item-padding-remove-left,
.uk-container-item-padding-remove-right {
  width: calc(100% + 15px);
}
.uk-container-item-padding-remove-left {
  margin-left: -15px;
}
.uk-container-item-padding-remove-right {
  margin-right: -15px;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-container-item-padding-remove-left,
  .uk-container-item-padding-remove-right {
    width: calc(100% + 30px);
  }
  .uk-container-item-padding-remove-left {
    margin-left: -30px;
  }
  .uk-container-item-padding-remove-right {
    margin-right: -30px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-container-item-padding-remove-left,
  .uk-container-item-padding-remove-right {
    width: calc(100% + 40px);
  }
  .uk-container-item-padding-remove-left {
    margin-left: -40px;
  }
  .uk-container-item-padding-remove-right {
    margin-right: -40px;
  }
}
/* ========================================================================
   Component: Grid
 ========================================================================== */
/*
 * 1. Allow cells to wrap into the next line
 * 2. Reset list
 */
.uk-grid {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin: 0;
  padding: 0;
  list-style: none;
  position: unset;
}
/*
 * Grid cell
 * Note: Space is allocated solely based on content dimensions, but shrinks: 0 1 auto
 * Reset margin for e.g. paragraphs
 */
.uk-grid > * {
  margin: 0;
}
/*
 * Remove margin from the last-child
 */
.uk-grid > * > :last-child {
  margin-bottom: 0;
}
/* Gutter
 ========================================================================== */
/*
 * Default
 */
/* Horizontal */
.uk-grid {
  margin-left: -30px;
}
.uk-grid > * {
  padding-left: 30px;
}
/* Vertical */
.uk-grid + .uk-grid,
.uk-grid > .uk-grid-margin,
* + .uk-grid-margin {
  margin-top: 30px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  /* Horizontal */
  .uk-grid {
    margin-left: -30px;
  }
  .uk-grid > * {
    padding-left: 30px;
  }
  /* Vertical */
  .uk-grid + .uk-grid,
  .uk-grid > .uk-grid-margin,
  * + .uk-grid-margin {
    margin-top: 30px;
  }
}
/*
 * Small
 */
/* Horizontal */
.uk-grid-small,
.uk-grid-column-small {
  margin-left: -15px;
}
.uk-grid-small > *,
.uk-grid-column-small > * {
  padding-left: 15px;
}
/* Vertical */
.uk-grid + .uk-grid-small,
.uk-grid + .uk-grid-row-small,
.uk-grid-small > .uk-grid-margin,
.uk-grid-row-small > .uk-grid-margin,
* + .uk-grid-margin-small {
  margin-top: 15px;
}
/*
 * Medium
 */
/* Horizontal */
.uk-grid-medium,
.uk-grid-column-medium {
  margin-left: -30px;
}
.uk-grid-medium > *,
.uk-grid-column-medium > * {
  padding-left: 30px;
}
/* Vertical */
.uk-grid + .uk-grid-medium,
.uk-grid + .uk-grid-row-medium,
.uk-grid-medium > .uk-grid-margin,
.uk-grid-row-medium > .uk-grid-margin,
* + .uk-grid-margin-medium {
  margin-top: 30px;
}
/*
 * Large
 */
/* Horizontal */
.uk-grid-large,
.uk-grid-column-large {
  margin-left: -40px;
}
.uk-grid-large > *,
.uk-grid-column-large > * {
  padding-left: 40px;
}
/* Vertical */
.uk-grid + .uk-grid-large,
.uk-grid + .uk-grid-row-large,
.uk-grid-large > .uk-grid-margin,
.uk-grid-row-large > .uk-grid-margin,
* + .uk-grid-margin-large {
  margin-top: 30px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  /* Horizontal */
  .uk-grid-large,
  .uk-grid-column-large {
    margin-left: -70px;
  }
  .uk-grid-large > *,
  .uk-grid-column-large > * {
    padding-left: 70px;
  }
  /* Vertical */
  .uk-grid + .uk-grid-large,
  .uk-grid + .uk-grid-row-large,
  .uk-grid-large > .uk-grid-margin,
  .uk-grid-row-large > .uk-grid-margin,
  * + .uk-grid-margin-large {
    margin-top: 70px;
  }
}
/*
 * Collapse
 */
/* Horizontal */
.uk-grid-collapse,
.uk-grid-column-collapse {
  margin-left: 0;
}
.uk-grid-collapse > *,
.uk-grid-column-collapse > * {
  padding-left: 0;
}
/* Vertical */
.uk-grid + .uk-grid-collapse,
.uk-grid + .uk-grid-row-collapse,
.uk-grid-collapse > .uk-grid-margin,
.uk-grid-row-collapse > .uk-grid-margin {
  margin-top: 0;
}
/* Divider
 ========================================================================== */
.uk-grid-divider > * {
  position: relative;
}
.uk-grid-divider > :not(.uk-first-column)::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  border-left: 1px solid #e5e5e5;
}
/* Vertical */
.uk-grid-divider.uk-grid-stack > .uk-grid-margin::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  border-top: 1px solid #e5e5e5;
}
/*
 * Default
 */
/* Horizontal */
.uk-grid-divider {
  margin-left: -60px;
}
.uk-grid-divider > * {
  padding-left: 60px;
}
.uk-grid-divider > :not(.uk-first-column)::before {
  left: 30px;
}
/* Vertical */
.uk-grid-divider.uk-grid-stack > .uk-grid-margin {
  margin-top: 60px;
}
.uk-grid-divider.uk-grid-stack > .uk-grid-margin::before {
  top: -30px;
  left: 60px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  /* Horizontal */
  .uk-grid-divider {
    margin-left: -80px;
  }
  .uk-grid-divider > * {
    padding-left: 80px;
  }
  .uk-grid-divider > :not(.uk-first-column)::before {
    left: 40px;
  }
  /* Vertical */
  .uk-grid-divider.uk-grid-stack > .uk-grid-margin {
    margin-top: 80px;
  }
  .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before {
    top: -40px;
    left: 80px;
  }
}
/*
 * Small
 */
/* Horizontal */
.uk-grid-divider.uk-grid-small,
.uk-grid-divider.uk-grid-column-small {
  margin-left: -30px;
}
.uk-grid-divider.uk-grid-small > *,
.uk-grid-divider.uk-grid-column-small > * {
  padding-left: 30px;
}
.uk-grid-divider.uk-grid-small > :not(.uk-first-column)::before,
.uk-grid-divider.uk-grid-column-small > :not(.uk-first-column)::before {
  left: 15px;
}
/* Vertical */
.uk-grid-divider.uk-grid-small.uk-grid-stack > .uk-grid-margin,
.uk-grid-divider.uk-grid-row-small.uk-grid-stack > .uk-grid-margin {
  margin-top: 30px;
}
.uk-grid-divider.uk-grid-small.uk-grid-stack > .uk-grid-margin::before {
  top: -15px;
  left: 30px;
}
.uk-grid-divider.uk-grid-row-small.uk-grid-stack > .uk-grid-margin::before {
  top: -15px;
}
.uk-grid-divider.uk-grid-column-small.uk-grid-stack > .uk-grid-margin::before {
  left: 30px;
}
/*
 * Medium
 */
/* Horizontal */
.uk-grid-divider.uk-grid-medium,
.uk-grid-divider.uk-grid-column-medium {
  margin-left: -60px;
}
.uk-grid-divider.uk-grid-medium > *,
.uk-grid-divider.uk-grid-column-medium > * {
  padding-left: 60px;
}
.uk-grid-divider.uk-grid-medium > :not(.uk-first-column)::before,
.uk-grid-divider.uk-grid-column-medium > :not(.uk-first-column)::before {
  left: 30px;
}
/* Vertical */
.uk-grid-divider.uk-grid-medium.uk-grid-stack > .uk-grid-margin,
.uk-grid-divider.uk-grid-row-medium.uk-grid-stack > .uk-grid-margin {
  margin-top: 60px;
}
.uk-grid-divider.uk-grid-medium.uk-grid-stack > .uk-grid-margin::before {
  top: -30px;
  left: 60px;
}
.uk-grid-divider.uk-grid-row-medium.uk-grid-stack > .uk-grid-margin::before {
  top: -30px;
}
.uk-grid-divider.uk-grid-column-medium.uk-grid-stack > .uk-grid-margin::before {
  left: 60px;
}
/*
 * Large
 */
/* Horizontal */
.uk-grid-divider.uk-grid-large,
.uk-grid-divider.uk-grid-column-large {
  margin-left: -80px;
}
.uk-grid-divider.uk-grid-large > *,
.uk-grid-divider.uk-grid-column-large > * {
  padding-left: 80px;
}
.uk-grid-divider.uk-grid-large > :not(.uk-first-column)::before,
.uk-grid-divider.uk-grid-column-large > :not(.uk-first-column)::before {
  left: 40px;
}
/* Vertical */
.uk-grid-divider.uk-grid-large.uk-grid-stack > .uk-grid-margin,
.uk-grid-divider.uk-grid-row-large.uk-grid-stack > .uk-grid-margin {
  margin-top: 80px;
}
.uk-grid-divider.uk-grid-large.uk-grid-stack > .uk-grid-margin::before {
  top: -40px;
  left: 80px;
}
.uk-grid-divider.uk-grid-row-large.uk-grid-stack > .uk-grid-margin::before {
  top: -40px;
}
.uk-grid-divider.uk-grid-column-large.uk-grid-stack > .uk-grid-margin::before {
  left: 80px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  /* Horizontal */
  .uk-grid-divider.uk-grid-large,
  .uk-grid-divider.uk-grid-column-large {
    margin-left: -140px;
  }
  .uk-grid-divider.uk-grid-large > *,
  .uk-grid-divider.uk-grid-column-large > * {
    padding-left: 140px;
  }
  .uk-grid-divider.uk-grid-large > :not(.uk-first-column)::before,
  .uk-grid-divider.uk-grid-column-large > :not(.uk-first-column)::before {
    left: 70px;
  }
  /* Vertical */
  .uk-grid-divider.uk-grid-large.uk-grid-stack > .uk-grid-margin,
  .uk-grid-divider.uk-grid-row-large.uk-grid-stack > .uk-grid-margin {
    margin-top: 140px;
  }
  .uk-grid-divider.uk-grid-large.uk-grid-stack > .uk-grid-margin::before {
    top: -70px;
    left: 140px;
  }
  .uk-grid-divider.uk-grid-row-large.uk-grid-stack > .uk-grid-margin::before {
    top: -70px;
  }
  .uk-grid-divider.uk-grid-column-large.uk-grid-stack > .uk-grid-margin::before {
    left: 140px;
  }
}
/* Match child of a grid cell
 ========================================================================== */
/*
 * Behave like a block element
 * 1. Wrap into the next line
 * 2. Take the full width, at least 100%. Only if no class from the Width component is set.
 * 3. Expand width even if larger than 100%, e.g. because of negative margin (Needed for nested grids)
 */
.uk-grid-match > *,
.uk-grid-item-match {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
}
.uk-grid-match > * > :not([class*='uk-width']),
.uk-grid-item-match > :not([class*='uk-width']) {
  /* 2 */
  box-sizing: border-box;
  width: 100%;
  /* 3 */
  flex: auto;
}
/* ========================================================================
   Component: Tile
 ========================================================================== */
.uk-tile {
  position: relative;
  box-sizing: border-box;
  padding-left: 15px;
  padding-right: 15px;
  padding-top: 40px;
  padding-bottom: 40px;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-tile {
    padding-left: 30px;
    padding-right: 30px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-tile {
    padding-left: 40px;
    padding-right: 40px;
    padding-top: 70px;
    padding-bottom: 70px;
  }
}
/*
 * Micro clearfix
 */
.uk-tile::before,
.uk-tile::after {
  content: "";
  display: table;
}
.uk-tile::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-tile > :last-child {
  margin-bottom: 0;
}
/* Size modifiers
 ========================================================================== */
/*
 * XSmall
 */
.uk-tile-xsmall {
  padding-top: 20px;
  padding-bottom: 20px;
}
/*
 * Small
 */
.uk-tile-small {
  padding-top: 40px;
  padding-bottom: 40px;
}
/*
 * Large
 */
.uk-tile-large {
  padding-top: 70px;
  padding-bottom: 70px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-tile-large {
    padding-top: 140px;
    padding-bottom: 140px;
  }
}
/*
 * XLarge
 */
.uk-tile-xlarge {
  padding-top: 140px;
  padding-bottom: 140px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-tile-xlarge {
    padding-top: 210px;
    padding-bottom: 210px;
  }
}
/* Style modifiers
 ========================================================================== */
/*
 * Default
 */
.uk-tile-default {
  background: #fff;
}
/*
 * Muted
 */
.uk-tile-muted {
  background: #f8f8f8;
}
/*
 * Primary
 */
.uk-tile-primary {
  background: #1e87f0;
}
/*
 * Secondary
 */
.uk-tile-secondary {
  background: #222;
}
/* ========================================================================
   Component: Card
 ========================================================================== */
.uk-card {
  position: relative;
  box-sizing: border-box;
  transition: box-shadow 0.1s ease-in-out;
}
/* Sections
 ========================================================================== */
.uk-card-body {
  padding: 20px;
}
.uk-card-header {
  padding: 15px 30px;
}
.uk-card-footer {
  padding: 15px 30px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-card-body {
    padding: 30px;
  }
  .uk-card-header {
    padding: 20px 30px;
  }
  .uk-card-footer {
    padding: 20px 40px;
  }
}
/*
 * Micro clearfix
 */
.uk-card-body::before,
.uk-card-body::after,
.uk-card-header::before,
.uk-card-header::after,
.uk-card-footer::before,
.uk-card-footer::after {
  content: "";
  display: table;
}
.uk-card-body::after,
.uk-card-header::after,
.uk-card-footer::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-card-body > :last-child,
.uk-card-header > :last-child,
.uk-card-footer > :last-child {
  margin-bottom: 0;
}
/* Media
 ========================================================================== */
/*
 * Reserved alignment modifier to style the media element, e.g. with `border-radius`
 * Implemented by the theme
 */
/* Title
 ========================================================================== */
.uk-card-title {
  font-size: 1.5rem;
  line-height: 1.4;
}
/* Badge
 ========================================================================== */
.uk-card-badge {
  position: absolute;
  top: 30px;
  right: 30px;
  z-index: 1;
}
/*
 * Remove margin from adjacent element
 */
.uk-card-badge:first-child + * {
  margin-top: 0;
}
/* Hover modifier
 ========================================================================== */
.uk-card-hover:not(.uk-card-default):not(.uk-card-primary):not(.uk-card-secondary):hover {
  background: #fff;
  box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}
/* Style modifiers
 ========================================================================== */
/*
 * Default
 * Note: Header and Footer are only implemented for the default style
 */
.uk-card-default {
  background: #fff;
  color: #666;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
  box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 6px -1px, rgba(0, 0, 0, 0.06) 0px 2px 4px -1px !important;
}
.uk-card-default .uk-card-title {
  color: #333;
}
.uk-card-default.uk-card-hover:hover {
  background-color: #fff;
  box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}
.uk-card-default .uk-card-header {
  border-bottom: 1px solid #e5e5e5;
}
.uk-card-default .uk-card-footer {
  border-top: 1px solid #e5e5e5;
}
/*
 * Primary
 */
.uk-card-primary {
  background: #1e87f0;
  color: #fff;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}
.uk-card-primary .uk-card-title {
  color: #fff;
}
.uk-card-primary.uk-card-hover:hover {
  background-color: #1e87f0;
  box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}
/*
 * Secondary
 */
.uk-card-secondary {
  background: #222;
  color: #fff;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}
.uk-card-secondary .uk-card-title {
  color: #fff;
}
.uk-card-secondary.uk-card-hover:hover {
  background-color: #222;
  box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}
/* Size modifier
 ========================================================================== */
/*
 * Small
 */
.uk-card-small.uk-card-body,
.uk-card-small .uk-card-body {
  padding: 20px 20px;
}
.uk-card-small .uk-card-header {
  padding: 13px 20px;
}
.uk-card-small .uk-card-footer {
  padding: 13px 20px;
}
/*
 * Large
 */
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-card-large.uk-card-body,
  .uk-card-large .uk-card-body {
    padding: 70px 70px;
  }
  .uk-card-large .uk-card-header {
    padding: 35px 70px;
  }
  .uk-card-large .uk-card-footer {
    padding: 35px 70px;
  }
}
/*
     * Default
     */
.uk-card-body > .uk-nav-default {
  margin-left: -30px;
  margin-right: -30px;
}
.uk-card-body > .uk-nav-default:only-child {
  margin-top: -15px;
  margin-bottom: -15px;
}
.uk-card-body .uk-nav-default > li > a,
.uk-card-body .uk-nav-default .uk-nav-header,
.uk-card-body .uk-nav-default .uk-nav-divider {
  padding-left: 30px;
  padding-right: 30px;
}
.uk-card-body .uk-nav-default .uk-nav-sub {
  padding-left: 45px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-card-body > .uk-nav-default {
    margin-left: -40px;
    margin-right: -40px;
  }
  .uk-card-body > .uk-nav-default:only-child {
    margin-top: -25px;
    margin-bottom: -25px;
  }
  .uk-card-body .uk-nav-default > li > a,
  .uk-card-body .uk-nav-default .uk-nav-header,
  .uk-card-body .uk-nav-default .uk-nav-divider {
    padding-left: 40px;
    padding-right: 40px;
  }
  .uk-card-body .uk-nav-default .uk-nav-sub {
    padding-left: 55px;
  }
}
/*
     * Small
     */
.uk-card-small > .uk-nav-default {
  margin-left: -20px;
  margin-right: -20px;
}
.uk-card-small > .uk-nav-default:only-child {
  margin-top: -5px;
  margin-bottom: -5px;
}
.uk-card-small .uk-nav-default > li > a,
.uk-card-small .uk-nav-default .uk-nav-header,
.uk-card-small .uk-nav-default .uk-nav-divider {
  padding-left: 20px;
  padding-right: 20px;
}
.uk-card-small .uk-nav-default .uk-nav-sub {
  padding-left: 35px;
}
/*
     * Large
     */
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-card-large > .uk-nav-default {
    margin: 0;
  }
  .uk-card-large > .uk-nav-default:only-child {
    margin: 0;
  }
  .uk-card-large .uk-nav-default > li > a,
  .uk-card-large .uk-nav-default .uk-nav-header,
  .uk-card-large .uk-nav-default .uk-nav-divider {
    padding-left: 0;
    padding-right: 0;
  }
  .uk-card-large .uk-nav-default .uk-nav-sub {
    padding-left: 15px;
  }
}
/* ========================================================================
   Component: Close
 ========================================================================== */
/*
 * Adopts `uk-icon`
 */
.uk-close {
  color: #999;
  transition: 0.1s ease-in-out;
  transition-property: color, opacity;
}
/* Hover + Focus */
.uk-close:hover,
.uk-close:focus {
  color: #666;
  outline: none;
}
/* ========================================================================
   Component: Spinner
 ========================================================================== */
/*
 * Adopts `uk-icon`
 */
/* SVG
 ========================================================================== */
.uk-spinner > * {
  animation: uk-spinner-rotate 1.4s linear infinite;
}
@keyframes uk-spinner-rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(270deg);
  }
}
/*
 * Circle
 */
.uk-spinner > * > * {
  stroke-dasharray: 88px;
  stroke-dashoffset: 0;
  transform-origin: center;
  animation: uk-spinner-dash 1.4s ease-in-out infinite;
  stroke-width: 1;
  stroke-linecap: round;
}
@keyframes uk-spinner-dash {
  0% {
    stroke-dashoffset: 88px;
  }
  50% {
    stroke-dashoffset: 22px;
    transform: rotate(135deg);
  }
  100% {
    stroke-dashoffset: 88px;
    transform: rotate(450deg);
  }
}
/* ========================================================================
   Component: Totop
 ========================================================================== */
/*
 * Addopts `uk-icon`
 */
.uk-totop {
  padding: 5px;
  color: #999;
  transition: color 0.1s ease-in-out;
}
/* Hover + Focus */
.uk-totop:hover,
.uk-totop:focus {
  color: #666;
  outline: none;
}
/* OnClick */
.uk-totop:active {
  color: #333;
}
/* ========================================================================
   Component: Marker
 ========================================================================== */
/*
 * Addopts `uk-icon`
 */
.uk-marker {
  padding: 5px;
  background: #222;
  color: #fff;
  border-radius: 500px;
}
/* Hover + Focus */
.uk-marker:hover,
.uk-marker:focus {
  color: #fff;
  outline: none;
}
/* ========================================================================
   Component: Alert
 ========================================================================== */
.uk-alert {
  position: relative;
  margin-bottom: 20px;
  padding: 15px 29px 15px 15px;
  background: #f8f8f8;
  color: #666;
}
/* Add margin if adjacent element */
* + .uk-alert {
  margin-top: 20px;
}
/*
 * Remove margin from the last-child
 */
.uk-alert > :last-child {
  margin-bottom: 0;
}
/* Close
 * Adopts `uk-close`
 ========================================================================== */
.uk-alert-close {
  position: absolute;
  top: 20px;
  right: 15px;
  color: inherit;
  opacity: 0.4;
}
/*
 * Remove margin from adjacent element
 */
.uk-alert-close:first-child + * {
  margin-top: 0;
}
/*
 * Hover + Focus
 */
.uk-alert-close:hover,
.uk-alert-close:focus {
  color: inherit;
  opacity: 0.8;
}
/* Style modifiers
 ========================================================================== */
/*
 * Primary
 */
.uk-alert-primary {
  background: #d8eafc;
  color: #1e87f0;
}
/*
 * Success
 */
.uk-alert-success {
  background: #edfbf6;
  color: #32d296;
}
/*
 * Warning
 */
.uk-alert-warning {
  background: #fff6ee;
  color: #faa05a;
}
/*
 * Danger
 */
.uk-alert-danger {
  background: #fef4f6;
  color: #f0506e;
}
/*
     * Content
     */
.uk-alert h1,
.uk-alert h2,
.uk-alert h3,
.uk-alert h4,
.uk-alert h5,
.uk-alert h6 {
  color: inherit;
}
.uk-alert a:not([class]) {
  color: inherit;
  text-decoration: underline;
}
.uk-alert a:not([class]):hover {
  color: inherit;
  text-decoration: underline;
}
/* ========================================================================
   Component: Badge
 ========================================================================== */
/*
 * 1. Style
 * 2. Center child vertically and horizontally
 */
.uk-badge {
  box-sizing: border-box;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  border-radius: 500px;
  vertical-align: middle;
  /* 1 */
  background: #1e87f0;
  color: #fff;
  font-size: 0.875rem;
  /* 2 */
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
/*
 * Required for `a`
 */
.uk-badge:hover,
.uk-badge:focus {
  color: #fff;
  text-decoration: none;
  outline: none;
}
/* ========================================================================
   Component: Label
 ========================================================================== */
.uk-label {
  display: inline-block;
  padding: 0 10px;
  background: #1e87f0;
  line-height: 1.5;
  font-size: 0.875rem;
  color: #fff;
  vertical-align: middle;
  white-space: nowrap;
  border-radius: 2px;
  text-transform: uppercase;
}
/* Color modifiers
 ========================================================================== */
/*
 * Success
 */
.uk-label-success {
  background-color: #32d296;
  color: #fff;
}
/*
 * Warning
 */
.uk-label-warning {
  background-color: #faa05a;
  color: #fff;
}
/*
 * Danger
 */
.uk-label-danger {
  background-color: #f0506e;
  color: #fff;
}
/* ========================================================================
   Component: Overlay
 ========================================================================== */
.uk-overlay {
  padding: 30px 30px;
}
/*
 * Remove margin from the last-child
 */
.uk-overlay > :last-child {
  margin-bottom: 0;
}
/* Icon
 ========================================================================== */
/* Style modifiers
 ========================================================================== */
/*
 * Default
 */
.uk-overlay-default {
  background: rgba(255, 255, 255, 0.8);
}
/*
 * Primary
 */
.uk-overlay-primary {
  background: rgba(34, 34, 34, 0.8);
}
/* ========================================================================
   Component: Article
 ========================================================================== */
/*
 * Micro clearfix
 */
.uk-article::before,
.uk-article::after {
  content: "";
  display: table;
}
.uk-article::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-article > :last-child {
  margin-bottom: 0;
}
/* Adjacent sibling
 ========================================================================== */
.uk-article + .uk-article {
  margin-top: 70px;
}
/* Title
 ========================================================================== */
.uk-article-title {
  font-size: 2.23125rem;
  line-height: 1.2;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-article-title {
    font-size: 2.625rem;
  }
}
/* Meta
 ========================================================================== */
.uk-article-meta {
  font-size: 0.875rem;
  line-height: 1.4;
  color: #999;
}
.uk-article-meta a {
  color: #999;
}
.uk-article-meta a:hover {
  color: #666;
  text-decoration: none;
}
/* ========================================================================
   Component: Comment
 ========================================================================== */
/* Sections
 ========================================================================== */
.uk-comment-body {
  overflow-wrap: break-word;
  word-wrap: break-word;
}
.uk-comment-header {
  margin-bottom: 20px;
}
/*
 * Micro clearfix
 */
.uk-comment-body::before,
.uk-comment-body::after,
.uk-comment-header::before,
.uk-comment-header::after {
  content: "";
  display: table;
}
.uk-comment-body::after,
.uk-comment-header::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-comment-body > :last-child,
.uk-comment-header > :last-child {
  margin-bottom: 0;
}
/* Title
 ========================================================================== */
.uk-comment-title {
  font-size: 1.25rem;
  line-height: 1.4;
}
/* Meta
 ========================================================================== */
.uk-comment-meta {
  font-size: 0.875rem;
  line-height: 1.4;
  color: #999;
}
/* Avatar
 ========================================================================== */
/* List
 ========================================================================== */
.uk-comment-list {
  padding: 0;
  list-style: none;
}
/* Adjacent siblings */
.uk-comment-list > :nth-child(n+2) {
  margin-top: 70px;
}
/*
 * Sublists
 * Note: General sibling selector allows reply block between comment and sublist
 */
.uk-comment-list .uk-comment ~ ul {
  margin: 70px 0 0 0;
  padding-left: 30px;
  list-style: none;
}
/* Tablet and bigger */
@media (min-width: 960px) {
  .uk-comment-list .uk-comment ~ ul {
    padding-left: 100px;
  }
}
/* Adjacent siblings */
.uk-comment-list .uk-comment ~ ul > :nth-child(n+2) {
  margin-top: 70px;
}
/* Style modifier
 ========================================================================== */
.uk-comment-primary {
  padding: 30px;
  background-color: #f8f8f8;
}
/* ========================================================================
   Component: Search
 ========================================================================== */
/*
 * 1. Container fits its content
 * 2. Create position context
 * 3. Prevent content overflow
 * 4. Reset `form`
 */
.uk-search {
  /* 1 */
  display: inline-block;
  /* 2 */
  position: relative;
  /* 3 */
  max-width: 100%;
  /* 4 */
  margin: 0;
}
/* Input
 ========================================================================== */
/*
 * Remove the inner padding and cancel buttons in Chrome on OS X and Safari on OS X.
 */
.uk-search-input::-webkit-search-cancel-button,
.uk-search-input::-webkit-search-decoration {
  -webkit-appearance: none;
}
/*
 * Removes placeholder transparency in Firefox.
 */
.uk-search-input::-moz-placeholder {
  opacity: 1;
}
/*
 * 1. Define consistent box sizing.
 * 2. Address margins set differently in Firefox/IE and Chrome/Safari/Opera.
 * 3. Remove `border-radius` in iOS.
 * 4. Change font properties to `inherit` in all browsers
 * 5. Show the overflow in Edge.
 * 6. Remove default style in iOS.
 * 7. Vertical alignment
 * 8. Take the full container width
 * 9. Style
 */
.uk-search-input {
  /* 1 */
  box-sizing: border-box;
  /* 2 */
  margin: 0;
  /* 3 */
  border-radius: 0;
  /* 4 */
  font: inherit;
  /* 5 */
  overflow: visible;
  /* 6 */
  -webkit-appearance: none;
  /* 7 */
  vertical-align: middle;
  /* 8 */
  width: 100%;
  /* 9 */
  border: none;
  color: #666;
}
.uk-search-input:focus {
  outline: none;
}
/* Placeholder */
.uk-search-input:-ms-input-placeholder {
  color: #999 !important;
}
.uk-search-input::placeholder {
  color: #999;
}
/* Icon (Adopts `uk-icon`)
 ========================================================================== */
/*
 * Remove default focus style
 */
.uk-search-icon:focus {
  outline: none;
}
/*
 * Position above input
 * 1. Set position
 * 2. Center icon vertically and horizontally
 * 3. Style
 */
.uk-search .uk-search-icon {
  /* 1 */
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  /* 2 */
  display: inline-flex;
  justify-content: center;
  align-items: center;
  /* 3 */
  color: #999;
}
/*
 * Required for `a`.
 */
.uk-search .uk-search-icon:hover {
  color: #999;
}
/*
 * Make `input` element clickable through icon, e.g. if it's a `span`
 */
.uk-search .uk-search-icon:not(a):not(button):not(input) {
  pointer-events: none;
}
/*
 * Position modifier
 */
.uk-search .uk-search-icon-flip {
  right: 0;
  left: auto;
}
/* Default modifier
 ========================================================================== */
.uk-search-default {
  width: 180px;
}
/*
 * Input
 */
.uk-search-default .uk-search-input {
  height: 40px;
  padding-left: 6px;
  padding-right: 6px;
  background: transparent;
  border: 1px solid #e5e5e5;
}
/* Focus */
.uk-search-default .uk-search-input:focus {
  background-color: transparent;
}
/*
 * Icon
 */
.uk-search-default .uk-search-icon {
  width: 40px;
}
.uk-search-default .uk-search-icon:not(.uk-search-icon-flip) ~ .uk-search-input {
  padding-left: 40px;
}
.uk-search-default .uk-search-icon-flip ~ .uk-search-input {
  padding-right: 40px;
}
/* Navbar modifier
 ========================================================================== */
.uk-search-navbar {
  width: 400px;
}
/*
 * Input
 */
.uk-search-navbar .uk-search-input {
  height: 40px;
  background: transparent;
  font-size: 1.5rem;
}
/*
 * Icon
 */
.uk-search-navbar .uk-search-icon {
  width: 40px;
}
.uk-search-navbar .uk-search-icon:not(.uk-search-icon-flip) ~ .uk-search-input {
  padding-left: 40px;
}
.uk-search-navbar .uk-search-icon-flip ~ .uk-search-input {
  padding-right: 40px;
}
/* Large modifier
 ========================================================================== */
.uk-search-large {
  width: 500px;
}
/*
 * Input
 */
.uk-search-large .uk-search-input {
  height: 80px;
  background: transparent;
  font-size: 2.625rem;
}
/*
 * Icon
 */
.uk-search-large .uk-search-icon {
  width: 80px;
}
.uk-search-large .uk-search-icon:not(.uk-search-icon-flip) ~ .uk-search-input {
  padding-left: 80px;
}
.uk-search-large .uk-search-icon-flip ~ .uk-search-input {
  padding-right: 80px;
}
/* Toggle
 ========================================================================== */
.uk-search-toggle {
  color: #999;
}
/* Hover + Focus */
.uk-search-toggle:hover,
.uk-search-toggle:focus {
  color: #666;
}
/* ========================================================================
   Component: Nav
 ========================================================================== */
/*
 * Reset
 * 1. Prepare lists
 * 2. Prepare links
 * 3. Remove default focus style
 */
/* 1 */
.uk-nav,
.uk-nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
/* 2 */
.uk-nav li > a {
  display: block;
  text-decoration: none;
}
/* 3 */
.uk-nav li > a:focus {
  outline: none;
}
/*
 * Items
 * Must target `a` elements to exclude other elements (e.g. lists)
 */
.uk-nav > li > a {
  padding: 7px 0;
}
/* Sublists
 ========================================================================== */
/*
 * Level 2
 * `ul` needed for higher specificity to override padding
 */
ul.uk-nav-sub {
  padding: 5px 0 5px 15px;
}
/*
 * Level 3 and deeper
 */
.uk-nav-sub ul {
  padding-left: 15px;
}
/*
 * Items
 */
.uk-nav-sub a {
  padding: 2px 0;
}
/* Parent icon modifier
 ========================================================================== */
.uk-nav-parent-icon > .uk-parent > a::after {
  content: "";
  width: 1.5em;
  height: 1.5em;
  float: right;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22%23666%22%20stroke-width%3D%221.1%22%20points%3D%2210%201%204%207%2010%2013%22%20%2F%3E%0A%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.uk-nav-parent-icon > .uk-parent.uk-open > a::after {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22%23666%22%20stroke-width%3D%221.1%22%20points%3D%221%204%207%2010%2013%204%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
/* Header
 ========================================================================== */
.uk-nav-header {
  padding: 5px 0;
  text-transform: uppercase;
  font-size: 0.875rem;
}
.uk-nav-header:not(:first-child) {
  margin-top: 20px;
}
/* Divider
 ========================================================================== */
.uk-nav-divider {
  margin: 5px 0;
}
/* Default modifier
 ========================================================================== */
.uk-nav-default {
  font-size: 0.875rem;
}
/*
 * Items
 */
.uk-nav-default > li > a {
  color: #999;
}
/* Hover + Focus */
.uk-nav-default > li > a:hover,
.uk-nav-default > li > a:focus {
  color: #666;
}
/* Active */
.uk-nav-default > li.uk-active > a {
  color: #333;
}
/*
 * Header
 */
.uk-nav-default .uk-nav-header {
  color: #333;
}
/*
 * Divider
 */
.uk-nav-default .uk-nav-divider {
  border-top: 1px solid #e5e5e5;
}
/*
 * Sublists
 */
.uk-nav-default .uk-nav-sub a {
  color: #999;
}
.uk-nav-default .uk-nav-sub a:hover,
.uk-nav-default .uk-nav-sub a:focus {
  color: #666;
}
.uk-nav-default .uk-nav-sub li.uk-active > a {
  color: #333;
}
/* Primary modifier
 ========================================================================== */
/*
 * Items
 */
.uk-nav-primary > li > a {
  font-size: 1.5rem;
  line-height: 1.5;
  color: #999;
}
/* Hover + Focus */
.uk-nav-primary > li > a:hover,
.uk-nav-primary > li > a:focus {
  color: #666;
}
/* Active */
.uk-nav-primary > li.uk-active > a {
  color: #333;
}
/*
 * Header
 */
.uk-nav-primary .uk-nav-header {
  color: #333;
}
/*
 * Divider
 */
.uk-nav-primary .uk-nav-divider {
  border-top: 1px solid #e5e5e5;
}
/*
 * Sublists
 */
.uk-nav-primary .uk-nav-sub a {
  color: #999;
}
.uk-nav-primary .uk-nav-sub a:hover,
.uk-nav-primary .uk-nav-sub a:focus {
  color: #666;
}
.uk-nav-primary .uk-nav-sub li.uk-active > a {
  color: #333;
}
/* Alignment modifier
 ========================================================================== */
.uk-nav-center {
  text-align: center;
}
/* Sublists */
.uk-nav-center .uk-nav-sub,
.uk-nav-center .uk-nav-sub ul {
  padding-left: 0;
}
/* Parent icon modifier  */
.uk-nav-center.uk-nav-parent-icon > .uk-parent > a::after {
  position: absolute;
}
/* ========================================================================
   Component: Navbar
 ========================================================================== */
/*
 * 1. Create position context to center navbar group
 */
.uk-navbar {
  display: flex;
  /* 1 */
  position: relative;
}
/* Container
 ========================================================================== */
.uk-navbar-container:not(.uk-navbar-transparent) {
  background: #f8f8f8;
}
/*
 * Remove pseudo elements created by micro clearfix as precaution (if Container component is used)
 */
.uk-navbar-container > ::before,
.uk-navbar-container > ::after {
  display: none !important;
}
/* Groups
 ========================================================================== */
/*
 * 1. Align navs and items vertically if they have a different height
 * 2. Note: IE 11 requires an extra `div` which affects the center selector
 */
.uk-navbar-left,
.uk-navbar-right,
.uk-navbar-center,
.uk-navbar-center-left > *,
.uk-navbar-center-right > * {
  display: flex;
  /* 1 */
  align-items: center;
}
/*
 * Horizontal alignment
 * 1. Create position context for centered navbar with sub groups (left/right)
 * 2. Fix text wrapping if content is larger than 50% of the container.
 * 3. Needed for dropdowns because a new position context is created
 *    `z-index` must be smaller than off-canvas
 * 4. Align sub groups for centered navbar
 */
.uk-navbar-right {
  margin-left: auto;
}
.uk-navbar-center:only-child {
  margin-left: auto;
  margin-right: auto;
  /* 1 */
  position: relative;
}
.uk-navbar-center:not(:only-child) {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* 2 */
  width: max-content;
  box-sizing: border-box;
  /* 3 */
  z-index: 990;
}
/* 4 */
.uk-navbar-center-left,
.uk-navbar-center-right {
  position: absolute;
  top: 0;
}
.uk-navbar-center-left {
  right: 100%;
}
.uk-navbar-center-right {
  left: 100%;
}
[class*='uk-navbar-center-'] {
  width: max-content;
  box-sizing: border-box;
}
/* Nav
 ========================================================================== */
/*
 * 1. Reset list
 */
.uk-navbar-nav {
  display: flex;
  /* 1 */
  margin: 0;
  padding: 0;
  list-style: none;
}
/*
 * Allow items to wrap into the next line
 * Only not `absolute` positioned groups
 */
.uk-navbar-left,
.uk-navbar-right,
.uk-navbar-center:only-child {
  flex-wrap: wrap;
}
/*
 * Items
 * 1. Center content vertically and horizontally
 * 2. Dimensions
 * 3. Style
 * 4. Required for `a`
 */
.uk-navbar-nav > li > a,
.uk-navbar-item,
.uk-navbar-toggle {
  /* 1 */
  display: flex;
  justify-content: center;
  align-items: center;
  /* 2 */
  box-sizing: border-box;
  min-height: 60px;
  padding: 0 15px;
  /* 3 */
  font-size: 0.92rem;
  /*font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  /* 4 */
  text-decoration: none;
}
/*
 * Nav items
 */
.uk-navbar-nav > li > a {
  color: #999;
  text-transform: uppercase;
  transition: 0.1s ease-in-out;
  transition-property: color, background-color;
  padding: 1.5rem 0.9rem;
}
/*
 * Hover
 * Apply hover style also to focus state and if dropdown is opened
 */
.uk-navbar-nav > li:hover > a,
.uk-navbar-nav > li > a:focus,
.uk-navbar-nav > li > a.uk-open {
  color: #666;
  outline: none;
}
/* OnClick */
.uk-navbar-nav > li > a:active {
  color: #333;
}
/* Active */
.uk-navbar-nav > li.uk-active > a {
  color: #333;
}
/* Item
 ========================================================================== */
.uk-navbar-item {
  color: #666;
}
/* Toggle
 ========================================================================== */
.uk-navbar-toggle {
  color: #999;
}
.uk-navbar-toggle:hover,
.uk-navbar-toggle:focus,
.uk-navbar-toggle.uk-open {
  color: #666;
  outline: none;
  text-decoration: none;
}
/*
 * Icon
 * Adopts `uk-icon`
 */
/* Hover + Focus */
/* Subtitle
 ========================================================================== */
.uk-navbar-subtitle {
  font-size: 0.875rem;
}
/* Style modifiers
 ========================================================================== */
/* Dropdown
 ========================================================================== */
/*
 * Adopts `uk-dropdown`
 * 1. Hide by default
 * 2. Set position
 * 3. Set a default width
 * 4. Style
 */
.uk-navbar-dropdown {
  /* 1 */
  display: none;
  /* 2 */
  position: absolute;
  z-index: 1020;
  /* 3 */
  box-sizing: border-box;
  width: 200px;
  /* 4 */
  padding: 25px;
  background: #fff;
  color: #666;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.15);
}
/* Show */
.uk-navbar-dropdown.uk-open {
  display: block;
}
/*
 * Direction / Alignment modifiers
 */
/* Direction */
[class*='uk-navbar-dropdown-top'] {
  margin-top: -15px;
}
[class*='uk-navbar-dropdown-bottom'] {
  margin-top: 15px;
}
[class*='uk-navbar-dropdown-left'] {
  margin-left: -15px;
}
[class*='uk-navbar-dropdown-right'] {
  margin-left: 15px;
}
/*
 * Grid
 * Adopts `uk-grid`
 */
/* Gutter Horizontal */
.uk-navbar-dropdown-grid {
  margin-left: -50px;
}
.uk-navbar-dropdown-grid > * {
  padding-left: 50px;
}
/* Gutter Vertical */
.uk-navbar-dropdown-grid > .uk-grid-margin {
  margin-top: 50px;
}
/* Stack */
.uk-navbar-dropdown-stack .uk-navbar-dropdown-grid > * {
  width: 100% !important;
}
/*
 * Width modifier
 */
.uk-navbar-dropdown-width-2:not(.uk-navbar-dropdown-stack) {
  width: 400px;
}
.uk-navbar-dropdown-width-3:not(.uk-navbar-dropdown-stack) {
  width: 600px;
}
.uk-navbar-dropdown-width-4:not(.uk-navbar-dropdown-stack) {
  width: 800px;
}
.uk-navbar-dropdown-width-5:not(.uk-navbar-dropdown-stack) {
  width: 1000px;
}
/*
 * Dropbar modifier
 */
.uk-navbar-dropdown-dropbar {
  margin-top: 0;
  margin-bottom: 0;
  box-shadow: none;
}
/* Dropdown Nav
 * Adopts `uk-nav`
 ========================================================================== */
.uk-navbar-dropdown-nav {
  font-size: 0.875rem;
}
/*
 * Items
 */
.uk-navbar-dropdown-nav > li > a {
  color: #999;
}
/* Hover + Focus */
.uk-navbar-dropdown-nav > li > a:hover,
.uk-navbar-dropdown-nav > li > a:focus {
  color: #666;
}
/* Active */
.uk-navbar-dropdown-nav > li.uk-active > a {
  color: #333;
}
/*
 * Header
 */
.uk-navbar-dropdown-nav .uk-nav-header {
  color: #333;
}
/*
 * Divider
 */
.uk-navbar-dropdown-nav .uk-nav-divider {
  border-top: 1px solid #e5e5e5;
}
/*
 * Sublists
 */
.uk-navbar-dropdown-nav .uk-nav-sub a {
  color: #999;
}
.uk-navbar-dropdown-nav .uk-nav-sub a:hover,
.uk-navbar-dropdown-nav .uk-nav-sub a:focus {
  color: #666;
}
.uk-navbar-dropdown-nav .uk-nav-sub li.uk-active > a {
  color: #333;
}
/* Dropbar
 ========================================================================== */
.uk-navbar-dropbar {
  background: #fff;
}
/*
 * Slide modifier
 */
.uk-navbar-dropbar-slide {
  position: absolute;
  z-index: 980;
  left: 0;
  right: 0;
  box-shadow: 0 5px 7px rgba(0, 0, 0, 0.05);
}
/*
     * Navbar
     */
.uk-navbar-container > .uk-container .uk-navbar-left {
  margin-left: -15px;
  margin-right: -15px;
}
.uk-navbar-container > .uk-container .uk-navbar-right {
  margin-right: -15px;
}
/*
     * Grid Divider
     */
.uk-navbar-dropdown-grid > * {
  position: relative;
}
.uk-navbar-dropdown-grid > :not(.uk-first-column)::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 25px;
  border-left: 1px solid #e5e5e5;
}
/* Vertical */
.uk-navbar-dropdown-grid.uk-grid-stack > .uk-grid-margin::before {
  content: "";
  position: absolute;
  top: -25px;
  left: 50px;
  right: 0;
  border-top: 1px solid #e5e5e5;
}
/* ========================================================================
   Component: Subnav
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Gutter
 * 3. Reset list
 */
.uk-subnav {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin-left: -20px;
  /* 3 */
  padding: 0;
  list-style: none;
}
/*
 * 1. Space is allocated solely based on content dimensions: 0 0 auto
 * 2. Gutter
 * 3. Create position context for dropdowns
 */
.uk-subnav > * {
  /* 1 */
  flex: none;
  /* 2 */
  padding-left: 20px;
  /* 3 */
  position: relative;
}
/* Items
 ========================================================================== */
/*
 * Items must target `a` elements to exclude other elements (e.g. dropdowns)
 * Using `:first-child` instead of `a` to support `span` elements for text
 * 1. Prevent gap if child element is `inline-block`, e.g. an icon
 * 2. Style
 */
.uk-subnav > * > :first-child {
  /* 1 */
  display: block;
  /* 2 */
  color: #999;
  font-size: 0.875rem;
  text-transform: uppercase;
  transition: 0.1s ease-in-out;
  transition-property: color, background-color;
}
/* Hover + Focus */
.uk-subnav > * > a:hover,
.uk-subnav > * > a:focus {
  color: #666;
  text-decoration: none;
  outline: none;
}
/* Active */
.uk-subnav > .uk-active > a {
  color: #333;
}
/* Divider modifier
 ========================================================================== */
/*
 * 1. Align items and divider vertically
 */
.uk-subnav-divider > * {
  /* 1 */
  display: flex;
  align-items: center;
}
/*
 * Divider
 * `nth-child` makes it also work without JS if it's only one row
 */
.uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before {
  content: "";
  height: 1.5em;
  margin-left: 0px;
  margin-right: 20px;
  border-left: 1px solid #e5e5e5;
}
/* Pill modifier
 ========================================================================== */
.uk-subnav-pill > * > :first-child {
  padding: 5px 10px;
  background: transparent;
  color: #999;
}
/* Hover + Focus */
.uk-subnav-pill > * > a:hover,
.uk-subnav-pill > * > a:focus {
  background-color: #f8f8f8;
  color: #666;
}
/* OnClick */
.uk-subnav-pill > * > a:active {
  background-color: #f8f8f8;
  color: #666;
}
/* Active */
.uk-subnav-pill > .uk-active > a {
  background-color: #1e87f0;
  color: #fff;
}
/* Disabled
 * The same for all style modifiers
 ========================================================================== */
.uk-subnav > .uk-disabled > a {
  color: #999;
}
/* ========================================================================
   Component: Breadcrumb
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Reset list
 */
.uk-breadcrumb {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  padding: 0;
  list-style: none;
}
/*
 * Space is allocated solely based on content dimensions: 0 0 auto
 */
.uk-breadcrumb > * {
  flex: none;
}
/* Items
 ========================================================================== */
.uk-breadcrumb > * > * {
  display: inline-block;
  font-size: 0.875rem;
  color: #999;
}
/* Hover + Focus */
.uk-breadcrumb > * > :hover,
.uk-breadcrumb > * > :focus {
  color: #666;
  text-decoration: none;
}
/* Disabled */
/* Active */
.uk-breadcrumb > :last-child > * {
  color: #666;
}
/*
 * Divider
 * `nth-child` makes it also work without JS if it's only one row
 */
.uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before {
  content: "/";
  display: inline-block;
  margin: 0 20px;
  color: #999;
}
/* ========================================================================
   Component: Pagination
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Gutter
 * 3. Reset list
 */
.uk-pagination {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin-left: -20px;
  /* 3 */
  padding: 0;
  list-style: none;
}
/*
 * 1. Space is allocated solely based on content dimensions: 0 0 auto
 * 2. Gutter
 * 3. Create position context for dropdowns
 */
.uk-pagination > * {
  /* 1 */
  flex: none;
  /* 2 */
  padding-left: 20px;
  /* 3 */
  position: relative;
}
/* Items
 ========================================================================== */
/*
 * 1. Prevent gap if child element is `inline-block`, e.g. an icon
 * 2. Style
 */
.uk-pagination > * > * {
  /* 1 */
  display: block;
  /* 2 */
  transition: color 0.1s ease-in-out;
  line-height: 1.25;
  color: #77838f;
  background-color: #fff;
  border: 0 solid #77838f;
  padding: 0.5rem 0.75rem;
  border-radius: 5px;
  font-weight: 600;
}
/* Hover + Focus */
.uk-pagination > * > :hover,
.uk-pagination > * > :focus {
  text-decoration: none;
  color: #3e416d;
  background-color: rgba(9, 27, 18, 0.1);
  border-color: rgba(9, 27, 18, 0.1);
}
/* Active */
.uk-pagination > .uk-active > * {
  text-decoration: none;
  color: #ffffff;
  background-color: #3e416d;
  border-color: #3e416d;
}
/* Disabled */
.uk-pagination > .uk-disabled > * {
  text-decoration: none;
  color: #3e416d;
  background-color: rgba(12, 22, 39, 0.1);
  border-color: rgba(12, 22, 39, 0.1);
}
.uk-pagination span { 
  display: inline-flex;  
}

/* ========================================================================
   Component: Tab
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Gutter
 * 3. Reset list
 */
.uk-tab {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin-left: -20px;
  /* 3 */
  padding: 0;
  list-style: none;
  position: relative;
}
.uk-tab::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 20px;
  right: 0;
}
/*
 * 1. Space is allocated solely based on content dimensions: 0 0 auto
 * 2. Gutter
 * 3. Create position context for dropdowns
 */
.uk-tab > * {
  /* 1 */
  flex: none;
  /* 2 */
  padding-left: 20px;
  /* 3 */
  position: relative;
}
/* Items
 ========================================================================== */
/*
 * Items must target `a` elements to exclude other elements (e.g. dropdowns)
 * 1. Center text if a width is set
 * 2. Style
 */
.uk-tab > * > a {
  /* 1 */
  display: block;
  text-align: center;
  /* 2 */
  padding: 10px 10px;
  color: #929292;
  border-bottom: 5px solid transparent;
  transition: color 0.1s ease-in-out;
}
/* Hover + Focus */
.uk-tab > * > a:hover,
.uk-tab > * > a:focus {
  color: #666;
  text-decoration: none;
}
/* Active */
.uk-tab > .uk-active > a {
  color: #3e416d;
  border-color: #be185d;
}
/* Disabled */
.uk-tab > .uk-disabled > a {
  color: #999;
}
/* Position modifier
 ========================================================================== */
/*
 * Bottom
 */
.uk-tab-bottom::before {
  top: 0;
  bottom: auto;
}
.uk-tab-bottom > * > a {
  border-top: 4px solid transparent;
  border-bottom: none;
}
/*
 * Left + Right
 * 1. Reset Gutter
 */
.uk-tab-left,
.uk-tab-right {
  flex-direction: column;
  /* 1 */
  margin-left: 0;
}
/* 1 */
.uk-tab-left > *,
.uk-tab-right > * {
  padding-left: 0;
}
.uk-tab-left::before {
  top: 0;
  bottom: 0;
  left: auto;
  right: 0;
  border-left: 1px solid #e5e5e5;
  border-bottom: none;
}
.uk-tab-right::before {
  top: 0;
  bottom: 0;
  left: 0;
  right: auto;
  border-left: 1px solid #e5e5e5;
  border-bottom: none;
}
.uk-tab-left > * > a {
  text-align: left;
  border-right: 4px solid transparent;
  border-bottom: none;
}
.uk-tab-right > * > a {
  text-align: left;
  border-left: 4px solid transparent;
  border-bottom: none;
}
.uk-tab .uk-dropdown {
  margin-left: 30px;
}
/* ========================================================================
   Component: Slidenav
 ========================================================================== */
/*
 * Adopts `uk-icon`
 */
.uk-slidenav {
  padding: 5px 10px;
  color: rgba(102, 102, 102, 0.5);
  transition: color 0.1s ease-in-out;
}
/* Hover + Focus */
.uk-slidenav:hover,
.uk-slidenav:focus {
  color: rgba(102, 102, 102, 0.9);
  outline: none;
}
/* OnClick */
.uk-slidenav:active {
  color: rgba(102, 102, 102, 0.5);
}
/* Icon modifier
 ========================================================================== */
/*
 * Previous
 */
/*
 * Next
 */
/* Size modifier
 ========================================================================== */
.uk-slidenav-large {
  padding: 10px 10px;
}
/* Container
 ========================================================================== */
.uk-slidenav-container {
  display: flex;
}
/* ========================================================================
   Component: Dotnav
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Reset list
 * 3. Gutter
 */
.uk-dotnav {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin: 0;
  padding: 0;
  list-style: none;
  /* 3 */
  margin-left: -12px;
}
/*
 * 1. Space is allocated solely based on content dimensions: 0 0 auto
 * 2. Gutter
 */
.uk-dotnav > * {
  /* 1 */
  flex: none;
  /* 2 */
  padding-left: 12px;
}
/* Items
 ========================================================================== */
/*
 * Items
 * 1. Hide text if present
 */
.uk-dotnav > * > * {
  display: block;
  box-sizing: border-box;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: transparent;
  /* 1 */
  text-indent: 100%;
  overflow: hidden;
  white-space: nowrap;
  border: 1px solid rgba(102, 102, 102, 0.4);
  transition: 0.2s ease-in-out;
  transition-property: background-color, border-color;
}
/* Hover + Focus */
.uk-dotnav > * > :hover,
.uk-dotnav > * > :focus {
  background-color: rgba(102, 102, 102, 0.6);
  outline: none;
  border-color: transparent;
}
/* OnClick */
.uk-dotnav > * > :active {
  background-color: rgba(102, 102, 102, 0.2);
  border-color: transparent;
}
/* Active */
.uk-dotnav > .uk-active > * {
  background-color: rgba(102, 102, 102, 0.6);
  border-color: transparent;
}
/* Modifier: 'uk-dotnav-vertical'
 ========================================================================== */
/*
 * 1. Change direction
 * 2. Gutter
 */
.uk-dotnav-vertical {
  /* 1 */
  flex-direction: column;
  /* 2 */
  margin-left: 0;
  margin-top: -12px;
}
/* 2 */
.uk-dotnav-vertical > * {
  padding-left: 0;
  padding-top: 12px;
}
/* ========================================================================
   Component: Thumbnav
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Reset list
 * 3. Gutter
 */
.uk-thumbnav {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin: 0;
  padding: 0;
  list-style: none;
  /* 3 */
  margin-left: -15px;
}
/*
 * Space is allocated based on content dimensions, but shrinks: 0 1 auto
 * 1. Gutter
 */
.uk-thumbnav > * {
  /* 1 */
  padding-left: 15px;
}
/* Items
 ========================================================================== */
/*
 * Items
 */
.uk-thumbnav > * > * {
  display: inline-block;
  position: relative;
}
.uk-thumbnav > * > *::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(255, 255, 255, 0.4);
  transition: background-color 0.1s ease-in-out;
}
/* Hover + Focus */
.uk-thumbnav > * > :hover,
.uk-thumbnav > * > :focus {
  outline: none;
}
.uk-thumbnav > * > :hover::after,
.uk-thumbnav > * > :focus::after {
  background-color: transparent;
}
/* Active */
.uk-thumbnav > .uk-active > *::after {
  background-color: transparent;
}
/* Modifier: 'uk-thumbnav-vertical'
 ========================================================================== */
/*
 * 1. Change direction
 * 2. Gutter
 */
.uk-thumbnav-vertical {
  /* 1 */
  flex-direction: column;
  /* 2 */
  margin-left: 0;
  margin-top: -15px;
}
/* 2 */
.uk-thumbnav-vertical > * {
  padding-left: 0;
  padding-top: 15px;
}
/* ========================================================================
   Component: Accordion
 ========================================================================== */
.uk-accordion {
  padding: 0;
  list-style: none;
}
/* Item
 ========================================================================== */
.uk-accordion > :nth-child(n+2) {
  margin-top: 20px;
}
/* Title
 ========================================================================== */
.uk-accordion-title {
  display: block;
  font-size: 1rem;
  line-height: 1.4;
  color: #333;
  overflow: hidden;
  font-weight: 600;
}
.uk-accordion-title::before {
  content: "";
  width: 1.4em;
  height: 1.4em;
  margin-left: 10px;
  float: right;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23666%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23666%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%0A%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-position: 50% 50%;
}
.uk-open > .uk-accordion-title::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23666%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
/* Hover + Focus */
.uk-accordion-title:hover,
.uk-accordion-title:focus {
  color: #666;
  text-decoration: none;
  outline: none;
}
/* Content
 ========================================================================== */
.uk-accordion-content {
  margin-top: 20px;
}
/*
 * Micro clearfix
 */
.uk-accordion-content::before,
.uk-accordion-content::after {
  content: "";
  display: table;
}
.uk-accordion-content::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-accordion-content > :last-child {
  margin-bottom: 0;
}
/* ========================================================================
   Component: Drop
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 * 3. Set a default width
 */
.uk-drop {
  /* 1 */
  display: none;
  /* 2 */
  position: absolute;
  z-index: 1020;
  /* 3 */
  box-sizing: border-box;
  width: auto;
}
/* Show */
.uk-drop.uk-open {
  display: block;
}
/* Direction / Alignment modifiers
 ========================================================================== */
/* Direction */
[class*='uk-drop-top'] {
  margin-top: -20px;
}
[class*='uk-drop-bottom'] {
  margin-top: 20px;
}
[class*='uk-drop-left'] {
  margin-left: -20px;
}
[class*='uk-drop-right'] {
  margin-left: 20px;
}
/* Grid modifiers
 ========================================================================== */
.uk-drop-stack .uk-drop-grid > * {
  width: 100% !important;
}
/* ========================================================================
   Component: Dropdown
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 * 3. Set a default width
 * 4. Style
 */
.uk-dropdown {
  /* 1 */
  display: none;
  /* 2 */
  position: absolute;
  z-index: 1020;
  /* 3 */
  box-sizing: border-box;
  min-width: 200px;
  /* 4 */
  padding: 25px;
  background: #fff;
  color: #666;
  box-shadow: 0 5px 12px rgba(0, 0, 0, 0.15);
}
/* Show */
.uk-dropdown.uk-open {
  display: block;
}
/* Nav
 * Adopts `uk-nav`
 ========================================================================== */
.uk-dropdown-nav {
  white-space: nowrap;
  font-size: 14px;
}
/*
 * Items
 */
.uk-dropdown-nav > li > a {
  color: #999;
}
/* Hover + Focus + Active */
.uk-dropdown-nav > li > a:hover,
.uk-dropdown-nav > li > a:focus,
.uk-dropdown-nav > li.uk-active > a {
  color: #666;
}
/*
 * Header
 */
.uk-dropdown-nav .uk-nav-header {
  color: #333;
}
/*
 * Divider
 */
.uk-dropdown-nav .uk-nav-divider {
  border-top: 1px solid #e5e5e5;
}
/*
 * Sublists
 */
.uk-dropdown-nav .uk-nav-sub a {
  color: #999;
}
.uk-dropdown-nav .uk-nav-sub a:hover,
.uk-dropdown-nav .uk-nav-sub a:focus,
.uk-dropdown-nav .uk-nav-sub li.uk-active > a {
  color: #666;
}
/* Direction / Alignment modifiers
 ========================================================================== */
/* Direction */
[class*='uk-dropdown-top'] {
  margin-top: -10px;
}
[class*='uk-dropdown-bottom'] {
  margin-top: 10px;
}
[class*='uk-dropdown-left'] {
  margin-left: -10px;
}
[class*='uk-dropdown-right'] {
  margin-left: 10px;
}
/* Grid modifiers
 ========================================================================== */
.uk-dropdown-stack .uk-dropdown-grid > * {
  width: 100% !important;
}
/* ========================================================================
   Component: Modal
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 * 3. Allow scrolling for the modal dialog
 * 4. Horizontal padding
 * 5. Mask the background page
 * 6. Fade-in transition
 */
.uk-modal {
  /* 1 */
  display: none;
  /* 2 */
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1010;
  /* 3 */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  /* 4 */
  padding: 15px 15px;
  /* 5 */
  background: rgba(0, 0, 0, 0.6);
  /* 6 */
  opacity: 0;
  transition: opacity 0.15s linear;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-modal {
    padding: 50px 30px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-modal {
    padding-left: 40px;
    padding-right: 40px;
  }
}
/*
 * Open
 */
.uk-modal.uk-open {
  opacity: 1;
}
/* Page
 ========================================================================== */
/*
 * Prevent scrollbars
 */
.uk-modal-page {
  overflow: hidden;
}
/* Dialog
 ========================================================================== */
/*
 * 1. Create position context for spinner and close button
 * 2. Dimensions
 * 3. Fix `max-width: 100%` not working in combination with flex and responsive images in IE11
 *    `!important` needed to overwrite `uk-width-auto`. See `#modal-media-image` in tests
 * 4. Style
 * 5. Slide-in transition
 */
.uk-modal-dialog {
  /* 1 */
  position: relative;
  /* 2 */
  box-sizing: border-box;
  margin: 0 auto;
  width: 600px;
  /* 3 */
  max-width: calc(100% - 0.01px) !important;
  /* 4 */
  background: #fff;
  /* 5 */
  opacity: 0;
  transform: translateY(-100px);
  transition: 0.3s linear;
  transition-property: opacity, transform;
}
/*
 * Open
 */
.uk-open > .uk-modal-dialog {
  opacity: 1;
  transform: translateY(0);
}
/* Size modifier
 ========================================================================== */
/*
 * Container size
 * Take the same size as the Container component
 */
.uk-modal-container .uk-modal-dialog {
  width: 1200px;
}
/*
 * Full size
 * 1. Remove padding and background from modal
 * 2. Reset all default declarations from modal dialog
 */
/* 1 */
.uk-modal-full {
  padding: 0;
  background: none;
}
/* 2 */
.uk-modal-full .uk-modal-dialog {
  margin: 0;
  width: 100%;
  max-width: 100%;
  transform: translateY(0);
}
/* Sections
 ========================================================================== */
.uk-modal-body {
  padding: 30px 30px;
}
.uk-modal-header {
  padding: 15px 30px;
  background: #fff;
  border-bottom: 1px solid #e5e5e5;
}
.uk-modal-footer {
  padding: 15px 30px;
  background: #fff;
  border-top: 1px solid #e5e5e5;
}
/*
 * Micro clearfix
 */
.uk-modal-body::before,
.uk-modal-body::after,
.uk-modal-header::before,
.uk-modal-header::after,
.uk-modal-footer::before,
.uk-modal-footer::after {
  content: "";
  display: table;
}
.uk-modal-body::after,
.uk-modal-header::after,
.uk-modal-footer::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-modal-body > :last-child,
.uk-modal-header > :last-child,
.uk-modal-footer > :last-child {
  margin-bottom: 0;
}
/* Title
 ========================================================================== */
.uk-modal-title {
  font-size: 25px;
  line-height: 1.4;
}
/* Close
 * Adopts `uk-close`
 ========================================================================== */
[class*='uk-modal-close-'] {
  position: absolute;
  z-index: 1010;
  top: 10px;
  right: 10px;
  padding: 5px;
}
/*
 * Remove margin from adjacent element
 */
[class*='uk-modal-close-']:first-child + * {
  margin-top: 0;
}
/*
 * Hover
 */
/*
 * Default
 */
/*
 * Outside
 * 1. Prevent scrollbar on small devices
 */
.uk-modal-close-outside {
  top: 0;
  /* 1 */
  right: -5px;
  transform: translate(0, -100%);
  color: #ffffff;
}
.uk-modal-close-outside:hover {
  color: #fff;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  /* 1 */
  .uk-modal-close-outside {
    right: 0;
    transform: translate(100%, -100%);
  }
}
/*
 * Full
 */
.uk-modal-close-full {
  top: 0;
  right: 0;
  padding: 20px;
  background: #fff;
}
/* ========================================================================
   Component: Lightbox
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 * 3. Allow scrolling for the modal dialog
 * 4. Horizontal padding
 * 5. Mask the background page
 * 6. Fade-in transition
 */
.uk-lightbox {
  /* 1 */
  display: none;
  /* 2 */
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1010000;
  /* 5 */
  background: #000;
  /* 6 */
  opacity: 0;
  transition: opacity 0.15s linear;
}
/*
 * Open
 * 1. Center child
 * 2. Fade-in
 */
.uk-lightbox.uk-open {
  display: block;
  /* 2 */
  opacity: 1;
}
/* Page
 ========================================================================== */
/*
 * Prevent scrollbars
 */
.uk-lightbox-page {
  overflow: hidden;
}
/* Item
 ========================================================================== */
/*
 * 1. Center child within the viewport
 * 2. Not visible by default
 * 3. Color needed for spinner icon
 * 4. Optimize animation
 * 5. Responsiveness
 *    Using `vh` for `max-height` to fix image proportions after resize in Safari and Opera
 *    Using `vh` and `vw` to make responsive image work in IE11
 * 6. Suppress outline on focus
 */
.uk-lightbox-items > * {
  /* 1 */
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  /* 2 */
  display: none;
  justify-content: center;
  align-items: center;
  /* 3 */
  color: rgba(255, 255, 255, 0.7);
  /* 4 */
  will-change: transform, opacity;
}
/* 5 */
.uk-lightbox-items > * > * {
  max-width: 100vw;
  max-height: 100vh;
}
/* 6 */
.uk-lightbox-items > :focus {
  outline: none;
}
.uk-lightbox-items > * > :not(iframe) {
  width: auto;
  height: auto;
}
.uk-lightbox-items > .uk-active {
  display: flex;
}
/* Toolbar
 ========================================================================== */
.uk-lightbox-toolbar {
  padding: 10px 10px;
  background: rgba(0, 0, 0, 0.3);
  color: rgba(255, 255, 255, 0.7);
}
.uk-lightbox-toolbar > * {
  color: rgba(255, 255, 255, 0.7);
}
/* Toolbar Icon (Close)
 ========================================================================== */
.uk-lightbox-toolbar-icon {
  padding: 5px;
  color: rgba(255, 255, 255, 0.7);
}
/*
 * Hover
 */
.uk-lightbox-toolbar-icon:hover {
  color: #fff;
}
/* Button (Slidenav)
 ========================================================================== */
/*
 * 1. Center icon vertically and horizontally
 */
.uk-lightbox-button {
  box-sizing: border-box;
  width: 50px;
  height: 50px;
  background: rgba(0, 0, 0, 0.3);
  color: rgba(255, 255, 255, 0.7);
  /* 1 */
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
/*
 * Hover
 */
.uk-lightbox-button:hover {
  color: #fff;
}
/* Caption
 ========================================================================== */
/* Iframe
 ========================================================================== */
.uk-lightbox-iframe {
  width: 80%;
  height: 80%;
}
/* ========================================================================
   Component: Slideshow
 ========================================================================== */
/*
 * 1. Prevent tab highlighting on iOS.
 */
.uk-slideshow {
  /* 1 */
  -webkit-tap-highlight-color: transparent;
}
/* Items
 ========================================================================== */
/*
 * 1. Create position and stacking context
 * 2. Reset list
 * 3. Clip child elements
 * 4. Prevent displaying the callout information on iOS.
 */
.uk-slideshow-items {
  /* 1 */
  position: relative;
  z-index: 0;
  /* 2 */
  margin: 0;
  padding: 0;
  list-style: none;
  /* 3 */
  overflow: hidden;
  /* 4 */
  -webkit-touch-callout: none;
}
/* Item
 ========================================================================== */
/*
 * 1. Position items above each other
 * 2. Take the full width
 * 3. Clip child elements, e.g. for `uk-cover`
 * 4. Optimize animation
 * 5. Disable horizontal panning gestures in IE11 and Edge
 * 6. Suppress outline on focus
 */
.uk-slideshow-items > * {
  /* 1 */
  position: absolute;
  top: 0;
  left: 0;
  /* 2 */
  right: 0;
  bottom: 0;
  /* 3 */
  overflow: hidden;
  /* 4 */
  will-change: transform, opacity;
  /* 5 */
  touch-action: pan-y;
}
/* 6 */
.uk-slideshow-items > :focus {
  outline: none;
}
/*
 * Hide not active items
 */
.uk-slideshow-items > :not(.uk-active) {
  display: none;
}
/* ========================================================================
   Component: Slider
 ========================================================================== */
/*
 * 1. Prevent tab highlighting on iOS.
 */
.uk-slider {
  /* 1 */
  -webkit-tap-highlight-color: transparent;
}
/* Container
 ========================================================================== */
/*
 * 1. Clip child elements
 */
.uk-slider-container {
  /* 1 */
  overflow: hidden;
}
/* Items
 ========================================================================== */
/*
 * 1. Optimize animation
 * 2. Create a containing block. In Safari it's neither created by `transform` nor `will-change`.
 */
.uk-slider-items {
  /* 1 */
  will-change: transform;
  /* 2 */
  position: relative;
}
/*
 * 1. Reset list style without interfering with grid
 * 2. Prevent displaying the callout information on iOS.
 */
.uk-slider-items:not(.uk-grid) {
  display: flex;
  /* 1 */
  margin: 0;
  padding: 0;
  list-style: none;
  /* 2 */
  -webkit-touch-callout: none;
}
.uk-slider-items.uk-grid {
  flex-wrap: nowrap;
}
/* Item
 ========================================================================== */
/*
 * 1. Let items take content dimensions (0 0 auto)
 * 2. Create position context
 * 3. Disable horizontal panning gestures in IE11 and Edge
 * 4. Suppress outline on focus
 */
.uk-slider-items > * {
  /* 1 */
  flex: none;
  /* 2 */
  position: relative;
  /* 3 */
  touch-action: pan-y;
}
/* 4 */
.uk-slider-items > :focus {
  outline: none;
}
/* ========================================================================
   Component: Sticky
 ========================================================================== */
/*
 * 1. Resolve frame rate issues on devices with lower frame rates by forcing hardware acceleration
 */
.uk-sticky-fixed {
  z-index: 980;
  box-sizing: border-box;
  margin: 0 !important;
  /* 1 */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}
/*
 * Faster animations
 */
.uk-sticky[class*='uk-animation-'] {
  animation-duration: 0.2s;
}
.uk-sticky.uk-animation-reverse {
  animation-duration: 0.2s;
}
/* ========================================================================
   Component: Off-canvas
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Set position
 */
.uk-offcanvas {
  /* 1 */
  display: none;
  /* 2 */
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  z-index: 1000;
}
/*
 * Flip modifier
 */
.uk-offcanvas-flip .uk-offcanvas {
  right: 0;
  left: auto;
}
/* Bar
 ========================================================================== */
/*
 * 1. Set position
 * 2. Size and style
 * 3. Allow scrolling
 */
.uk-offcanvas-bar{
  /* 1 */
  position: absolute;
  top: 0;
  bottom: 0;
  left: -270px;
  /* 2 */
  box-sizing: border-box;
  width: 270px;
  padding: 20px 20px;
  background: #fff;
  /* 3 */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-offcanvas-bar{
    left: -350px;
    width: 350px;
    padding: 30px;
  }
}
/* Flip modifier */
.uk-offcanvas-flip .uk-offcanvas-bar{
  left: auto;
  right: -270px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-offcanvas-flip .uk-offcanvas-bar{
    right: -350px;
  }
}
/*
 * Open
 */
.uk-open > .uk-offcanvas-bar{
  left: 0;
}
.uk-offcanvas-flip .uk-open > .uk-offcanvas-bar{
  left: auto;
  right: 0;
}
/*
 * Slide Animation (Used in slide and push mode)
 */
.uk-offcanvas-bar-animation {
  transition: left 0.3s ease-out;
}
.uk-offcanvas-flip .uk-offcanvas-bar-animation {
  transition-property: right;
}
/*
 * Reveal Animation
 * 1. Set position
 * 2. Clip the bar
 * 3. Animation
 * 4. Reset position
 */
.uk-offcanvas-reveal {
  /* 1 */
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  /* 2 */
  width: 0;
  overflow: hidden;
  /* 3 */
  transition: width 0.3s ease-out;
}
.uk-offcanvas-reveal .uk-offcanvas-bar{
  /* 4 */
  left: 0;
}
.uk-offcanvas-flip .uk-offcanvas-reveal .uk-offcanvas-bar{
  /* 4 */
  left: auto;
  right: 0;
}
.uk-open > .uk-offcanvas-reveal {
  width: 270px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-open > .uk-offcanvas-reveal {
    width: 350px;
  }
}
/*
 * Flip modifier
 */
.uk-offcanvas-flip .uk-offcanvas-reveal {
  right: 0;
  left: auto;
}
/* Close
 * Adopts `uk-close`
 ========================================================================== */
.uk-offcanvas-close {
  position: absolute;
  z-index: 1000;
  top: 20px;
  right: 20px;
  padding: 5px;
}
/* Overlay
 ========================================================================== */
/*
 * Overlay the whole page. Needed for the `::before`
 * 1. Using `100vw` so no modification is needed when off-canvas is flipped
 * 2. Allow for closing with swipe gesture on devices with pointer events.
 */
.uk-offcanvas-overlay {
  /* 1 */
  width: 100vw;
  /* 2 */
  touch-action: none;
}
/*
 * 1. Mask the whole page
 * 2. Fade-in transition
 */
.uk-offcanvas-overlay::before {
  /* 1 */
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.1);
  /* 2 */
  opacity: 0;
  transition: opacity 0.15s linear;
}
.uk-offcanvas-overlay.uk-open::before {
  opacity: 1;
}
/* Prevent scrolling
 ========================================================================== */
/*
 * Prevent horizontal scrollbar when the content is slide-out
 * Has to be on the `html` element too to make it work on the `body`
 */
.uk-offcanvas-page,
.uk-offcanvas-container {
  overflow-x: hidden;
}
/* Container
 ========================================================================== */
/*
 * Prepare slide-out animation (Used in reveal and push mode)
 * Using `position: left` instead of `transform` because position `fixed` elements like sticky navbars
 * lose their fixed state and behaves like `absolute` within a transformed container
 * 1. Provide a fixed width and prevent shrinking
 */
.uk-offcanvas-container {
  position: relative;
  left: 0;
  transition: left 0.3s ease-out;
  /* 1 */
  box-sizing: border-box;
  width: 100%;
}
/*
 * Activate slide-out animation
 */
:not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
  left: 270px;
}
.uk-offcanvas-flip.uk-offcanvas-container-animation {
  left: -270px;
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  :not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
    left: 350px;
  }
  .uk-offcanvas-flip.uk-offcanvas-container-animation {
    left: -350px;
  }
}
/* ========================================================================
   Component: Switcher
 ========================================================================== */
/*
 * Reset list
 */
.uk-switcher {
  margin: 0;
  padding: 0;
  list-style: none;
}
/* Items
 ========================================================================== */
/*
 * Hide not active items
 */
.uk-switcher > :not(.uk-active) {
  display: none;
}
/*
 * Remove margin from the last-child
 */
.uk-switcher > * > :last-child {
  margin-bottom: 0;
}
/* ========================================================================
   Component: Leader
 ========================================================================== */
.uk-leader {
  overflow: hidden;
}
/*
 * 1. Place element in text flow
 * 2. Never break into a new line
 * 3. Get a string back with as many repeating characters to fill the container
 * 4. Prevent wrapping. Overflowing characters will be clipped by the container
 */
.uk-leader-fill::after {
  /* 1 */
  display: inline-block;
  margin-left: 15px;
  /* 2 */
  width: 0;
  /* 3 */
  content: attr(data-fill);
  /* 4 */
  white-space: nowrap;
}
/*
 * Hide if media does not match
 */
.uk-leader-fill.uk-leader-hide::after {
  display: none;
}
/*
 * Pass fill character to JS
 */
.uk-leader-fill-content::before {
  content: '.';
}
:root {
  --uk-leader-fill-content: .;
}
/* ========================================================================
   Component: Iconnav
 ========================================================================== */
/*
 * 1. Allow items to wrap into the next line
 * 2. Reset list
 * 3. Gutter
 */
.uk-iconnav {
  display: flex;
  /* 1 */
  flex-wrap: wrap;
  /* 2 */
  margin: 0;
  padding: 0;
  list-style: none;
  /* 3 */
  margin-left: -10px;
}
/*
 * Space is allocated based on content dimensions, but shrinks: 0 1 auto
 * 1. Gutter
 */
.uk-iconnav > * {
  /* 1 */
  padding-left: 10px;
}
/* Items
 ========================================================================== */
/*
 * Items must target `a` elements to exclude other elements (e.g. dropdowns)
 * 1. Prevent gap if child element is `inline-block`, e.g. an icon
 * 2. Style
 */
.uk-iconnav > * > a {
  /* 1 */
  display: block;
  /* 2 */
  color: #999;
}
/* Hover + Focus */
.uk-iconnav > * > a:hover,
.uk-iconnav > * > a:focus {
  color: #666;
  outline: none;
}
/* Active */
.uk-iconnav > .uk-active > a {
  color: #666;
}
/* Modifier: 'uk-iconnav-vertical'
 ========================================================================== */
/*
 * 1. Change direction
 * 2. Gutter
 */
.uk-iconnav-vertical {
  /* 1 */
  flex-direction: column;
  /* 2 */
  margin-left: 0;
  margin-top: -10px;
}
/* 2 */
.uk-iconnav-vertical > * {
  padding-left: 0;
  padding-top: 10px;
}
/* ========================================================================
   Component: Notification
 ========================================================================== */
/*
 * 1. Set position
 * 2. Dimensions
 */
.uk-notification {
  /* 1 */
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 1040;
  /* 2 */
  box-sizing: border-box;
  width: 350px;
}
/* Position modifiers
========================================================================== */
.uk-notification-top-right,
.uk-notification-bottom-right {
  left: auto;
  right: 10px;
}
.uk-notification-top-center,
.uk-notification-bottom-center {
  left: 50%;
  margin-left: -175px;
}
.uk-notification-bottom-left,
.uk-notification-bottom-right,
.uk-notification-bottom-center {
  top: auto;
  bottom: 10px;
}
/* Responsiveness
========================================================================== */
/* Phones portrait and smaller */
@media (max-width: 639px) {
  .uk-notification {
    left: 10px;
    right: 10px;
    width: auto;
    margin: 0;
  }
}
/* Message
========================================================================== */
.uk-notification-message {
  position: relative;
  padding: 15px;
  background: #f8f8f8;
  color: #666;
  font-size: 1.25rem;
  line-height: 1.4;
  cursor: pointer;
}
* + .uk-notification-message {
  margin-top: 10px;
}
/* Close
 * Adopts `uk-close`
 ========================================================================== */
.uk-notification-close {
  display: none;
  position: absolute;
  top: 20px;
  right: 15px;
}
.uk-notification-message:hover .uk-notification-close {
  display: block;
}
/* Style modifiers
 ========================================================================== */
/*
 * Primary
 */
.uk-notification-message-primary {
  color: #1e87f0;
}
/*
 * Success
 */
.uk-notification-message-success {
  color: #32d296;
}
/*
 * Warning
 */
.uk-notification-message-warning {
  color: #faa05a;
}
/*
 * Danger
 */
.uk-notification-message-danger {
  color: #f0506e;
}
/* ========================================================================
   Component: Tooltip
 ========================================================================== */
/*
 * 1. Hide by default
 * 2. Position
 * 3. Dimensions
 * 4. Style
 */
.uk-tooltip {
  /* 1 */
  display: none;
  /* 2 */
  position: absolute;
  z-index: 1030;
  /* 3 */
  box-sizing: boder-box;
  max-width: 200px;
  padding: 6px 10px;
  /* 4 */
  background: #37294c;
  border-radius: 2px;
  color: #fff;
  font-size: 13px;
  font-weight:600;
  border-radius:4px ; 
}
/* Show */
.uk-tooltip.uk-active {
  display: block;
}
/* Direction / Alignment modifiers
 ========================================================================== */
/* Direction */
[class*='uk-tooltip-top'] {
  margin-top: -10px;
}
[class*='uk-tooltip-bottom'] {
  margin-top: 10px;
}
[class*='uk-tooltip-left'] {
  margin-left: -10px;
}
[class*='uk-tooltip-right'] {
  margin-left: 10px;
}
/* ========================================================================
   Component: Placeholder
 ========================================================================== */
.uk-placeholder {
  margin-bottom: 20px;
  padding: 30px 30px;
  background: transparent;
  border: 1px dashed #e5e5e5;
}
/* Add margin if adjacent element */
* + .uk-placeholder {
  margin-top: 20px;
}
/*
 * Remove margin from the last-child
 */
.uk-placeholder > :last-child {
  margin-bottom: 0;
}
/* ========================================================================
   Component: Progress
 ========================================================================== */
/*
 * 1. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 * 2. Remove default style
 * 3. Behave like a block element
 * 4. Remove borders in Firefox and Edge
 * 5. Set background color for progress container in Firefox, IE11 and Edge
 * 6. Style
 */
.uk-progress {
  /* 1 */
  vertical-align: baseline;
  /* 2 */
  -webkit-appearance: none;
  -moz-appearance: none;
  /* 3 */
  display: block;
  width: 100%;
  /* 4 */
  border: 0;
  /* 5 */
  background-color: #f8f8f8;
  /* 6 */
  margin-bottom: 20px;
  height: 15px;
  border-radius: 500px;
  overflow: hidden;
}
/* Add margin if adjacent element */
* + .uk-progress {
  margin-top: 20px;
}
/*
 * Remove animated circles for indeterminate state in IE11 and Edge
 */
.uk-progress:indeterminate {
  color: transparent;
}
/*
 * Progress container
 * 2. Remove progress bar for indeterminate state in Firefox
 */
.uk-progress::-webkit-progress-bar {
  background-color: #f8f8f8;
  border-radius: 500px;
  overflow: hidden;
}
/* 2 */
.uk-progress:indeterminate::-moz-progress-bar {
  width: 0;
}
/*
 * Progress bar
 * 1. Remove right border in IE11 and Edge
 */
.uk-progress::-webkit-progress-value {
  background-color: #1e87f0;
  transition: width 0.6s ease;
}
.uk-progress::-moz-progress-bar {
  background-color: #1e87f0;
}
.uk-progress::-ms-fill {
  background-color: #1e87f0;
  transition: width 0.6s ease;
  /* 1 */
  border: 0;
}
/* ========================================================================
   Component: Sortable
 ========================================================================== */
.uk-sortable {
  position: relative;
}
/*
 * Deactivate pointer-events on SVGs in Safari
 */
.uk-sortable svg {
  pointer-events: none;
}
/*
 * Remove margin from the last-child
 */
.uk-sortable > :last-child {
  margin-bottom: 0;
}
/* Drag
 ========================================================================== */
.uk-sortable-drag {
  position: absolute !important;
  z-index: 1050 !important;
  pointer-events: none;
}
/* Placeholder
 ========================================================================== */
.uk-sortable-placeholder {
  opacity: 0;
  pointer-events: none;
}
/* Empty modifier
 ========================================================================== */
.uk-sortable-empty {
  min-height: 50px;
}
/* Handle
 ========================================================================== */
/* Hover */
.uk-sortable-handle:hover {
  cursor: move;
}
/* ========================================================================
   Component: Countdown
 ========================================================================== */
/* Item
 ========================================================================== */
/*
 * 1. Center numbers and separators vertically
 */
.uk-countdown-number,
.uk-countdown-separator {
  /* 1 */
  line-height: 0.8;
}
/* Number
 ========================================================================== */
.uk-countdown-number {
  font-size: 2rem;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-countdown-number {
    font-size: 4rem;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-countdown-number {
    font-size: 6rem;
    min-width: 76px;
  }
}
/* Separator
 ========================================================================== */
.uk-countdown-separator {
  font-size: 1rem;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-countdown-separator {
    font-size: 2rem;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-countdown-separator {
    font-size: 3rem;
  }
}
/* Label
 ========================================================================== */
/* ========================================================================
   Component: Animation
 ========================================================================== */
[class*='uk-animation-'] {
  animation-duration: 0.5s;
  animation-timing-function: ease-out;
  animation-fill-mode: both;
}
/* Animations
 ========================================================================== */
/*
 * Fade
 */
.uk-animation-fade {
  animation-name: uk-fade;
  animation-duration: 0.8s;
  animation-timing-function: linear;
}
/*
 * Scale
 */
.uk-animation-scale-up {
  animation-name: uk-fade-scale-02;
}
.uk-animation-scale-down {
  animation-name: uk-fade-scale-18;
}
/*
 * Slide
 */
.uk-animation-slide-top {
  animation-name: uk-fade-top;
}
.uk-animation-slide-bottom {
  animation-name: uk-fade-bottom;
}
.uk-animation-slide-left {
  animation-name: uk-fade-left;
}
.uk-animation-slide-right {
  animation-name: uk-fade-right;
}
/*
 * Slide Small
 */
.uk-animation-slide-top-small {
  animation-name: uk-fade-top-small;
}
.uk-animation-slide-bottom-small {
  animation-name: uk-fade-bottom-small;
}
.uk-animation-slide-left-small {
  animation-name: uk-fade-left-small;
}
.uk-animation-slide-right-small {
  animation-name: uk-fade-right-small;
}
/*
 * Slide Medium
 */
.uk-animation-slide-top-medium {
  animation-name: uk-fade-top-medium;
}
.uk-animation-slide-bottom-medium {
  animation-name: uk-fade-bottom-medium;
}
.uk-animation-slide-left-medium {
  animation-name: uk-fade-left-medium;
}
.uk-animation-slide-right-medium {
  animation-name: uk-fade-right-medium;
}
/*
 * Kenburns
 */
.uk-animation-kenburns {
  animation-name: uk-scale-kenburns;
  animation-duration: 15s;
}
/*
 * Shake
 */
.uk-animation-shake {
  animation-name: uk-shake;
}
/*
 * SVG Stroke
 * The `--uk-animation-stroke` custom property contains the longest path length.
 * Set it manually or use `uk-svg="stroke-animation: true"` to set it automatically.
 * All strokes are animated by the same pace and doesn't end simultaneously.
 * To end simultaneously, `pathLength="1"` could be used, but it's not working in Safari yet.
 */
.uk-animation-stroke {
  animation-name: uk-stroke;
  stroke-dasharray: var(--uk-animation-stroke);
  animation-duration: 2s;
}
/* Direction modifier
 ========================================================================== */
.uk-animation-reverse {
  animation-direction: reverse;
  animation-timing-function: ease-in;
}
/* Duration modifier
 ========================================================================== */
.uk-animation-fast {
  animation-duration: 0.1s;
}
/* Toggle (Hover + Focus)
========================================================================== */
/*
 * The toggle is triggered on touch devices using `:focus` and tabindex
 */
.uk-animation-toggle:not(:hover):not(:focus) [class*='uk-animation-'] {
  animation-name: none;
}
/*
 * 1. Prevent tab highlighting on iOS.
 */
.uk-animation-toggle {
  /* 1 */
  -webkit-tap-highlight-color: transparent;
}
/*
 * Remove outline for `tabindex`
 */
.uk-animation-toggle:focus {
  outline: none;
}
/* Keyframes used by animation classes
 ========================================================================== */
/*
 * Fade
 */
@keyframes uk-fade {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*
 * Slide Top
 */
@keyframes uk-fade-top {
  0% {
    opacity: 0;
    transform: translateY(-100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*
 * Slide Bottom
 */
@keyframes uk-fade-bottom {
  0% {
    opacity: 0;
    transform: translateY(100%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*
 * Slide Left
 */
@keyframes uk-fade-left {
  0% {
    opacity: 0;
    transform: translateX(-100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
 * Slide Right
 */
@keyframes uk-fade-right {
  0% {
    opacity: 0;
    transform: translateX(100%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
 * Slide Top Small
 */
@keyframes uk-fade-top-small {
  0% {
    opacity: 0;
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*
 * Slide Bottom Small
 */
@keyframes uk-fade-bottom-small {
  0% {
    opacity: 0;
    transform: translateY(10px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*
 * Slide Left Small
 */
@keyframes uk-fade-left-small {
  0% {
    opacity: 0;
    transform: translateX(-10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
 * Slide Right Small
 */
@keyframes uk-fade-right-small {
  0% {
    opacity: 0;
    transform: translateX(10px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
 * Slide Top Medium
 */
@keyframes uk-fade-top-medium {
  0% {
    opacity: 0;
    transform: translateY(-50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*
 * Slide Bottom Medium
 */
@keyframes uk-fade-bottom-medium {
  0% {
    opacity: 0;
    transform: translateY(50px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
/*
 * Slide Left Medium
 */
@keyframes uk-fade-left-medium {
  0% {
    opacity: 0;
    transform: translateX(-50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
 * Slide Right Medium
 */
@keyframes uk-fade-right-medium {
  0% {
    opacity: 0;
    transform: translateX(50px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
/*
 * Scale Up
 */
@keyframes uk-fade-scale-02 {
  0% {
    opacity: 0;
    transform: scale(0.2);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
/*
 * Scale Down
 */
@keyframes uk-fade-scale-18 {
  0% {
    opacity: 0;
    transform: scale(1.8);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
/*
 * Kenburns
 */
@keyframes uk-scale-kenburns {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.2);
  }
}
/*
 * Shake
 */
@keyframes uk-shake {
  0%,
  100% {
    transform: translateX(0);
  }
  10% {
    transform: translateX(-9px);
  }
  20% {
    transform: translateX(8px);
  }
  30% {
    transform: translateX(-7px);
  }
  40% {
    transform: translateX(6px);
  }
  50% {
    transform: translateX(-5px);
  }
  60% {
    transform: translateX(4px);
  }
  70% {
    transform: translateX(-3px);
  }
  80% {
    transform: translateX(2px);
  }
  90% {
    transform: translateX(-1px);
  }
}
/*
 * Stroke
 */
@keyframes uk-stroke {
  0% {
    stroke-dashoffset: var(--uk-animation-stroke);
  }
  100% {
    stroke-dashoffset: 0;
  }
}
/* ========================================================================
   Component: Width
 ========================================================================== */
/* Equal child widths
 ========================================================================== */
[class*='uk-child-width'] > * {
  box-sizing: border-box;
  width: 100%;
}
.uk-child-width-1-2 > * {
  width: 50%;
}
.uk-child-width-1-3 > * {
  width: calc(100% * 1 / 3.001);
}
.uk-child-width-1-4 > * {
  width: 25%;
}
.uk-child-width-1-5 > * {
  width: 20%;
}
.uk-child-width-1-6 > * {
  width: calc(100% * 1 / 6.001);
}
.uk-child-width-1-7 > * {
  width: calc(100% * 1 / 7.001);
}
.uk-child-width-1-8 > * {
  width: calc(100% * 1 / 8.001);
}
.uk-child-width-auto > * {
  width: auto;
}
/*
 * 1. Reset the `min-width`, which is set to auto by default, because
 *    flex items won't shrink below their minimum intrinsic content size.
 *    Using `1px` instead of `0`, so items still wrap into the next line,
 *    if they have zero width and padding and the predecessor is 100% wide.
 */
.uk-child-width-expand > :not([class*='uk-width']) {
  flex: 1;
  /* 1 */
  min-width: 1px;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-child-width-1-1\@s > * {
    width: 100%;
  }
  .uk-child-width-1-2\@s > * {
    width: 50%;
  }
  .uk-child-width-1-3\@s > * {
    width: calc(100% * 1 / 3.001);
  }
  .uk-child-width-1-4\@s > * {
    width: 25%;
  }
  .uk-child-width-1-5\@s > * {
    width: 20%;
  }
  .uk-child-width-1-6\@s > * {
    width: calc(100% * 1 / 6.001);
  }
  .uk-child-width-auto\@s > * {
    width: auto;
  }
  .uk-child-width-expand\@s > :not([class*='uk-width']) {
    flex: 1;
    min-width: 1px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-child-width-1-1\@m > * {
    width: 100%;
  }
  .uk-child-width-1-2\@m > * {
    width: 50%;
  }
  .uk-child-width-1-3\@m > * {
    width: calc(100% * 1 / 3.001);
  }
  .uk-child-width-1-4\@m > * {
    width: 25%;
  }
  .uk-child-width-1-5\@m > * {
    width: 20%;
  }
  .uk-child-width-1-6\@m > * {
    width: calc(100% * 1 / 6.001);
  }
  .uk-child-width-1-7\@m > * {
    width: calc(100% * 1 / 7.001);
  }
  .uk-child-width-1-8\@m > * {
    width: calc(100% * 1 / 8.001);
  }    
  .uk-child-width-auto\@m > * {
    width: auto;
  }
  .uk-child-width-expand\@m > :not([class*='uk-width']) {
    flex: 1;
    min-width: 1px;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-child-width-1-1\@l > * {
    width: 100%;
  }
  .uk-child-width-1-2\@l > * {
    width: 50%;
  }
  .uk-child-width-1-3\@l > * {
    width: calc(100% * 1 / 3.001);
  }
  .uk-child-width-1-4\@l > * {
    width: 25%;
  }
  .uk-child-width-1-5\@l > * {
    width: 20%;
  }
  .uk-child-width-1-6\@l > * {
    width: calc(100% * 1 / 6.001);
  }
  .uk-child-width-auto\@l > * {
    width: auto;
  }
  .uk-child-width-expand\@l > :not([class*='uk-width']) {
    flex: 1;
    min-width: 1px;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-child-width-1-1\@xl > * {
    width: 100%;
  }
  .uk-child-width-1-2\@xl > * {
    width: 50%;
  }
  .uk-child-width-1-3\@xl > * {
    width: calc(100% * 1 / 3.001);
  }
  .uk-child-width-1-4\@xl > * {
    width: 25%;
  }
  .uk-child-width-1-5\@xl > * {
    width: 20%;
  }
  .uk-child-width-1-6\@xl > * {
    width: calc(100% * 1 / 6.001);
  }
  .uk-child-width-auto\@xl > * {
    width: auto;
  }
  .uk-child-width-expand\@xl > :not([class*='uk-width']) {
    flex: 1;
    min-width: 1px;
  }
}
/* Single Widths
 ========================================================================== */
/*
 * 1. `max-width` is needed for the pixel-based classes
 */
[class*='uk-width'] {
  box-sizing: border-box;
  width: 100%;
  /* 1 */
  max-width: 100%;
}
/* Halves */
.uk-width-1-2 {
  width: 50%;
}
/* Thirds */
.uk-width-1-3 {
  width: calc(100% * 1 / 3.001);
}
.uk-width-2-3 {
  width: calc(100% * 2 / 3.001);
}
/* Quarters */
.uk-width-1-4 {
  width: 25%;
}
.uk-width-3-4 {
  width: 75%;
}
/* Fifths */
.uk-width-1-5 {
  width: 20%;
}
.uk-width-2-5 {
  width: 40%;
}
.uk-width-3-5 {
  width: 60%;
}
.uk-width-4-5 {
  width: 80%;
}
/* Sixths */
.uk-width-1-6 {
  width: calc(100% * 1 / 6.001);
}
.uk-width-5-6 {
  width: calc(100% * 5 / 6.001);
}
/* Pixel */
.uk-width-small {
  /* width: 150px; */
}
.uk-width-medium {
  width: 300px;
}
.uk-width-large {
  width: 450px;
}
.uk-width-xlarge {
  width: 600px;
}
.uk-width-xxlarge {
  width: 750px;
}
/* Auto */
.uk-width-auto {
  width: auto;
}
/* Expand */
.uk-width-expand {
  flex: 1;
  min-width: 1px;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  /* Whole */
  .uk-width-1-1\@s {
    width: 100%;
  }
  /* Halves */
  .uk-width-1-2\@s {
    width: 50%;
  }
  /* Thirds */
  .uk-width-1-3\@s {
    width: calc(100% * 1 / 3.001);
  }
  .uk-width-2-3\@s {
    width: calc(100% * 2 / 3.001);
  }
  /* Quarters */
  .uk-width-1-4\@s {
    width: 25%;
  }
  .uk-width-3-4\@s {
    width: 75%;
  }
  /* Fifths */
  .uk-width-1-5\@s {
    width: 20%;
  }
  .uk-width-2-5\@s {
    width: 40%;
  }
  .uk-width-3-5\@s {
    width: 60%;
  }
  .uk-width-4-5\@s {
    width: 80%;
  }
  /* Sixths */
  .uk-width-1-6\@s {
    width: calc(100% * 1 / 6.001);
  }
  .uk-width-5-6\@s {
    width: calc(100% * 5 / 6.001);
  }
  /* Pixel */
  .uk-width-small\@s {
    width: 150px;
  }
  .uk-width-medium\@s {
    width: 300px;
  }
  .uk-width-large\@s {
    width: 450px;
  }
  .uk-width-xlarge\@s {
    width: 600px;
  }
  .uk-width-xxlarge\@s {
    width: 750px;
  }
  /* Auto */
  .uk-width-auto\@s {
    width: auto;
  }
  /* Expand */
  .uk-width-expand\@s {
    flex: 1;
    min-width: 1px;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  /* Whole */
  .uk-width-1-1\@m {
    width: 100%;
  }
  /* Halves */
  .uk-width-1-2\@m {
    width: 50%;
  }
  /* Thirds */
  .uk-width-1-3\@m {
    width: calc(100% * 1 / 3.001);
  }
  .uk-width-2-3\@m {
    width: calc(100% * 2 / 3.001);
  }
  /* Quarters */
  .uk-width-1-4\@m {
    width: 25%;
  }
  .uk-width-3-4\@m {
    width: 75%;
  }
  /* Fifths */
  .uk-width-1-5\@m {
    width: 20%;
  }
  .uk-width-2-5\@m {
    width: 40%;
  }
  .uk-width-3-5\@m {
    width: 60%;
  }
  .uk-width-4-5\@m {
    width: 80%;
  }
  /* Sixths */
  .uk-width-1-6\@m {
    width: calc(100% * 1 / 6.001);
  }
  .uk-width-5-6\@m {
    width: calc(100% * 5 / 6.001);
  }
  /* Pixel */
  .uk-width-small\@m {
    width: 150px;
  }
  .uk-width-medium\@m {
    width: 300px;
  }
  .uk-width-large\@m {
    width: 450px;
  }
  .uk-width-xlarge\@m {
    width: 600px;
  }
  .uk-width-xxlarge\@m {
    width: 750px;
  }
  /* Auto */
  .uk-width-auto\@m {
    width: auto;
  }
  /* Expand */
  .uk-width-expand\@m {
    flex: 1;
    min-width: 1px;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  /* Whole */
  .uk-width-1-1\@l {
    width: 100%;
  }
  /* Halves */
  .uk-width-1-2\@l {
    width: 50%;
  }
  /* Thirds */
  .uk-width-1-3\@l {
    width: calc(100% * 1 / 3.001);
  }
  .uk-width-2-3\@l {
    width: calc(100% * 2 / 3.001);
  }
  /* Quarters */
  .uk-width-1-4\@l {
    width: 25%;
  }
  .uk-width-3-4\@l {
    width: 75%;
  }
  /* Fifths */
  .uk-width-1-5\@l {
    width: 20%;
  }
  .uk-width-2-5\@l {
    width: 40%;
  }
  .uk-width-3-5\@l {
    width: 60%;
  }
  .uk-width-4-5\@l {
    width: 80%;
  }
  /* Sixths */
  .uk-width-1-6\@l {
    width: calc(100% * 1 / 6.001);
  }
  .uk-width-5-6\@l {
    width: calc(100% * 5 / 6.001);
  }
  /* Pixel */
  .uk-width-small\@l {
    width: 150px;
  }
  .uk-width-medium\@l {
    width: 300px;
  }
  .uk-width-large\@l {
    width: 450px;
  }
  .uk-width-xlarge\@l {
    width: 600px;
  }
  .uk-width-xxlarge\@l {
    width: 750px;
  }
  /* Auto */
  .uk-width-auto\@l {
    width: auto;
  }
  /* Expand */
  .uk-width-expand\@l {
    flex: 1;
    min-width: 1px;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  /* Whole */
  .uk-width-1-1\@xl {
    width: 100%;
  }
  /* Halves */
  .uk-width-1-2\@xl {
    width: 50%;
  }
  /* Thirds */
  .uk-width-1-3\@xl {
    width: calc(100% * 1 / 3.001);
  }
  .uk-width-2-3\@xl {
    width: calc(100% * 2 / 3.001);
  }
  /* Quarters */
  .uk-width-1-4\@xl {
    width: 25%;
  }
  .uk-width-3-4\@xl {
    width: 75%;
  }
  /* Fifths */
  .uk-width-1-5\@xl {
    width: 20%;
  }
  .uk-width-2-5\@xl {
    width: 40%;
  }
  .uk-width-3-5\@xl {
    width: 60%;
  }
  .uk-width-4-5\@xl {
    width: 80%;
  }
  /* Sixths */
  .uk-width-1-6\@xl {
    width: calc(100% * 1 / 6.001);
  }
  .uk-width-5-6\@xl {
    width: calc(100% * 5 / 6.001);
  }
  /* Pixel */
  .uk-width-small\@xl {
    width: 150px;
  }
  .uk-width-medium\@xl {
    width: 300px;
  }
  .uk-width-large\@xl {
    width: 450px;
  }
  .uk-width-xlarge\@xl {
    width: 600px;
  }
  .uk-width-xxlarge\@xl {
    width: 750px;
  }
  /* Auto */
  .uk-width-auto\@xl {
    width: auto;
  }
  /* Expand */
  .uk-width-expand\@xl {
    flex: 1;
    min-width: 1px;
  }
}
/* ========================================================================
   Component: Height
 ========================================================================== */
[class*='uk-height'] {
  box-sizing: border-box;
}
/*
 * Only works if parent element has a height set
 */
.uk-height-1-1 {
  height: 100%;
}
/*
 * Useful to create image teasers
 */
.uk-height-viewport {
  min-height: 100vh;
}
/*
 * Pixel
 * Useful for `overflow: auto`
 */
.uk-height-small {
  height: 150px;
}
.uk-height-medium {
  height: 300px;
}
.uk-height-large {
  height: 450px !important;
}
.uk-height-max-small {
  max-height: 150px;
}
.uk-height-max-medium {
  max-height: 300px;
}
.uk-height-max-large {
  max-height: 450px;
}
/* ========================================================================
   Component: Text
 ========================================================================== */
/* Style modifiers
 ========================================================================== */
.uk-text-lead {
  font-size: 1.5rem;
  line-height: 1.5;
  color: #333;
}
@media (max-width:960px){
  .uk-text-lead {
  font-size: 1.2rem 
}
}
.uk-text-meta {
  font-size: 0.875rem;
  line-height: 1.4;
  color: #999;
}
.uk-text-meta a {
  color: #999;
}
.uk-text-meta a:hover {
  color: #666;
  text-decoration: none;
}
/* Size modifiers
 ========================================================================== */
.uk-text-small {
  font-size: 0.8rem !important;
  line-height: 1.5;
}
.uk-text-large {
  font-size: 1.5rem;
  line-height: 1.5;
}
/* Weight modifier
 ========================================================================== */
.uk-text-light {
  font-weight: 300;
}
.uk-text-normal {
  font-weight: 400;
}
.uk-text-bold {
  font-weight: 600;
}
.uk-text-lighter {
  font-weight: lighter;
}
.uk-text-bolder {
  font-weight: bolder;
}
/* Style modifier
 ========================================================================== */
.uk-text-italic {
  font-style: italic;
}
/* Transform modifier
 ========================================================================== */
.uk-text-capitalize {
  text-transform: capitalize !important;
}
.uk-text-uppercase {
  text-transform: uppercase !important;
}
.uk-text-lowercase {
  text-transform: lowercase !important;
}
/* Color modifiers
 ========================================================================== */
.uk-text-muted {
  color: #999 !important;
}
.uk-text-emphasis {
  color: #333 !important;
}
.uk-text-primary {
  color: #1e87f0 !important;
}
.uk-text-secondary {
  color: #222 !important;
}
.uk-text-success {
  color: #32d296 !important;
}
.uk-text-warning {
  color: #faa05a !important;
}
.uk-text-danger {
  color: #f0506e !important;
}
/* Background modifier
 ========================================================================== */
/*
 * 1. The background clips to the foreground text. Works in Chrome, Firefox, Safari, Edge and Opera
 *    Default color is set to transparent
 * 2. Container fits the text
 * 3. Fallback color for IE11
 */
.uk-text-background {
  /* 1 */
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  /* 2 */
  display: inline-block;
  /* 3 */
  color: #1e87f0 !important;
}
@supports (-webkit-background-clip: text) {
  .uk-text-background {
    background-color: #1e87f0;
  }
}
/* Alignment modifiers
 ========================================================================== */
.uk-text-left {
  text-align: left !important;
}
.uk-text-right {
  text-align: right !important;
}
.uk-text-center {
  text-align: center !important;
}
.uk-text-justify {
  text-align: justify !important;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-text-left\@s {
    text-align: left !important;
  }
  .uk-text-right\@s {
    text-align: right !important;
  }
  .uk-text-center\@s {
    text-align: center !important;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-text-left\@m {
    text-align: left !important;
  }
  .uk-text-right\@m {
    text-align: right !important;
  }
  .uk-text-center\@m {
    text-align: center !important;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-text-left\@l {
    text-align: left !important;
  }
  .uk-text-right\@l {
    text-align: right !important;
  }
  .uk-text-center\@l {
    text-align: center !important;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-text-left\@xl {
    text-align: left !important;
  }
  .uk-text-right\@xl {
    text-align: right !important;
  }
  .uk-text-center\@xl {
    text-align: center !important;
  }
}
/*
 * Vertical
 */
.uk-text-top {
  vertical-align: top !important;
}
.uk-text-middle {
  vertical-align: middle !important;
}
.uk-text-bottom {
  vertical-align: bottom !important;
}
.uk-text-baseline {
  vertical-align: baseline !important;
}
/* Wrap modifiers
 ========================================================================== */
/*
 * Prevent text from wrapping onto multiple lines
 */
.uk-text-nowrap {
  white-space: nowrap;
}
/*
 * 1. Make sure a max-width is set after which truncation can occur
 * 2. Prevent text from wrapping onto multiple lines, and truncate with an ellipsis
 * 3. Fix for table cells
 */
.uk-text-truncate {
  /* 1 */
  max-width: 100%;
  /* 2 */
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 2 */
th.uk-text-truncate,
td.uk-text-truncate {
  max-width: 0;
}
/*
 * 1. Wrap long words onto the next line and break them if they are too long to fit
 * 2. Legacy `word-wrap` as fallback for `overflow-wrap`
 * 3. Fix `overflow-wrap` which doesn't work with table cells in Chrome, Opera, IE11 and Edge
 *    Must use `break-all` to support IE11 and Edge
 * Note: Not using `hyphens: auto;` because it hyphenates text even if not needed
 */
.uk-text-break {
  /* 1 */
  overflow-wrap: break-word;
  /* 2 */
  word-wrap: break-word;
}
/* 3 */
th.uk-text-break,
td.uk-text-break {
  word-break: break-all;
}
/* ========================================================================
   Component: Column
 ========================================================================== */
[class*='uk-column-'] {
  column-gap: 30px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  [class*='uk-column-'] {
    column-gap: 40px;
  }
}
/*
 * Fix image 1px line wrapping into the next column in Chrome
 */
[class*='uk-column-'] img {
  transform: translate3d(0, 0, 0);
}
/* Divider
 ========================================================================== */
/*
 * 1. Double the column gap
 */
.uk-column-divider {
  column-rule: 1px solid #e5e5e5;
  /* 1 */
  column-gap: 60px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-column-divider {
    column-gap: 80px;
  }
}
/* Width modifiers
 ========================================================================== */
.uk-column-1-2 {
  column-count: 2;
}
.uk-column-1-3 {
  column-count: 3;
}
.uk-column-1-4 {
  column-count: 4;
}
.uk-column-1-5 {
  column-count: 5;
}
.uk-column-1-6 {
  column-count: 6;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-column-1-2\@s {
    column-count: 2;
  }
  .uk-column-1-3\@s {
    column-count: 3;
  }
  .uk-column-1-4\@s {
    column-count: 4;
  }
  .uk-column-1-5\@s {
    column-count: 5;
  }
  .uk-column-1-6\@s {
    column-count: 6;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-column-1-2\@m {
    column-count: 2;
  }
  .uk-column-1-3\@m {
    column-count: 3;
  }
  .uk-column-1-4\@m {
    column-count: 4;
  }
  .uk-column-1-5\@m {
    column-count: 5;
  }
  .uk-column-1-6\@m {
    column-count: 6;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-column-1-2\@l {
    column-count: 2;
  }
  .uk-column-1-3\@l {
    column-count: 3;
  }
  .uk-column-1-4\@l {
    column-count: 4;
  }
  .uk-column-1-5\@l {
    column-count: 5;
  }
  .uk-column-1-6\@l {
    column-count: 6;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-column-1-2\@xl {
    column-count: 2;
  }
  .uk-column-1-3\@xl {
    column-count: 3;
  }
  .uk-column-1-4\@xl {
    column-count: 4;
  }
  .uk-column-1-5\@xl {
    column-count: 5;
  }
  .uk-column-1-6\@xl {
    column-count: 6;
  }
}
/* Make element span across all columns
 * Does not work in Firefox yet
 ========================================================================== */
.uk-column-span {
  column-span: all;
}
/* ========================================================================
   Component: Cover
 ========================================================================== */
/*
 * Works with iframes and embedded content
 * 1. Reset responsiveness for embedded content
 * 2. Center object
 * Note: Percent values on the `top` property only works if this element
 *       is absolute positioned or if the container has a height
 */
.uk-cover {
  /* 1 */
  max-width: none;
  /* 2 */
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
iframe.uk-cover {
  pointer-events: none;
}
/* Container
 ========================================================================== */
/*
 * 1. Parent container which clips resized object
 * 2. Needed if the child is positioned absolute. See note above
 */
.uk-cover-container {
  /* 1 */
  overflow: hidden;
  /* 2 */
  position: relative;
}
/* ========================================================================
   Component: Background
 ========================================================================== */
/* Color
 ========================================================================== */
.uk-background-default {
  background-color: #fff;
}
.uk-background-muted {
  background-color: #f8f8f8;
}
.uk-background-primary {
  background-color: #1e87f0;
}
.uk-background-secondary {
  background-color: #222;
}
/* Size
 ========================================================================== */
.uk-background-cover,
.uk-background-contain {
  background-position: 50% 50%;
  background-repeat: no-repeat;
}
.uk-background-cover {
  background-size: cover;
}
.uk-background-contain {
  background-size: contain;
}
/* Position
 ========================================================================== */
.uk-background-top-left {
  background-position: 0 0;
}
.uk-background-top-center {
  background-position: 50% 0;
}
.uk-background-top-right {
  background-position: 100% 0;
}
.uk-background-center-left {
  background-position: 0 50%;
}
.uk-background-center-center {
  background-position: 50% 50%;
}
.uk-background-center-right {
  background-position: 100% 50%;
}
.uk-background-bottom-left {
  background-position: 0 100%;
}
.uk-background-bottom-center {
  background-position: 50% 100%;
}
.uk-background-bottom-right {
  background-position: 100% 100%;
}
/* Repeat
 ========================================================================== */
.uk-background-norepeat {
  background-repeat: no-repeat;
}
/* Attachment
 ========================================================================== */
/*
 * 1. Fix bug introduced in Chrome 67: the background image is not visible if any element on the page uses `translate3d`
 */
.uk-background-fixed {
  background-attachment: fixed;
  /* 1 */
  backface-visibility: hidden;
}
/*
 * Exclude touch devices because `fixed` doesn't work on iOS and Android
 */
@media (pointer: coarse) {
  .uk-background-fixed {
    background-attachment: scroll;
  }
}
/* Image
 ========================================================================== */
/* Phone portrait and smaller */
@media (max-width: 639px) {
  .uk-background-image\@s {
    background-image: none !important;
  }
}
/* Phone landscape and smaller */
@media (max-width: 959px) {
  .uk-background-image\@m {
    background-image: none !important;
  }
}
/* Tablet landscape and smaller */
@media (max-width: 1199px) {
  .uk-background-image\@l {
    background-image: none !important;
  }
}
/* Desktop and smaller */
@media (max-width: 1599px) {
  .uk-background-image\@xl {
    background-image: none !important;
  }
}
/* Blend modes
 ========================================================================== */
.uk-background-blend-multiply {
  background-blend-mode: multiply;
}
.uk-background-blend-screen {
  background-blend-mode: screen;
}
.uk-background-blend-overlay {
  background-blend-mode: overlay;
}
.uk-background-blend-darken {
  background-blend-mode: darken;
}
.uk-background-blend-lighten {
  background-blend-mode: lighten;
}
.uk-background-blend-color-dodge {
  background-blend-mode: color-dodge;
}
.uk-background-blend-color-burn {
  background-blend-mode: color-burn;
}
.uk-background-blend-hard-light {
  background-blend-mode: hard-light;
}
.uk-background-blend-soft-light {
  background-blend-mode: soft-light;
}
.uk-background-blend-difference {
  background-blend-mode: difference;
}
.uk-background-blend-exclusion {
  background-blend-mode: exclusion;
}
.uk-background-blend-hue {
  background-blend-mode: hue;
}
.uk-background-blend-saturation {
  background-blend-mode: saturation;
}
.uk-background-blend-color {
  background-blend-mode: color;
}
.uk-background-blend-luminosity {
  background-blend-mode: luminosity;
}
/* ========================================================================
   Component: Align
 ========================================================================== */
/*
 * Default
 */
[class*='uk-align'] {
  display: block;
  margin-bottom: 30px;
}
* + [class*='uk-align'] {
  margin-top: 30px;
}
/*
 * Center
 */
.uk-align-center {
  margin-left: auto;
  margin-right: auto;
}
/*
 * Left/Right
 */
.uk-align-left {
  margin-top: 0;
  margin-right: 30px;
  float: left;
}
.uk-align-right {
  margin-top: 0;
  margin-left: 30px;
  float: right;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-align-left\@s {
    margin-top: 0;
    margin-right: 30px;
    float: left;
  }
  .uk-align-right\@s {
    margin-top: 0;
    margin-left: 30px;
    float: right;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-align-left\@m {
    margin-top: 0;
    margin-right: 30px;
    float: left;
  }
  .uk-align-right\@m {
    margin-top: 0;
    margin-left: 30px;
    float: right;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-align-left\@l {
    margin-top: 0;
    float: left;
  }
  .uk-align-right\@l {
    margin-top: 0;
    float: right;
  }
  .uk-align-left,
  .uk-align-left\@s,
  .uk-align-left\@m,
  .uk-align-left\@l {
    margin-right: 40px;
  }
  .uk-align-right,
  .uk-align-right\@s,
  .uk-align-right\@m,
  .uk-align-right\@l {
    margin-left: 40px;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-align-left\@xl {
    margin-top: 0;
    margin-right: 40px;
    float: left;
  }
  .uk-align-right\@xl {
    margin-top: 0;
    margin-left: 40px;
    float: right;
  }
}
/* ========================================================================
   Component: SVG
 ========================================================================== */
/*
 * 1. Fill all SVG elements with the current text color if no `fill` attribute is set
 * 2. Set the fill and stroke color of all SVG elements to the current text color
 */
/* 1 */
.uk-svg,
.uk-svg:not(.uk-preserve) [fill*='#']:not(.uk-preserve) {
  fill: currentcolor;
}
.uk-svg:not(.uk-preserve) [stroke*='#']:not(.uk-preserve) {
  stroke: currentcolor;
}
/*
 * Fix Firefox blurry SVG rendering: https://bugzilla.mozilla.org/show_bug.cgi?id=1046835
 */
.uk-svg {
  transform: translate(0, 0);
}
/* ========================================================================
   Component: Utility
 ========================================================================== */
/* Panel
 ========================================================================== */
.uk-panel {
  position: relative;
  box-sizing: border-box;
}
/*
 * Micro clearfix
 */
.uk-panel::before,
.uk-panel::after {
  content: "";
  display: table;
}
.uk-panel::after {
  clear: both;
}
/*
 * Remove margin from the last-child
 */
.uk-panel > :last-child {
  margin-bottom: 0;
}
/*
 * Scrollable
 */
.uk-panel-scrollable {
  height: 170px;
  padding: 10px;
  border: 1px solid #e5e5e5;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  resize: both;
}
/* Clearfix
 ========================================================================== */
/*
 * 1. `table-cell` is used with `::before` because `table` creates a 1px gap when it becomes a flex item, only in Webkit
 * 2. `table` is used again with `::after` because `clear` only works with block elements.
 * Note: `display: block` with `overflow: hidden` is currently not working in the latest Safari
 */
/* 1 */
.uk-clearfix::before {
  content: "";
  display: table-cell;
}
/* 2 */
.uk-clearfix::after {
  content: "";
  display: table;
  clear: both;
}
/* Float
 ========================================================================== */
/*
 * 1. Prevent content overflow
 */
.uk-float-left {
  float: left;
}
.uk-float-right {
  float: right;
}
/* 1 */
[class*='uk-float-'] {
  max-width: 100%;
}
/* Overfow
 ========================================================================== */
.uk-overflow-hidden {
  overflow: hidden;
}
/*
 * Enable scrollbars if content is clipped
 * Note: Firefox ignores `padding-bottom` for the scrollable overflow https://bugzilla.mozilla.org/show_bug.cgi?id=748518
 */
.uk-overflow-auto {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
.uk-overflow-auto > :last-child {
  margin-bottom: 0;
}
/* Resize
 ========================================================================== */
.uk-resize {
  resize: both;
}
.uk-resize-vertical {
  resize: vertical;
}
/* Display
 ========================================================================== */
.uk-display-block {
  display: block !important;
}
.uk-display-inline {
  display: inline !important;
}
.uk-display-inline-block {
  display: inline-block !important;
}
/* Inline
 ========================================================================== */
/*
 * 1. Container fits its content
 * 2. Create position context
 * 3. Prevent content overflow
 * 4. Behave like most inline-block elements
 * 5. Force hardware acceleration without creating a new stacking context
 *    to fix 1px glitch when combined with overlays and transitions in Webkit
 * 6. Clip child elements
 */
[class*='uk-inline'] {
  /* 1 */
  display: inline-block;
  /* 2 */
  position: relative;
  /* 3 */
  max-width: 100%;
  /* 4 */
  vertical-align: middle;
  /* 5 */
  -webkit-backface-visibility: hidden;
}
.uk-inline-clip {
  /* 6 */
  overflow: hidden;
}
/* Responsive objects
 ========================================================================== */
/*
 * Preserve original dimensions
 * Because `img, `video`, `canvas` and  `audio` are already responsive by default, see Base component
 */
.uk-preserve-width,
.uk-preserve-width canvas,
.uk-preserve-width img,
.uk-preserve-width svg,
.uk-preserve-width video {
  max-width: none;
}
/*
 * Responsiveness
 * Corrects `max-width` and `max-height` behavior if padding and border are used
 */
.uk-responsive-width,
.uk-responsive-height {
  box-sizing: border-box;
}
/*
 * 1. Set a maximum width. `important` needed to override `uk-preserve-width img`
 * 2. Auto scale the height. Only needed if `height` attribute is present
 */
.uk-responsive-width {
  /* 1 */
  max-width: 100% !important;
  /* 2 */
  height: auto;
}
/*
 * 1. Set a maximum height. Only works if the parent element has a fixed height
 * 2. Auto scale the width. Only needed if `width` attribute is present
 * 3. Reset max-width, which `img, `video`, `canvas` and  `audio` already have by default
 */
.uk-responsive-height {
  /* 1 */
  max-height: 100%;
  /* 2 */
  width: auto;
  /* 3 */
  max-width: none;
}
/* Border
 ========================================================================== */
.uk-border-circle {
  border-radius: 50%;
}
.uk-border-pill {
  border-radius: 500px;
}
.uk-border-rounded {
  border-radius: 5px;
}
/*
 * Fix `overflow: hidden` to be ignored with border-radius and CSS transforms in Webkit
 */
.uk-inline-clip[class*='uk-border-'] {
  -webkit-transform: translateZ(0);
}
/* Box-shadow
 ========================================================================== */
.uk-box-shadow-small {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.uk-box-shadow-medium {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}
.uk-box-shadow-large {
  box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}
.uk-box-shadow-xlarge {
  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px !important;
}
/*
 * Hover
 */
[class*='uk-box-shadow-hover'] {
  transition: box-shadow 0.1s ease-in-out;
}
.uk-box-shadow-hover-small:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
.uk-box-shadow-hover-medium:hover {
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
}
.uk-box-shadow-hover-large:hover {
  box-shadow: 0 14px 25px rgba(0, 0, 0, 0.16);
}
.uk-box-shadow-hover-xlarge:hover {
  box-shadow: 0 28px 50px rgba(0, 0, 0, 0.16);
}
/* Box-shadow bottom
 ========================================================================== */
/*
 * 1. Set position.
 * 2. Set style
 * 3. Blur doesn't work on pseudo elements with negative `z-index` in Edge.
 *    Solved by using `before` and add position context to child elements.
 */
@supports (filter: blur(0)) {
  .uk-box-shadow-bottom {
    display: inline-block;
    position: relative;
    max-width: 100%;
    vertical-align: middle;
  }
  .uk-box-shadow-bottom::before {
    content: '';
    /* 1 */
    position: absolute;
    bottom: -30px;
    left: 0;
    right: 0;
    /* 2 */
    height: 30px;
    border-radius: 100%;
    background: #444;
    filter: blur(20px);
  }
  /* 3 */
  .uk-box-shadow-bottom > * {
    position: relative;
  }
}
/* Drop cap
 ========================================================================== */
/*
 * 1. Firefox doesn't apply `::first-letter` if the first letter is inside child elements
 *    https://bugzilla.mozilla.org/show_bug.cgi?id=214004
 * 2. In Firefox, a floating `::first-letter` doesn't have a line box and there for no `line-height`
 *    https://bugzilla.mozilla.org/show_bug.cgi?id=317933
 * 3. Caused by 1.: Edge creates two nested `::first-letter` containers, one for each selector
 *    This doubles the `font-size` exponential when using the `em` unit.
 */
.uk-dropcap::first-letter,
.uk-dropcap > p:first-of-type::first-letter {
  display: block;
  margin-right: 10px;
  float: left;
  font-size: 4.5em;
  line-height: 1;
  margin-bottom: -2px;
}
/* 2 */
@-moz-document url-prefix() {
  .uk-dropcap::first-letter,
  .uk-dropcap > p:first-of-type::first-letter {
    margin-top: 1.1%;
  }
}
/* 3 */
@supports (-ms-ime-align: auto) {
  .uk-dropcap > p:first-of-type::first-letter {
    font-size: 1em;
  }
}
/* Logo
 ========================================================================== */
/*
 * 1. Required for `a`
 */
.uk-logo {
  font-size: 1.2em;
  color: #3e416d;
  /* 1 */
  text-decoration: none;
  font-weight: 600;
}
/* Hover + Focus */
.uk-logo:hover,
.uk-logo:focus  {
  color: #3e416d !important;
  outline: none;
  /* 1 */
  text-decoration: none;
}
.uk-light .uk-logo{
  color:white !important  
}
.uk-logo-inverse {
  display: none;
}
/* Disabled State
 ========================================================================== */
.uk-disabled {
  pointer-events: none;
}
/* Drag State
 ========================================================================== */
/*
 * 1. Needed if moving over elements with have their own cursor on hover, e.g. links or buttons
 * 2. Fix dragging over iframes
 */
.uk-drag,
.uk-drag * {
  cursor: move;
}
/* 2 */
.uk-drag iframe {
  pointer-events: none;
}
/* Dragover State
 ========================================================================== */
/*
 * Create a box-shadow when dragging a file over the upload area
 */
.uk-dragover {
  box-shadow: 0 0 20px rgba(100, 100, 100, 0.3);
}
/* Blend modes
 ========================================================================== */
.uk-blend-multiply {
  mix-blend-mode: multiply;
}
.uk-blend-screen {
  mix-blend-mode: screen;
}
.uk-blend-overlay {
  mix-blend-mode: overlay;
}
.uk-blend-darken {
  mix-blend-mode: darken;
}
.uk-blend-lighten {
  mix-blend-mode: lighten;
}
.uk-blend-color-dodge {
  mix-blend-mode: color-dodge;
}
.uk-blend-color-burn {
  mix-blend-mode: color-burn;
}
.uk-blend-hard-light {
  mix-blend-mode: hard-light;
}
.uk-blend-soft-light {
  mix-blend-mode: soft-light;
}
.uk-blend-difference {
  mix-blend-mode: difference;
}
.uk-blend-exclusion {
  mix-blend-mode: exclusion;
}
.uk-blend-hue {
  mix-blend-mode: hue;
}
.uk-blend-saturation {
  mix-blend-mode: saturation;
}
.uk-blend-color {
  mix-blend-mode: color;
}
.uk-blend-luminosity {
  mix-blend-mode: luminosity;
}
/* Transform
========================================================================== */
.uk-transform-center {
  transform: translate(-50%, -50%);
}
/* Transform Origin
========================================================================== */
.uk-transform-origin-top-left {
  transform-origin: 0 0;
}
.uk-transform-origin-top-center {
  transform-origin: 50% 0;
}
.uk-transform-origin-top-right {
  transform-origin: 100% 0;
}
.uk-transform-origin-center-left {
  transform-origin: 0 50%;
}
.uk-transform-origin-center-right {
  transform-origin: 100% 50%;
}
.uk-transform-origin-bottom-left {
  transform-origin: 0 100%;
}
.uk-transform-origin-bottom-center {
  transform-origin: 50% 100%;
}
.uk-transform-origin-bottom-right {
  transform-origin: 100% 100%;
}
/* ========================================================================
   Component: Flex
 ========================================================================== */
.uk-flex {
  display: flex;
}
.uk-flex-inline {
  display: inline-flex;
}
/*
 * Remove pseudo elements created by micro clearfix as precaution
 */
.uk-flex::before,
.uk-flex::after,
.uk-flex-inline::before,
.uk-flex-inline::after {
  display: none;
}
/* Alignment
 ========================================================================== */
/*
 * Align items along the main axis of the current line of the flex container
 * Row: Horizontal
 */
.uk-flex-left {
  justify-content: flex-start;
}
.uk-flex-center {
  justify-content: center;
}
.uk-flex-right {
  justify-content: flex-end;
}
.uk-flex-between {
  justify-content: space-between;
}
.uk-flex-around {
  justify-content: space-around;
}
/* Phone landscape and bigger */
@media (min-width: 640px) { 
  .uk-flex-left\@s {
    justify-content: flex-start;
  }
  .uk-flex-center\@s {
    justify-content: center;
  }
  .uk-flex-right\@s {
    justify-content: flex-end;
  }
  .uk-flex-between\@s {
    justify-content: space-between;
  }
  .uk-flex-around\@s {
    justify-content: space-around;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-flex-left\@m {
    justify-content: flex-start;
  }
  .uk-flex-center\@m {
    justify-content: center;
  }
  .uk-flex-right\@m {
    justify-content: flex-end;
  }
  .uk-flex-between\@m {
    justify-content: space-between;
  }
  .uk-flex-around\@m {
    justify-content: space-around;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-flex-left\@l {
    justify-content: flex-start;
  }
  .uk-flex-center\@l {
    justify-content: center;
  }
  .uk-flex-right\@l {
    justify-content: flex-end;
  }
  .uk-flex-between\@l {
    justify-content: space-between;
  }
  .uk-flex-around\@l {
    justify-content: space-around;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-flex-left\@xl {
    justify-content: flex-start;
  }
  .uk-flex-center\@xl {
    justify-content: center;
  }
  .uk-flex-right\@xl {
    justify-content: flex-end;
  }
  .uk-flex-between\@xl {
    justify-content: space-between;
  }
  .uk-flex-around\@xl {
    justify-content: space-around;
  }
}
/*
 * Align items in the cross axis of the current line of the flex container
 * Row: Vertical
 */
.uk-flex-stretch {
  align-items: stretch;
}
.uk-flex-top {
  align-items: flex-start;
}
.uk-flex-middle {
  align-items: center;
}
.uk-flex-bottom {
  align-items: flex-end;
}
/* Direction
 ========================================================================== */
.uk-flex-row {
  flex-direction: row;
}
.uk-flex-row-reverse {
  flex-direction: row-reverse;
}
.uk-flex-column {
  flex-direction: column;
}
.uk-flex-column-reverse {
  flex-direction: column-reverse;
}
/* Wrap
 ========================================================================== */
.uk-flex-nowrap {
  flex-wrap: nowrap;
}
.uk-flex-wrap {
  flex-wrap: wrap;
}
.uk-flex-wrap-reverse {
  flex-wrap: wrap-reverse;
}
/*
 * Aligns items within the flex container when there is extra space in the cross-axis
 * Only works if there is more than one line of flex items
 */
.uk-flex-wrap-stretch {
  align-content: stretch;
}
.uk-flex-wrap-top {
  align-content: flex-start;
}
.uk-flex-wrap-middle {
  align-content: center;
}
.uk-flex-wrap-bottom {
  align-content: flex-end;
}
.uk-flex-wrap-between {
  align-content: space-between;
}
.uk-flex-wrap-around {
  align-content: space-around;
}
/* Item ordering
 ========================================================================== */
/*
 * Default is 0
 */
.uk-flex-first {
  order: -1;
}
.uk-flex-last {
  order: 99;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-flex-first\@s {
    order: -1;
  }
  .uk-flex-last\@s {
    order: 99;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-flex-first\@m {
    order: -1;
  }
  .uk-flex-last\@m {
    order: 99;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-flex-first\@l {
    order: -1;
  }
  .uk-flex-last\@l {
    order: 99;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-flex-first\@xl {
    order: -1;
  }
  .uk-flex-last\@xl {
    order: 99;
  }
}
/* Item dimensions
 ========================================================================== */
/*
 * Initial: 0 1 auto
 * Content dimensions, but shrinks
 */
/*
 * No Flex: 0 0 auto
 * Content dimensions
 */
.uk-flex-none {
  flex: none;
}
/*
 * Relative Flex: 1 1 auto
 * Space is allocated considering content
 */
.uk-flex-auto {
  flex: auto;
}
/*
 * Absolute Flex: 1 1 0%
 * Space is allocated solely based on flex
 */
.uk-flex-1 {
  flex: 1;
}
/* ========================================================================
   Component: Margin
 ========================================================================== */
/*
 * Default
 */
.uk-margin {
  margin-bottom: 20px;
}
* + .uk-margin {
  margin-top: 20px !important;
}
.uk-margin-top {
  margin-top: 20px !important;
}
.uk-margin-bottom {
  margin-bottom: 20px !important;
}
.uk-margin-left {
  margin-left: 20px !important;
}
.uk-margin-right {
  margin-right: 20px !important;
}
/* Small
 ========================================================================== */
.uk-margin-small {
  margin-bottom: 10px;
}
* + .uk-margin-small {
  margin-top: 10px !important;
}
.uk-margin-small-top {
  margin-top: 10px !important;
}
.uk-margin-small-bottom {
  margin-bottom: 10px !important;
}
.uk-margin-small-left {
  margin-left: 10px !important;
}
.uk-margin-small-right {
  margin-right: 10px !important;
}
/* Medium
 ========================================================================== */
.uk-margin-medium {
  margin-bottom: 40px;
}
* + .uk-margin-medium {
  margin-top: 40px !important;
}
.uk-margin-medium-top {
  margin-top: 40px !important;
}
.uk-margin-medium-bottom {
  margin-bottom: 40px !important;
}
.uk-margin-medium-left {
  margin-left: 40px !important;
}
.uk-margin-medium-right {
  margin-right: 40px !important;
}
/* Large
 ========================================================================== */
.uk-margin-large {
  margin-bottom: 40px;
}
* + .uk-margin-large {
  margin-top: 40px !important;
}
.uk-margin-large-top {
  margin-top: 40px !important;
}
.uk-margin-large-bottom {
  margin-bottom: 40px !important;
}
.uk-margin-large-left {
  margin-left: 40px !important;
}
.uk-margin-large-right {
  margin-right: 40px !important;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-margin-large {
    margin-bottom: 70px;
  }
  * + .uk-margin-large {
    margin-top: 70px !important;
  }
  .uk-margin-large-top {
    margin-top: 70px !important;
  }
  .uk-margin-large-bottom {
    margin-bottom: 70px !important;
  }
  .uk-margin-large-left {
    margin-left: 70px !important;
  }
  .uk-margin-large-right {
    margin-right: 70px !important;
  }
}
/* XLarge
 ========================================================================== */
.uk-margin-xlarge {
  margin-bottom: 70px;
}
* + .uk-margin-xlarge {
  margin-top: 70px !important;
}
.uk-margin-xlarge-top {
  margin-top: 70px !important;
}
.uk-margin-xlarge-bottom {
  margin-bottom: 70px !important;
}
.uk-margin-xlarge-left {
  margin-left: 70px !important;
}
.uk-margin-xlarge-right {
  margin-right: 70px !important;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-margin-xlarge {
    margin-bottom: 140px;
  }
  * + .uk-margin-xlarge {
    margin-top: 140px !important;
  }
  .uk-margin-xlarge-top {
    margin-top: 140px !important;
  }
  .uk-margin-xlarge-bottom {
    margin-bottom: 140px !important;
  }
  .uk-margin-xlarge-left {
    margin-left: 140px !important;
  }
  .uk-margin-xlarge-right {
    margin-right: 140px !important;
  }
}
/* Auto
 ========================================================================== */
.uk-margin-auto {
  margin-left: auto !important;
  margin-right: auto !important;
}
.uk-margin-auto-top {
  margin-top: auto !important;
}
.uk-margin-auto-bottom {
  margin-bottom: auto !important;
}
.uk-margin-auto-left {
  margin-left: auto !important;
}
.uk-margin-auto-right {
  margin-right: auto !important;
}
.uk-margin-auto-vertical {
  margin-top: auto !important;
  margin-bottom: auto !important;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-margin-auto\@s {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .uk-margin-auto-left\@s {
    margin-left: auto !important;
  }
  .uk-margin-auto-right\@s {
    margin-right: auto !important;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-margin-auto\@m {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .uk-margin-auto-left\@m {
    margin-left: auto !important;
  }
  .uk-margin-auto-right\@m {
    margin-right: auto !important;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-margin-auto\@l {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .uk-margin-auto-left\@l {
    margin-left: auto !important;
  }
  .uk-margin-auto-right\@l {
    margin-right: auto !important;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-margin-auto\@xl {
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .uk-margin-auto-left\@xl {
    margin-left: auto !important;
  }
  .uk-margin-auto-right\@xl {
    margin-right: auto !important;
  }
}
/* Remove
 ========================================================================== */
.uk-margin-remove {
  margin: 0 !important;
}
.uk-margin-remove-top {
  margin-top: 0 !important;
}
.uk-margin-remove-bottom {
  margin-bottom: 0 !important;
}
.uk-margin-remove-left {
  margin-left: 0 !important;
}
.uk-margin-remove-right {
  margin-right: 0 !important;
}
.uk-margin-remove-vertical {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
.uk-margin-remove-adjacent + *,
.uk-margin-remove-first-child > :first-child {
  margin-top: 0 !important;
}
.uk-margin-remove-last-child > :last-child {
  margin-bottom: 0 !important;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-margin-remove-left\@s {
    margin-left: 0 !important;
  }
  .uk-margin-remove-right\@s {
    margin-right: 0 !important;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-margin-remove-left\@m {
    margin-left: 0 !important;
  }
  .uk-margin-remove-right\@m {
    margin-right: 0 !important;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-margin-remove-left\@l {
    margin-left: 0 !important;
  }
  .uk-margin-remove-right\@l {
    margin-right: 0 !important;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-margin-remove-left\@xl {
    margin-left: 0 !important;
  }
  .uk-margin-remove-right\@xl {
    margin-right: 0 !important;
  }
}
/* ========================================================================
   Component: Padding
 ========================================================================== */
.uk-padding {
  padding: 30px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-padding {
    padding: 40px;
  }
}
/* Small
 ========================================================================== */
.uk-padding-small {
  padding: 15px;
}
/* Large
 ========================================================================== */
.uk-padding-large {
  padding: 30px;
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-padding-large {
    padding: 70px;
  }
}
/* Remove
 ========================================================================== */
.uk-padding-remove {
  padding: 0 !important;
}
.uk-padding-remove-top {
  padding-top: 0 !important;
}
.uk-padding-remove-bottom {
  padding-bottom: 0 !important;
}
.uk-padding-remove-left {
  padding-left: 0 !important;
}
.uk-padding-remove-right {
  padding-right: 0 !important;
}
.uk-padding-remove-vertical {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.uk-padding-remove-horizontal {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* ========================================================================
   Component: Position
 ========================================================================== */
/* Directions
 ========================================================================== */
[class*='uk-position-top'],
[class*='uk-position-bottom'],
[class*='uk-position-left'],
[class*='uk-position-right'],
[class*='uk-position-center'] {
  position: absolute !important;
}
/* Edges
 ========================================================================== */
/* Don't use `width: 100%` because it is wrong if the parent has padding. */
.uk-position-top {
  top: 0;
  left: 0;
  right: 0;
}
.uk-position-bottom {
  bottom: 0;
  left: 0;
  right: 0;
}
.uk-position-left {
  top: 0;
  bottom: 0;
  left: 0;
}
.uk-position-right {
  top: 0;
  bottom: 0;
  right: 0;
}
/* Corners
 ========================================================================== */
.uk-position-top-left {
  top: 0;
  left: 0;
}
.uk-position-top-right {
  top: 0;
  right: 0;
}
.uk-position-bottom-left {
  bottom: 0;
  left: 0;
}
.uk-position-bottom-right {
  bottom: 0;
  right: 0;
}
/*
 * Center
 * 1. Fix text wrapping if content is larger than 50% of the container.
 */
.uk-position-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* 1 */
  width: max-content;
  max-width: 100%;
  box-sizing: border-box;
}
/* Vertical */
[class*='uk-position-center-left'],
[class*='uk-position-center-right'] {
  top: 50%;
  transform: translateY(-50%);
}
.uk-position-center-left {
  left: 0;
}
.uk-position-center-right {
  right: 0;
}
.uk-position-center-left-out {
  right: 100%;
  width: max-content;
}
.uk-position-center-right-out {
  left: 100%;
  width: max-content;
}
/* Horizontal */
.uk-position-top-center,
.uk-position-bottom-center {
  left: 50%;
  transform: translateX(-50%);
  /* 1 */
  width: max-content;
  max-width: 100%;
  box-sizing: border-box;
}
.uk-position-top-center {
  top: 0;
}
.uk-position-bottom-center {
  bottom: 0;
}
/* Cover
 ========================================================================== */
.uk-position-cover {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
}
/* Utility
 ========================================================================== */
.uk-position-relative {
  position: relative !important;
}
.uk-position-absolute {
  position: absolute !important;
}
.uk-position-fixed {
  position: fixed !important;
}
.uk-position-z-index {
  z-index: 10;
}
/* Margin modifier
 ========================================================================== */
/*
 * Small
 */
.uk-position-small {
  max-width: calc(100% - (15px * 2));
  margin: 15px;
}
.uk-position-small.uk-position-center {
  transform: translate(-50%, -50%) translate(-15px, -15px);
}
.uk-position-small[class*='uk-position-center-left'],
.uk-position-small[class*='uk-position-center-right'] {
  transform: translateY(-50%) translateY(-15px);
}
.uk-position-small.uk-position-top-center,
.uk-position-small.uk-position-bottom-center {
  transform: translateX(-50%) translateX(-15px);
}
/*
 * Medium
 */
.uk-position-medium {
  max-width: calc(100% - (30px * 2));
  margin: 30px;
}
.uk-position-medium.uk-position-center {
  transform: translate(-50%, -50%) translate(-30px, -30px);
}
.uk-position-medium[class*='uk-position-center-left'],
.uk-position-medium[class*='uk-position-center-right'] {
  transform: translateY(-50%) translateY(-30px);
}
.uk-position-medium.uk-position-top-center,
.uk-position-medium.uk-position-bottom-center {
  transform: translateX(-50%) translateX(-30px);
}
/*
 * Large
 */
.uk-position-large {
  max-width: calc(100% - (30px * 2));
  margin: 30px;
}
.uk-position-large.uk-position-center {
  transform: translate(-50%, -50%) translate(-30px, -30px);
}
.uk-position-large[class*='uk-position-center-left'],
.uk-position-large[class*='uk-position-center-right'] {
  transform: translateY(-50%) translateY(-30px);
}
.uk-position-large.uk-position-top-center,
.uk-position-large.uk-position-bottom-center {
  transform: translateX(-50%) translateX(-30px);
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-position-large {
    max-width: calc(100% - (50px * 2));
    margin: 50px;
  }
  .uk-position-large.uk-position-center {
    transform: translate(-50%, -50%) translate(-50px, -50px);
  }
  .uk-position-large[class*='uk-position-center-left'],
  .uk-position-large[class*='uk-position-center-right'] {
    transform: translateY(-50%) translateY(-50px);
  }
  .uk-position-large.uk-position-top-center,
  .uk-position-large.uk-position-bottom-center {
    transform: translateX(-50%) translateX(-50px);
  }
}
/* ========================================================================
   Component: Transition
 ========================================================================== */
/* Toggle (Hover + Focus)
 ========================================================================== */
/*
 * 1. Prevent tab highlighting on iOS.
 */
.uk-transition-toggle {
  /* 1 */
  -webkit-tap-highlight-color: transparent;
}
/*
 * Remove outline for `tabindex`
 */
.uk-transition-toggle:focus {
  outline: none;
}
/* Transitions
 ========================================================================== */
/*
 * The toggle is triggered on touch devices by two methods:
 * 1. Using `:focus` and tabindex
 * 2. Using `:hover` and a `touchstart` event listener registered on the document
 *    (Doesn't work on Surface touch devices)
 *
 * Note: Transitions don't work with `uk-postion-center-*` classes because they also use `transform`,
 *       therefore it's recommended to use an extra `div` for the transition.
 */
.uk-transition-fade,
[class*='uk-transition-scale'],
[class*='uk-transition-slide'] {
  transition: 0.3s ease-out;
  transition-property: opacity, transform, filter;
  opacity: 0;
}
/*
 * Fade
 */
.uk-transition-toggle:hover .uk-transition-fade,
.uk-transition-toggle:focus .uk-transition-fade,
.uk-transition-active.uk-active .uk-transition-fade {
  opacity: 1;
}
/*
 * Scale
 */
.uk-transition-scale-up {
  transform: scale(1, 1);
}
.uk-transition-scale-down {
  transform: scale(1.1, 1.1);
}
/* Show */
.uk-transition-toggle:hover .uk-transition-scale-up,
.uk-transition-toggle:focus .uk-transition-scale-up,
.uk-transition-active.uk-active .uk-transition-scale-up {
  opacity: 1;
  transform: scale(1.1, 1.1);
}
.uk-transition-toggle:hover .uk-transition-scale-down,
.uk-transition-toggle:focus .uk-transition-scale-down,
.uk-transition-active.uk-active .uk-transition-scale-down {
  opacity: 1;
  transform: scale(1, 1);
}
/*
 * Slide
 */
.uk-transition-slide-top {
  transform: translateY(-100%);
}
.uk-transition-slide-bottom {
  transform: translateY(100%);
}
.uk-transition-slide-left {
  transform: translateX(-100%);
}
.uk-transition-slide-right {
  transform: translateX(100%);
}
.uk-transition-slide-top-small {
  transform: translateY(-10px);
}
.uk-transition-slide-bottom-small {
  transform: translateY(10px);
}
.uk-transition-slide-left-small {
  transform: translateX(-10px);
}
.uk-transition-slide-right-small {
  transform: translateX(10px);
}
.uk-transition-slide-top-medium {
  transform: translateY(-50px);
}
.uk-transition-slide-bottom-medium {
  transform: translateY(50px);
}
.uk-transition-slide-left-medium {
  transform: translateX(-50px);
}
.uk-transition-slide-right-medium {
  transform: translateX(50px);
}
/* Show */
.uk-transition-toggle:hover [class*='uk-transition-slide'],
.uk-transition-toggle:focus [class*='uk-transition-slide'],
.uk-transition-active.uk-active [class*='uk-transition-slide'] {
  opacity: 1;
  transform: translate(0, 0);
}
/* Opacity modifier
 ========================================================================== */
.uk-transition-opaque {
  opacity: 1;
}
/* Duration modifiers
 ========================================================================== */
.uk-transition-slow {
  transition-duration: 0.7s;
}
/* ========================================================================
   Component: Visibility
 ========================================================================== */
/*
 * Hidden
 * `hidden` attribute also set here to make it stronger
 */
[hidden],
.uk-hidden {
  display: none !important;
}
/* Phone landscape and bigger */
@media (min-width: 640px) {
  .uk-hidden\@s {
    display: none !important;
  }
}
/* Tablet landscape and bigger */
@media (min-width: 960px) {
  .uk-hidden\@m {
    display: none !important;
  }
}
/* Desktop and bigger */
@media (min-width: 1200px) {
  .uk-hidden\@l {
    display: none !important;
  }
}
/* Large screen and bigger */
@media (min-width: 1600px) {
  .uk-hidden\@xl {
    display: none !important;
  }
}
/*
 * Visible
 */
/* Phone portrait and smaller */
@media (max-width: 639px) {
  .uk-visible\@s {
    display: none !important;
  }
}
/* Phone landscape and smaller */
@media (max-width: 959px) {
  .uk-visible\@m {
    display: none !important;
  }
}
/* Tablet landscape and smaller */
@media (max-width: 1199px) {
  .uk-visible\@l {
    display: none !important;
  }
}
/* Desktop and smaller */
@media (max-width: 1599px) {
  .uk-visible\@xl {
    display: none !important;
  }
}
/* Visibility
 ========================================================================== */
.uk-invisible {
  visibility: hidden !important;
}
/* Toggle (Hover + Focus)
 ========================================================================== */
/*
 * Hidden
 * 1. The toggle is triggered on touch devices using `:focus` and tabindex
 * 2. The target stays visible if any element within receives focus through keyboard
 *    Doesn't work in Edge, yet.
 * 3. Can't use `display: none` nor `visibility: hidden` because both are not focusable.
 *
 */
/* 1 + 2 */
.uk-visible-toggle:not(:hover):not(:focus) .uk-hidden-hover:not(:focus-within) {
  /* 3 */
  position: absolute !important;
  width: 0 !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}
/*
 * Invisible
 */
/* 1 + 2 */
.uk-visible-toggle:not(:hover):not(:focus) .uk-invisible-hover:not(:focus-within) {
  /* 3 */
  opacity: 0 !important;
}
/*
 * 1. Prevent tab highlighting on iOS.
 */
.uk-visible-toggle {
  /* 1 */
  -webkit-tap-highlight-color: transparent;
}
/*
 * Remove outline for `tabindex`
 */
.uk-visible-toggle:focus {
  outline: none;
}
/* Touch
 ========================================================================== */
/*
 * Hide if primary pointing device has limited accuracy, e.g. a touch screen.
 * Works on mobile browsers: Safari, Chrome and Android browser
 */
@media (pointer: coarse) {
  .uk-hidden-touch {
    display: none !important;
  }
}
/*
 * Hide if primary pointing device is accurate, e.g. mouse.
 * 1. Fallback for IE11 and Firefox, because `pointer` is not supported
 * 2. Reset if supported
 */
/* 1 */
.uk-hidden-notouch {
  display: none !important;
}
@media (pointer: coarse) {
  .uk-hidden-notouch {
    display: block !important;
  }
}
/* ========================================================================
   Component: Inverse
 ========================================================================== */
/*
 * Implemented class depends on the general theme color
 * `uk-light` is for light colors on dark backgrounds
 * `uk-dark` is or dark colors on light backgrounds
 */
.uk-light,
.uk-section-primary:not(.uk-preserve-color),
.uk-section-secondary:not(.uk-preserve-color),
.uk-tile-primary:not(.uk-preserve-color),
.uk-tile-secondary:not(.uk-preserve-color),
.uk-card-primary.uk-card-body,
.uk-card-primary > :not([class*='uk-card-media']),
.uk-card-secondary.uk-card-body,
.uk-card-secondary > :not([class*='uk-card-media']),
.uk-overlay-primary,
.uk-offcanvas-bar.uk-light{
  color: rgba(255, 255, 255, 0.7);
}
.uk-light a,
.uk-light .uk-link,
.uk-section-primary:not(.uk-preserve-color) a,
.uk-section-primary:not(.uk-preserve-color) .uk-link,
.uk-section-secondary:not(.uk-preserve-color) a,
.uk-section-secondary:not(.uk-preserve-color) .uk-link,
.uk-tile-primary:not(.uk-preserve-color) a,
.uk-tile-primary:not(.uk-preserve-color) .uk-link,
.uk-tile-secondary:not(.uk-preserve-color) a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link,
.uk-card-primary.uk-card-body a,
.uk-card-primary.uk-card-body .uk-link,
.uk-card-primary > :not([class*='uk-card-media']) a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link,
.uk-card-secondary.uk-card-body a,
.uk-card-secondary.uk-card-body .uk-link,
.uk-card-secondary > :not([class*='uk-card-media']) a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link,
.uk-overlay-primary a,
.uk-overlay-primary .uk-link,
.uk-offcanvas-bar.uk-lighta,
.uk-offcanvas-bar.uk-light.uk-link {
  color: #fff;
}
.uk-light a:hover,
.uk-light .uk-link:hover,
.uk-section-primary:not(.uk-preserve-color) a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link:hover,
.uk-section-secondary:not(.uk-preserve-color) a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link:hover,
.uk-tile-primary:not(.uk-preserve-color) a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link:hover,
.uk-tile-secondary:not(.uk-preserve-color) a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link:hover,
.uk-card-primary.uk-card-body a:hover,
.uk-card-primary.uk-card-body .uk-link:hover,
.uk-card-primary > :not([class*='uk-card-media']) a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link:hover,
.uk-card-secondary.uk-card-body a:hover,
.uk-card-secondary.uk-card-body .uk-link:hover,
.uk-card-secondary > :not([class*='uk-card-media']) a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link:hover,
.uk-overlay-primary a:hover,
.uk-overlay-primary .uk-link:hover,
.uk-offcanvas-bar.uk-lighta:hover,
.uk-offcanvas-bar.uk-light.uk-link:hover {
  color: #fff;
}
.uk-light :not(pre) > code,
.uk-light :not(pre) > kbd,
.uk-light :not(pre) > samp,
.uk-section-primary:not(.uk-preserve-color) :not(pre) > code,
.uk-section-primary:not(.uk-preserve-color) :not(pre) > kbd,
.uk-section-primary:not(.uk-preserve-color) :not(pre) > samp,
.uk-section-secondary:not(.uk-preserve-color) :not(pre) > code,
.uk-section-secondary:not(.uk-preserve-color) :not(pre) > kbd,
.uk-section-secondary:not(.uk-preserve-color) :not(pre) > samp,
.uk-tile-primary:not(.uk-preserve-color) :not(pre) > code,
.uk-tile-primary:not(.uk-preserve-color) :not(pre) > kbd,
.uk-tile-primary:not(.uk-preserve-color) :not(pre) > samp,
.uk-tile-secondary:not(.uk-preserve-color) :not(pre) > code,
.uk-tile-secondary:not(.uk-preserve-color) :not(pre) > kbd,
.uk-tile-secondary:not(.uk-preserve-color) :not(pre) > samp,
.uk-card-primary.uk-card-body :not(pre) > code,
.uk-card-primary.uk-card-body :not(pre) > kbd,
.uk-card-primary.uk-card-body :not(pre) > samp,
.uk-card-primary > :not([class*='uk-card-media']) :not(pre) > code,
.uk-card-primary > :not([class*='uk-card-media']) :not(pre) > kbd,
.uk-card-primary > :not([class*='uk-card-media']) :not(pre) > samp,
.uk-card-secondary.uk-card-body :not(pre) > code,
.uk-card-secondary.uk-card-body :not(pre) > kbd,
.uk-card-secondary.uk-card-body :not(pre) > samp,
.uk-card-secondary > :not([class*='uk-card-media']) :not(pre) > code,
.uk-card-secondary > :not([class*='uk-card-media']) :not(pre) > kbd,
.uk-card-secondary > :not([class*='uk-card-media']) :not(pre) > samp,
.uk-overlay-primary :not(pre) > code,
.uk-overlay-primary :not(pre) > kbd,
.uk-overlay-primary :not(pre) > samp,
.uk-offcanvas-bar.uk-light:not(pre) > code,
.uk-offcanvas-bar.uk-light:not(pre) > kbd,
.uk-offcanvas-bar.uk-light:not(pre) > samp {
  color: rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.1);
}
.uk-light em,
.uk-section-primary:not(.uk-preserve-color) em,
.uk-section-secondary:not(.uk-preserve-color) em,
.uk-tile-primary:not(.uk-preserve-color) em,
.uk-tile-secondary:not(.uk-preserve-color) em,
.uk-card-primary.uk-card-body em,
.uk-card-primary > :not([class*='uk-card-media']) em,
.uk-card-secondary.uk-card-body em,
.uk-card-secondary > :not([class*='uk-card-media']) em,
.uk-overlay-primary em,
.uk-offcanvas-bar.uk-lightem {
  color: #fff;
}
.uk-light h1,
.uk-light .uk-h1,
.uk-light h2,
.uk-light .uk-h2,
.uk-light h3,
.uk-light .uk-h3,
.uk-light h4,
.uk-light .uk-h4,
.uk-light h5,
.uk-light .uk-h5,
.uk-light h6,
.uk-light .uk-h6,
.uk-light .uk-heading-small,
.uk-light .uk-heading-medium,
.uk-light .uk-heading-large,
.uk-light .uk-heading-xlarge,
.uk-light .uk-heading-2xlarge,
.uk-section-primary:not(.uk-preserve-color) h1,
.uk-section-primary:not(.uk-preserve-color) .uk-h1,
.uk-section-primary:not(.uk-preserve-color) h2,
.uk-section-primary:not(.uk-preserve-color) .uk-h2,
.uk-section-primary:not(.uk-preserve-color) h3,
.uk-section-primary:not(.uk-preserve-color) .uk-h3,
.uk-section-primary:not(.uk-preserve-color) h4,
.uk-section-primary:not(.uk-preserve-color) .uk-h4,
.uk-section-primary:not(.uk-preserve-color) h5,
.uk-section-primary:not(.uk-preserve-color) .uk-h5,
.uk-section-primary:not(.uk-preserve-color) h6,
.uk-section-primary:not(.uk-preserve-color) .uk-h6,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-small,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-medium,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-large,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-section-secondary:not(.uk-preserve-color) h1,
.uk-section-secondary:not(.uk-preserve-color) .uk-h1,
.uk-section-secondary:not(.uk-preserve-color) h2,
.uk-section-secondary:not(.uk-preserve-color) .uk-h2,
.uk-section-secondary:not(.uk-preserve-color) h3,
.uk-section-secondary:not(.uk-preserve-color) .uk-h3,
.uk-section-secondary:not(.uk-preserve-color) h4,
.uk-section-secondary:not(.uk-preserve-color) .uk-h4,
.uk-section-secondary:not(.uk-preserve-color) h5,
.uk-section-secondary:not(.uk-preserve-color) .uk-h5,
.uk-section-secondary:not(.uk-preserve-color) h6,
.uk-section-secondary:not(.uk-preserve-color) .uk-h6,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-small,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-medium,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-large,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-tile-primary:not(.uk-preserve-color) h1,
.uk-tile-primary:not(.uk-preserve-color) .uk-h1,
.uk-tile-primary:not(.uk-preserve-color) h2,
.uk-tile-primary:not(.uk-preserve-color) .uk-h2,
.uk-tile-primary:not(.uk-preserve-color) h3,
.uk-tile-primary:not(.uk-preserve-color) .uk-h3,
.uk-tile-primary:not(.uk-preserve-color) h4,
.uk-tile-primary:not(.uk-preserve-color) .uk-h4,
.uk-tile-primary:not(.uk-preserve-color) h5,
.uk-tile-primary:not(.uk-preserve-color) .uk-h5,
.uk-tile-primary:not(.uk-preserve-color) h6,
.uk-tile-primary:not(.uk-preserve-color) .uk-h6,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-small,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-medium,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-large,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-tile-secondary:not(.uk-preserve-color) h1,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h1,
.uk-tile-secondary:not(.uk-preserve-color) h2,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h2,
.uk-tile-secondary:not(.uk-preserve-color) h3,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h3,
.uk-tile-secondary:not(.uk-preserve-color) h4,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h4,
.uk-tile-secondary:not(.uk-preserve-color) h5,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h5,
.uk-tile-secondary:not(.uk-preserve-color) h6,
.uk-tile-secondary:not(.uk-preserve-color) .uk-h6,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-small,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-medium,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-large,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-xlarge,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-2xlarge,
.uk-card-primary.uk-card-body h1,
.uk-card-primary.uk-card-body .uk-h1,
.uk-card-primary.uk-card-body h2,
.uk-card-primary.uk-card-body .uk-h2,
.uk-card-primary.uk-card-body h3,
.uk-card-primary.uk-card-body .uk-h3,
.uk-card-primary.uk-card-body h4,
.uk-card-primary.uk-card-body .uk-h4,
.uk-card-primary.uk-card-body h5,
.uk-card-primary.uk-card-body .uk-h5,
.uk-card-primary.uk-card-body h6,
.uk-card-primary.uk-card-body .uk-h6,
.uk-card-primary.uk-card-body .uk-heading-small,
.uk-card-primary.uk-card-body .uk-heading-medium,
.uk-card-primary.uk-card-body .uk-heading-large,
.uk-card-primary.uk-card-body .uk-heading-xlarge,
.uk-card-primary.uk-card-body .uk-heading-2xlarge,
.uk-card-primary > :not([class*='uk-card-media']) h1,
.uk-card-primary > :not([class*='uk-card-media']) .uk-h1,
.uk-card-primary > :not([class*='uk-card-media']) h2,
.uk-card-primary > :not([class*='uk-card-media']) .uk-h2,
.uk-card-primary > :not([class*='uk-card-media']) h3,
.uk-card-primary > :not([class*='uk-card-media']) .uk-h3,
.uk-card-primary > :not([class*='uk-card-media']) h4,
.uk-card-primary > :not([class*='uk-card-media']) .uk-h4,
.uk-card-primary > :not([class*='uk-card-media']) h5,
.uk-card-primary > :not([class*='uk-card-media']) .uk-h5,
.uk-card-primary > :not([class*='uk-card-media']) h6,
.uk-card-primary > :not([class*='uk-card-media']) .uk-h6,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-small,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-medium,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-large,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-xlarge,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-2xlarge,
.uk-card-secondary.uk-card-body h1,
.uk-card-secondary.uk-card-body .uk-h1,
.uk-card-secondary.uk-card-body h2,
.uk-card-secondary.uk-card-body .uk-h2,
.uk-card-secondary.uk-card-body h3,
.uk-card-secondary.uk-card-body .uk-h3,
.uk-card-secondary.uk-card-body h4,
.uk-card-secondary.uk-card-body .uk-h4,
.uk-card-secondary.uk-card-body h5,
.uk-card-secondary.uk-card-body .uk-h5,
.uk-card-secondary.uk-card-body h6,
.uk-card-secondary.uk-card-body .uk-h6,
.uk-card-secondary.uk-card-body .uk-heading-small,
.uk-card-secondary.uk-card-body .uk-heading-medium,
.uk-card-secondary.uk-card-body .uk-heading-large,
.uk-card-secondary.uk-card-body .uk-heading-xlarge,
.uk-card-secondary.uk-card-body .uk-heading-2xlarge,
.uk-card-secondary > :not([class*='uk-card-media']) h1,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-h1,
.uk-card-secondary > :not([class*='uk-card-media']) h2,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-h2,
.uk-card-secondary > :not([class*='uk-card-media']) h3,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-h3,
.uk-card-secondary > :not([class*='uk-card-media']) h4,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-h4,
.uk-card-secondary > :not([class*='uk-card-media']) h5,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-h5,
.uk-card-secondary > :not([class*='uk-card-media']) h6,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-h6,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-small,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-medium,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-large,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-xlarge,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-2xlarge,
.uk-overlay-primary h1,
.uk-overlay-primary .uk-h1,
.uk-overlay-primary h2,
.uk-overlay-primary .uk-h2,
.uk-overlay-primary h3,
.uk-overlay-primary .uk-h3,
.uk-overlay-primary h4,
.uk-overlay-primary .uk-h4,
.uk-overlay-primary h5,
.uk-overlay-primary .uk-h5,
.uk-overlay-primary h6,
.uk-overlay-primary .uk-h6,
.uk-overlay-primary .uk-heading-small,
.uk-overlay-primary .uk-heading-medium,
.uk-overlay-primary .uk-heading-large,
.uk-overlay-primary .uk-heading-xlarge,
.uk-overlay-primary .uk-heading-2xlarge,
.uk-offcanvas-bar.uk-lighth1,
.uk-offcanvas-bar.uk-light.uk-h1,
.uk-offcanvas-bar.uk-lighth2,
.uk-offcanvas-bar.uk-light.uk-h2,
.uk-offcanvas-bar.uk-lighth3,
.uk-offcanvas-bar.uk-light.uk-h3,
.uk-offcanvas-bar.uk-lighth4,
.uk-offcanvas-bar.uk-light.uk-h4,
.uk-offcanvas-bar.uk-lighth5,
.uk-offcanvas-bar.uk-light.uk-h5,
.uk-offcanvas-bar.uk-lighth6,
.uk-offcanvas-bar.uk-light.uk-h6,
.uk-offcanvas-bar.uk-light.uk-heading-small,
.uk-offcanvas-bar.uk-light.uk-heading-medium,
.uk-offcanvas-bar.uk-light.uk-heading-large,
.uk-offcanvas-bar.uk-light.uk-heading-xlarge,
.uk-offcanvas-bar.uk-light.uk-heading-2xlarge {
  color: #fff;
}
.uk-light blockquote,
.uk-section-primary:not(.uk-preserve-color) blockquote,
.uk-section-secondary:not(.uk-preserve-color) blockquote,
.uk-tile-primary:not(.uk-preserve-color) blockquote,
.uk-tile-secondary:not(.uk-preserve-color) blockquote,
.uk-card-primary.uk-card-body blockquote,
.uk-card-primary > :not([class*='uk-card-media']) blockquote,
.uk-card-secondary.uk-card-body blockquote,
.uk-card-secondary > :not([class*='uk-card-media']) blockquote,
.uk-overlay-primary blockquote,
.uk-offcanvas-bar.uk-lightblockquote {
  color: #fff;
}
.uk-light blockquote footer,
.uk-section-primary:not(.uk-preserve-color) blockquote footer,
.uk-section-secondary:not(.uk-preserve-color) blockquote footer,
.uk-tile-primary:not(.uk-preserve-color) blockquote footer,
.uk-tile-secondary:not(.uk-preserve-color) blockquote footer,
.uk-card-primary.uk-card-body blockquote footer,
.uk-card-primary > :not([class*='uk-card-media']) blockquote footer,
.uk-card-secondary.uk-card-body blockquote footer,
.uk-card-secondary > :not([class*='uk-card-media']) blockquote footer,
.uk-overlay-primary blockquote footer,
.uk-offcanvas-bar.uk-lightblockquote footer {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light hr,
.uk-light .uk-hr,
.uk-section-primary:not(.uk-preserve-color) hr,
.uk-section-primary:not(.uk-preserve-color) .uk-hr,
.uk-section-secondary:not(.uk-preserve-color) hr,
.uk-section-secondary:not(.uk-preserve-color) .uk-hr,
.uk-tile-primary:not(.uk-preserve-color) hr,
.uk-tile-primary:not(.uk-preserve-color) .uk-hr,
.uk-tile-secondary:not(.uk-preserve-color) hr,
.uk-tile-secondary:not(.uk-preserve-color) .uk-hr,
.uk-card-primary.uk-card-body hr,
.uk-card-primary.uk-card-body .uk-hr,
.uk-card-primary > :not([class*='uk-card-media']) hr,
.uk-card-primary > :not([class*='uk-card-media']) .uk-hr,
.uk-card-secondary.uk-card-body hr,
.uk-card-secondary.uk-card-body .uk-hr,
.uk-card-secondary > :not([class*='uk-card-media']) hr,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-hr,
.uk-overlay-primary hr,
.uk-overlay-primary .uk-hr,
.uk-offcanvas-bar.uk-lighthr,
.uk-offcanvas-bar.uk-light.uk-hr {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-link-muted,
.uk-light .uk-link-muted a,
.uk-section-primary:not(.uk-preserve-color) .uk-link-muted,
.uk-section-primary:not(.uk-preserve-color) .uk-link-muted a,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-muted,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-muted a,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-muted,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-muted a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-muted,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-muted a,
.uk-card-primary.uk-card-body .uk-link-muted,
.uk-card-primary.uk-card-body .uk-link-muted a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-muted,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-muted a,
.uk-card-secondary.uk-card-body .uk-link-muted,
.uk-card-secondary.uk-card-body .uk-link-muted a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-muted,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-muted a,
.uk-overlay-primary .uk-link-muted,
.uk-overlay-primary .uk-link-muted a,
.uk-offcanvas-bar.uk-light.uk-link-muted,
.uk-offcanvas-bar.uk-light.uk-link-muted a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-link-muted:hover,
.uk-light .uk-link-muted a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link-muted:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link-muted a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-muted:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-muted a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-muted:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-muted a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-muted:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-muted a:hover,
.uk-card-primary.uk-card-body .uk-link-muted:hover,
.uk-card-primary.uk-card-body .uk-link-muted a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-muted:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-muted a:hover,
.uk-card-secondary.uk-card-body .uk-link-muted:hover,
.uk-card-secondary.uk-card-body .uk-link-muted a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-muted:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-muted a:hover,
.uk-overlay-primary .uk-link-muted:hover,
.uk-overlay-primary .uk-link-muted a:hover,
.uk-offcanvas-bar.uk-light.uk-link-muted:hover,
.uk-offcanvas-bar.uk-light.uk-link-muted a:hover {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-link-text:hover,
.uk-light .uk-link-text a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link-text:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link-text a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-text:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-text a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-text:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-text a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-text:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-text a:hover,
.uk-card-primary.uk-card-body .uk-link-text:hover,
.uk-card-primary.uk-card-body .uk-link-text a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-text:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-text a:hover,
.uk-card-secondary.uk-card-body .uk-link-text:hover,
.uk-card-secondary.uk-card-body .uk-link-text a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-text:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-text a:hover,
.uk-overlay-primary .uk-link-text:hover,
.uk-overlay-primary .uk-link-text a:hover,
.uk-offcanvas-bar.uk-light.uk-link-text:hover,
.uk-offcanvas-bar.uk-light.uk-link-text a:hover {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-link-heading:hover,
.uk-light .uk-link-heading a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link-heading:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-link-heading a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-heading:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-link-heading a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-heading:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-link-heading a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-heading:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-link-heading a:hover,
.uk-card-primary.uk-card-body .uk-link-heading:hover,
.uk-card-primary.uk-card-body .uk-link-heading a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-heading:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-link-heading a:hover,
.uk-card-secondary.uk-card-body .uk-link-heading:hover,
.uk-card-secondary.uk-card-body .uk-link-heading a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-heading:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-link-heading a:hover,
.uk-overlay-primary .uk-link-heading:hover,
.uk-overlay-primary .uk-link-heading a:hover,
.uk-offcanvas-bar.uk-light.uk-link-heading:hover,
.uk-offcanvas-bar.uk-light.uk-link-heading a:hover {
  color: #fff;
}
.uk-light .uk-heading-divider,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-divider,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-divider,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-divider,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-divider,
.uk-card-primary.uk-card-body .uk-heading-divider,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-divider,
.uk-card-secondary.uk-card-body .uk-heading-divider,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-divider,
.uk-overlay-primary .uk-heading-divider,
.uk-offcanvas-bar.uk-light.uk-heading-divider {
  border-bottom-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-heading-bullet::before,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-bullet::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-bullet::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-bullet::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-bullet::before,
.uk-card-primary.uk-card-body .uk-heading-bullet::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-bullet::before,
.uk-card-secondary.uk-card-body .uk-heading-bullet::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-bullet::before,
.uk-overlay-primary .uk-heading-bullet::before,
.uk-offcanvas-bar.uk-light.uk-heading-bullet::before {
  border-left-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-heading-line > ::before,
.uk-light .uk-heading-line > ::after,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-line > ::before,
.uk-section-primary:not(.uk-preserve-color) .uk-heading-line > ::after,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-line > ::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-heading-line > ::after,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-line > ::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-heading-line > ::after,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-line > ::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-heading-line > ::after,
.uk-card-primary.uk-card-body .uk-heading-line > ::before,
.uk-card-primary.uk-card-body .uk-heading-line > ::after,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-line > ::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-heading-line > ::after,
.uk-card-secondary.uk-card-body .uk-heading-line > ::before,
.uk-card-secondary.uk-card-body .uk-heading-line > ::after,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-line > ::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-heading-line > ::after,
.uk-overlay-primary .uk-heading-line > ::before,
.uk-overlay-primary .uk-heading-line > ::after,
.uk-offcanvas-bar.uk-light.uk-heading-line > ::before,
.uk-offcanvas-bar.uk-light.uk-heading-line > ::after {
  border-bottom-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-divider-icon,
.uk-section-primary:not(.uk-preserve-color) .uk-divider-icon,
.uk-section-secondary:not(.uk-preserve-color) .uk-divider-icon,
.uk-tile-primary:not(.uk-preserve-color) .uk-divider-icon,
.uk-tile-secondary:not(.uk-preserve-color) .uk-divider-icon,
.uk-card-primary.uk-card-body .uk-divider-icon,
.uk-card-primary > :not([class*='uk-card-media']) .uk-divider-icon,
.uk-card-secondary.uk-card-body .uk-divider-icon,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-divider-icon,
.uk-overlay-primary .uk-divider-icon,
.uk-offcanvas-bar.uk-light.uk-divider-icon {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22none%22%20stroke%3D%22rgba%28255,%20255,%20255,%200.2%29%22%20stroke-width%3D%222%22%20cx%3D%2210%22%20cy%3D%2210%22%20r%3D%227%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.uk-light .uk-divider-icon::before,
.uk-light .uk-divider-icon::after,
.uk-section-primary:not(.uk-preserve-color) .uk-divider-icon::before,
.uk-section-primary:not(.uk-preserve-color) .uk-divider-icon::after,
.uk-section-secondary:not(.uk-preserve-color) .uk-divider-icon::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-divider-icon::after,
.uk-tile-primary:not(.uk-preserve-color) .uk-divider-icon::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-divider-icon::after,
.uk-tile-secondary:not(.uk-preserve-color) .uk-divider-icon::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-divider-icon::after,
.uk-card-primary.uk-card-body .uk-divider-icon::before,
.uk-card-primary.uk-card-body .uk-divider-icon::after,
.uk-card-primary > :not([class*='uk-card-media']) .uk-divider-icon::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-divider-icon::after,
.uk-card-secondary.uk-card-body .uk-divider-icon::before,
.uk-card-secondary.uk-card-body .uk-divider-icon::after,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-divider-icon::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-divider-icon::after,
.uk-overlay-primary .uk-divider-icon::before,
.uk-overlay-primary .uk-divider-icon::after,
.uk-offcanvas-bar.uk-light.uk-divider-icon::before,
.uk-offcanvas-bar.uk-light.uk-divider-icon::after {
  border-bottom-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-divider-small::after,
.uk-section-primary:not(.uk-preserve-color) .uk-divider-small::after,
.uk-section-secondary:not(.uk-preserve-color) .uk-divider-small::after,
.uk-tile-primary:not(.uk-preserve-color) .uk-divider-small::after,
.uk-tile-secondary:not(.uk-preserve-color) .uk-divider-small::after,
.uk-card-primary.uk-card-body .uk-divider-small::after,
.uk-card-primary > :not([class*='uk-card-media']) .uk-divider-small::after,
.uk-card-secondary.uk-card-body .uk-divider-small::after,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-divider-small::after,
.uk-overlay-primary .uk-divider-small::after,
.uk-offcanvas-bar.uk-light.uk-divider-small::after {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-divider-vertical,
.uk-section-primary:not(.uk-preserve-color) .uk-divider-vertical,
.uk-section-secondary:not(.uk-preserve-color) .uk-divider-vertical,
.uk-tile-primary:not(.uk-preserve-color) .uk-divider-vertical,
.uk-tile-secondary:not(.uk-preserve-color) .uk-divider-vertical,
.uk-card-primary.uk-card-body .uk-divider-vertical,
.uk-card-primary > :not([class*='uk-card-media']) .uk-divider-vertical,
.uk-card-secondary.uk-card-body .uk-divider-vertical,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-divider-vertical,
.uk-overlay-primary .uk-divider-vertical,
.uk-offcanvas-bar.uk-light.uk-divider-vertical {
  border-left-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-list-divider > li:nth-child(n+2),
.uk-section-primary:not(.uk-preserve-color) .uk-list-divider > li:nth-child(n+2),
.uk-section-secondary:not(.uk-preserve-color) .uk-list-divider > li:nth-child(n+2),
.uk-tile-primary:not(.uk-preserve-color) .uk-list-divider > li:nth-child(n+2),
.uk-tile-secondary:not(.uk-preserve-color) .uk-list-divider > li:nth-child(n+2),
.uk-card-primary.uk-card-body .uk-list-divider > li:nth-child(n+2),
.uk-card-primary > :not([class*='uk-card-media']) .uk-list-divider > li:nth-child(n+2),
.uk-card-secondary.uk-card-body .uk-list-divider > li:nth-child(n+2),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-list-divider > li:nth-child(n+2),
.uk-overlay-primary .uk-list-divider > li:nth-child(n+2),
.uk-offcanvas-bar.uk-light.uk-list-divider > li:nth-child(n+2) {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-list-striped > li:nth-of-type(odd),
.uk-section-primary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-section-secondary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-tile-primary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-tile-secondary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-card-primary.uk-card-body .uk-list-striped > li:nth-of-type(odd),
.uk-card-primary > :not([class*='uk-card-media']) .uk-list-striped > li:nth-of-type(odd),
.uk-card-secondary.uk-card-body .uk-list-striped > li:nth-of-type(odd),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-list-striped > li:nth-of-type(odd),
.uk-overlay-primary .uk-list-striped > li:nth-of-type(odd),
.uk-offcanvas-bar.uk-light.uk-list-striped > li:nth-of-type(odd) {
  border-top-color: rgba(255, 255, 255, 0.2);
  border-bottom-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-list-striped > li:nth-of-type(odd),
.uk-section-primary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-section-secondary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-tile-primary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-tile-secondary:not(.uk-preserve-color) .uk-list-striped > li:nth-of-type(odd),
.uk-card-primary.uk-card-body .uk-list-striped > li:nth-of-type(odd),
.uk-card-primary > :not([class*='uk-card-media']) .uk-list-striped > li:nth-of-type(odd),
.uk-card-secondary.uk-card-body .uk-list-striped > li:nth-of-type(odd),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-list-striped > li:nth-of-type(odd),
.uk-overlay-primary .uk-list-striped > li:nth-of-type(odd),
.uk-offcanvas-bar.uk-light.uk-list-striped > li:nth-of-type(odd) {
  background-color: rgba(255, 255, 255, 0.1);
}
.uk-light .uk-list-bullet > li::before,
.uk-section-primary:not(.uk-preserve-color) .uk-list-bullet > li::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-list-bullet > li::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-list-bullet > li::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-list-bullet > li::before,
.uk-card-primary.uk-card-body .uk-list-bullet > li::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-list-bullet > li::before,
.uk-card-secondary.uk-card-body .uk-list-bullet > li::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-list-bullet > li::before,
.uk-overlay-primary .uk-list-bullet > li::before,
.uk-offcanvas-bar.uk-light.uk-list-bullet > li::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%226%22%20height%3D%226%22%20viewBox%3D%220%200%206%206%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20cx%3D%223%22%20cy%3D%223%22%20r%3D%223%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-light .uk-table th,
.uk-section-primary:not(.uk-preserve-color) .uk-table th,
.uk-section-secondary:not(.uk-preserve-color) .uk-table th,
.uk-tile-primary:not(.uk-preserve-color) .uk-table th,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table th,
.uk-card-primary.uk-card-body .uk-table th,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table th,
.uk-card-secondary.uk-card-body .uk-table th,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table th,
.uk-overlay-primary .uk-table th,
.uk-offcanvas-bar.uk-light.uk-table th {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-table caption,
.uk-section-primary:not(.uk-preserve-color) .uk-table caption,
.uk-section-secondary:not(.uk-preserve-color) .uk-table caption,
.uk-tile-primary:not(.uk-preserve-color) .uk-table caption,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table caption,
.uk-card-primary.uk-card-body .uk-table caption,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table caption,
.uk-card-secondary.uk-card-body .uk-table caption,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table caption,
.uk-overlay-primary .uk-table caption,
.uk-offcanvas-bar.uk-light.uk-table caption {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-table > tr.uk-active,
.uk-light .uk-table tbody tr.uk-active,
.uk-section-primary:not(.uk-preserve-color) .uk-table > tr.uk-active,
.uk-section-primary:not(.uk-preserve-color) .uk-table tbody tr.uk-active,
.uk-section-secondary:not(.uk-preserve-color) .uk-table > tr.uk-active,
.uk-section-secondary:not(.uk-preserve-color) .uk-table tbody tr.uk-active,
.uk-tile-primary:not(.uk-preserve-color) .uk-table > tr.uk-active,
.uk-tile-primary:not(.uk-preserve-color) .uk-table tbody tr.uk-active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table > tr.uk-active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table tbody tr.uk-active,
.uk-card-primary.uk-card-body .uk-table > tr.uk-active,
.uk-card-primary.uk-card-body .uk-table tbody tr.uk-active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table > tr.uk-active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table tbody tr.uk-active,
.uk-card-secondary.uk-card-body .uk-table > tr.uk-active,
.uk-card-secondary.uk-card-body .uk-table tbody tr.uk-active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table > tr.uk-active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table tbody tr.uk-active,
.uk-overlay-primary .uk-table > tr.uk-active,
.uk-overlay-primary .uk-table tbody tr.uk-active,
.uk-offcanvas-bar.uk-light.uk-table > tr.uk-active,
.uk-offcanvas-bar.uk-light.uk-table tbody tr.uk-active {
  background: rgba(255, 255, 255, 0.08);
}
.uk-light .uk-table-divider > tr:not(:first-child),
.uk-light .uk-table-divider > :not(:first-child) > tr,
.uk-light .uk-table-divider > :first-child > tr:not(:first-child),
.uk-section-primary:not(.uk-preserve-color) .uk-table-divider > tr:not(:first-child),
.uk-section-primary:not(.uk-preserve-color) .uk-table-divider > :not(:first-child) > tr,
.uk-section-primary:not(.uk-preserve-color) .uk-table-divider > :first-child > tr:not(:first-child),
.uk-section-secondary:not(.uk-preserve-color) .uk-table-divider > tr:not(:first-child),
.uk-section-secondary:not(.uk-preserve-color) .uk-table-divider > :not(:first-child) > tr,
.uk-section-secondary:not(.uk-preserve-color) .uk-table-divider > :first-child > tr:not(:first-child),
.uk-tile-primary:not(.uk-preserve-color) .uk-table-divider > tr:not(:first-child),
.uk-tile-primary:not(.uk-preserve-color) .uk-table-divider > :not(:first-child) > tr,
.uk-tile-primary:not(.uk-preserve-color) .uk-table-divider > :first-child > tr:not(:first-child),
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-divider > tr:not(:first-child),
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-divider > :not(:first-child) > tr,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-divider > :first-child > tr:not(:first-child),
.uk-card-primary.uk-card-body .uk-table-divider > tr:not(:first-child),
.uk-card-primary.uk-card-body .uk-table-divider > :not(:first-child) > tr,
.uk-card-primary.uk-card-body .uk-table-divider > :first-child > tr:not(:first-child),
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-divider > tr:not(:first-child),
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-divider > :not(:first-child) > tr,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-divider > :first-child > tr:not(:first-child),
.uk-card-secondary.uk-card-body .uk-table-divider > tr:not(:first-child),
.uk-card-secondary.uk-card-body .uk-table-divider > :not(:first-child) > tr,
.uk-card-secondary.uk-card-body .uk-table-divider > :first-child > tr:not(:first-child),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-divider > tr:not(:first-child),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-divider > :not(:first-child) > tr,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-divider > :first-child > tr:not(:first-child),
.uk-overlay-primary .uk-table-divider > tr:not(:first-child),
.uk-overlay-primary .uk-table-divider > :not(:first-child) > tr,
.uk-overlay-primary .uk-table-divider > :first-child > tr:not(:first-child),
.uk-offcanvas-bar.uk-light.uk-table-divider > tr:not(:first-child),
.uk-offcanvas-bar.uk-light.uk-table-divider > :not(:first-child) > tr,
.uk-offcanvas-bar.uk-light.uk-table-divider > :first-child > tr:not(:first-child) {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-table-striped > tr:nth-of-type(odd),
.uk-light .uk-table-striped tbody tr:nth-of-type(odd),
.uk-section-primary:not(.uk-preserve-color) .uk-table-striped > tr:nth-of-type(odd),
.uk-section-primary:not(.uk-preserve-color) .uk-table-striped tbody tr:nth-of-type(odd),
.uk-section-secondary:not(.uk-preserve-color) .uk-table-striped > tr:nth-of-type(odd),
.uk-section-secondary:not(.uk-preserve-color) .uk-table-striped tbody tr:nth-of-type(odd),
.uk-tile-primary:not(.uk-preserve-color) .uk-table-striped > tr:nth-of-type(odd),
.uk-tile-primary:not(.uk-preserve-color) .uk-table-striped tbody tr:nth-of-type(odd),
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-striped > tr:nth-of-type(odd),
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-striped tbody tr:nth-of-type(odd),
.uk-card-primary.uk-card-body .uk-table-striped > tr:nth-of-type(odd),
.uk-card-primary.uk-card-body .uk-table-striped tbody tr:nth-of-type(odd),
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-striped > tr:nth-of-type(odd),
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-striped tbody tr:nth-of-type(odd),
.uk-card-secondary.uk-card-body .uk-table-striped > tr:nth-of-type(odd),
.uk-card-secondary.uk-card-body .uk-table-striped tbody tr:nth-of-type(odd),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-striped > tr:nth-of-type(odd),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-striped tbody tr:nth-of-type(odd),
.uk-overlay-primary .uk-table-striped > tr:nth-of-type(odd),
.uk-overlay-primary .uk-table-striped tbody tr:nth-of-type(odd),
.uk-offcanvas-bar.uk-light.uk-table-striped > tr:nth-of-type(odd),
.uk-offcanvas-bar.uk-light.uk-table-striped tbody tr:nth-of-type(odd) {
  background: rgba(255, 255, 255, 0.1);
  border-top-color: rgba(255, 255, 255, 0.2);
  border-bottom-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-table-hover > tr:hover,
.uk-light .uk-table-hover tbody tr:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-table-hover > tr:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-table-hover tbody tr:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-table-hover > tr:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-table-hover tbody tr:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-table-hover > tr:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-table-hover tbody tr:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-hover > tr:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-table-hover tbody tr:hover,
.uk-card-primary.uk-card-body .uk-table-hover > tr:hover,
.uk-card-primary.uk-card-body .uk-table-hover tbody tr:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-hover > tr:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-table-hover tbody tr:hover,
.uk-card-secondary.uk-card-body .uk-table-hover > tr:hover,
.uk-card-secondary.uk-card-body .uk-table-hover tbody tr:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-hover > tr:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-table-hover tbody tr:hover,
.uk-overlay-primary .uk-table-hover > tr:hover,
.uk-overlay-primary .uk-table-hover tbody tr:hover,
.uk-offcanvas-bar.uk-light.uk-table-hover > tr:hover,
.uk-offcanvas-bar.uk-light.uk-table-hover tbody tr:hover {
  background: rgba(255, 255, 255, 0.08);
}
.uk-light .uk-icon-link,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-link,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-link,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-link,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-link,
.uk-card-primary.uk-card-body .uk-icon-link,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-link,
.uk-card-secondary.uk-card-body .uk-icon-link,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-link,
.uk-overlay-primary .uk-icon-link,
.uk-offcanvas-bar.uk-light.uk-icon-link {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-icon-link:hover,
.uk-light .uk-icon-link:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-link:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-link:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-link:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-link:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-link:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-link:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-link:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-link:focus,
.uk-card-primary.uk-card-body .uk-icon-link:hover,
.uk-card-primary.uk-card-body .uk-icon-link:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-link:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-link:focus,
.uk-card-secondary.uk-card-body .uk-icon-link:hover,
.uk-card-secondary.uk-card-body .uk-icon-link:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-link:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-link:focus,
.uk-overlay-primary .uk-icon-link:hover,
.uk-overlay-primary .uk-icon-link:focus,
.uk-offcanvas-bar.uk-light.uk-icon-link:hover,
.uk-offcanvas-bar.uk-light.uk-icon-link:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-icon-link:active,
.uk-light .uk-active > .uk-icon-link,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-link:active,
.uk-section-primary:not(.uk-preserve-color) .uk-active > .uk-icon-link,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-link:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-active > .uk-icon-link,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-link:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-active > .uk-icon-link,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-link:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-active > .uk-icon-link,
.uk-card-primary.uk-card-body .uk-icon-link:active,
.uk-card-primary.uk-card-body .uk-active > .uk-icon-link,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-link:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-active > .uk-icon-link,
.uk-card-secondary.uk-card-body .uk-icon-link:active,
.uk-card-secondary.uk-card-body .uk-active > .uk-icon-link,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-link:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-active > .uk-icon-link,
.uk-overlay-primary .uk-icon-link:active,
.uk-overlay-primary .uk-active > .uk-icon-link,
.uk-offcanvas-bar.uk-light.uk-icon-link:active,
.uk-offcanvas-bar.uk-light.uk-active > .uk-icon-link {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-icon-button,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-button,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-button,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-button,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-button,
.uk-card-primary.uk-card-body .uk-icon-button,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-button,
.uk-card-secondary.uk-card-body .uk-icon-button,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-button,
.uk-overlay-primary .uk-icon-button,
.uk-offcanvas-bar.uk-light.uk-icon-button {
  background-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-icon-button:hover,
.uk-light .uk-icon-button:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-button:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-button:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-button:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-button:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-button:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-button:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-button:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-button:focus,
.uk-card-primary.uk-card-body .uk-icon-button:hover,
.uk-card-primary.uk-card-body .uk-icon-button:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-button:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-button:focus,
.uk-card-secondary.uk-card-body .uk-icon-button:hover,
.uk-card-secondary.uk-card-body .uk-icon-button:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-button:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-button:focus,
.uk-overlay-primary .uk-icon-button:hover,
.uk-overlay-primary .uk-icon-button:focus,
.uk-offcanvas-bar.uk-light.uk-icon-button:hover,
.uk-offcanvas-bar.uk-light.uk-icon-button:focus {
  background-color: rgba(242, 242, 242, 0.1);
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-icon-button:active,
.uk-section-primary:not(.uk-preserve-color) .uk-icon-button:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-icon-button:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-icon-button:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-icon-button:active,
.uk-card-primary.uk-card-body .uk-icon-button:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-icon-button:active,
.uk-card-secondary.uk-card-body .uk-icon-button:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-icon-button:active,
.uk-overlay-primary .uk-icon-button:active,
.uk-offcanvas-bar.uk-light.uk-icon-button:active {
  background-color: rgba(230, 230, 230, 0.1);
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-input,
.uk-light .uk-select,
.uk-light .uk-textarea,
.uk-section-primary:not(.uk-preserve-color) .uk-input,
.uk-section-primary:not(.uk-preserve-color) .uk-select,
.uk-section-primary:not(.uk-preserve-color) .uk-textarea,
.uk-section-secondary:not(.uk-preserve-color) .uk-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-select,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea,
.uk-tile-primary:not(.uk-preserve-color) .uk-input,
.uk-tile-primary:not(.uk-preserve-color) .uk-select,
.uk-tile-primary:not(.uk-preserve-color) .uk-textarea,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input,
.uk-tile-secondary:not(.uk-preserve-color) .uk-select,
.uk-tile-secondary:not(.uk-preserve-color) .uk-textarea,
.uk-card-primary.uk-card-body .uk-input,
.uk-card-primary.uk-card-body .uk-select,
.uk-card-primary.uk-card-body .uk-textarea,
.uk-card-primary > :not([class*='uk-card-media']) .uk-input,
.uk-card-primary > :not([class*='uk-card-media']) .uk-select,
.uk-card-primary > :not([class*='uk-card-media']) .uk-textarea,
.uk-card-secondary.uk-card-body .uk-input,
.uk-card-secondary.uk-card-body .uk-select,
.uk-card-secondary.uk-card-body .uk-textarea,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-input,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-select,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-textarea,
.uk-overlay-primary .uk-input,
.uk-overlay-primary .uk-select,
.uk-overlay-primary .uk-textarea,
.uk-offcanvas-bar.uk-light.uk-input,
.uk-offcanvas-bar.uk-light.uk-select,
.uk-offcanvas-bar.uk-light.uk-textarea {
  background-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
  background-clip: padding-box;
  border-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-input:focus,
.uk-light .uk-select:focus,
.uk-light .uk-textarea:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-input:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-select:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-textarea:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-input:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-select:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-input:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-select:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-textarea:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-select:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-textarea:focus,
.uk-card-primary.uk-card-body .uk-input:focus,
.uk-card-primary.uk-card-body .uk-select:focus,
.uk-card-primary.uk-card-body .uk-textarea:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-input:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-select:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-textarea:focus,
.uk-card-secondary.uk-card-body .uk-input:focus,
.uk-card-secondary.uk-card-body .uk-select:focus,
.uk-card-secondary.uk-card-body .uk-textarea:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-input:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-select:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-textarea:focus,
.uk-overlay-primary .uk-input:focus,
.uk-overlay-primary .uk-select:focus,
.uk-overlay-primary .uk-textarea:focus,
.uk-offcanvas-bar.uk-light.uk-input:focus,
.uk-offcanvas-bar.uk-light.uk-select:focus,
.uk-offcanvas-bar.uk-light.uk-textarea:focus {
  background-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
  border-color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-input::-ms-input-placeholder,
.uk-section-primary:not(.uk-preserve-color) .uk-input::-ms-input-placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-input::-ms-input-placeholder,
.uk-tile-primary:not(.uk-preserve-color) .uk-input::-ms-input-placeholder,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input::-ms-input-placeholder,
.uk-card-primary.uk-card-body .uk-input::-ms-input-placeholder,
.uk-card-primary > :not([class*='uk-card-media']) .uk-input::-ms-input-placeholder,
.uk-card-secondary.uk-card-body .uk-input::-ms-input-placeholder,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-input::-ms-input-placeholder,
.uk-overlay-primary .uk-input::-ms-input-placeholder,
.uk-offcanvas-bar.uk-light.uk-input::-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}
.uk-light .uk-input::placeholder,
.uk-section-primary:not(.uk-preserve-color) .uk-input::placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-input::placeholder,
.uk-tile-primary:not(.uk-preserve-color) .uk-input::placeholder,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input::placeholder,
.uk-card-primary.uk-card-body .uk-input::placeholder,
.uk-card-primary > :not([class*='uk-card-media']) .uk-input::placeholder,
.uk-card-secondary.uk-card-body .uk-input::placeholder,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-input::placeholder,
.uk-overlay-primary .uk-input::placeholder,
.uk-offcanvas-bar.uk-light.uk-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-textarea::-ms-input-placeholder,
.uk-section-primary:not(.uk-preserve-color) .uk-textarea::-ms-input-placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea::-ms-input-placeholder,
.uk-tile-primary:not(.uk-preserve-color) .uk-textarea::-ms-input-placeholder,
.uk-tile-secondary:not(.uk-preserve-color) .uk-textarea::-ms-input-placeholder,
.uk-card-primary.uk-card-body .uk-textarea::-ms-input-placeholder,
.uk-card-primary > :not([class*='uk-card-media']) .uk-textarea::-ms-input-placeholder,
.uk-card-secondary.uk-card-body .uk-textarea::-ms-input-placeholder,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-textarea::-ms-input-placeholder,
.uk-overlay-primary .uk-textarea::-ms-input-placeholder,
.uk-offcanvas-bar.uk-light.uk-textarea::-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}
.uk-light .uk-textarea::placeholder,
.uk-section-primary:not(.uk-preserve-color) .uk-textarea::placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-textarea::placeholder,
.uk-tile-primary:not(.uk-preserve-color) .uk-textarea::placeholder,
.uk-tile-secondary:not(.uk-preserve-color) .uk-textarea::placeholder,
.uk-card-primary.uk-card-body .uk-textarea::placeholder,
.uk-card-primary > :not([class*='uk-card-media']) .uk-textarea::placeholder,
.uk-card-secondary.uk-card-body .uk-textarea::placeholder,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-textarea::placeholder,
.uk-overlay-primary .uk-textarea::placeholder,
.uk-offcanvas-bar.uk-light.uk-textarea::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-select:not([multiple]):not([size]),
.uk-section-primary:not(.uk-preserve-color) .uk-select:not([multiple]):not([size]),
.uk-section-secondary:not(.uk-preserve-color) .uk-select:not([multiple]):not([size]),
.uk-tile-primary:not(.uk-preserve-color) .uk-select:not([multiple]):not([size]),
.uk-tile-secondary:not(.uk-preserve-color) .uk-select:not([multiple]):not([size]),
.uk-card-primary.uk-card-body .uk-select:not([multiple]):not([size]),
.uk-card-primary > :not([class*='uk-card-media']) .uk-select:not([multiple]):not([size]),
.uk-card-secondary.uk-card-body .uk-select:not([multiple]):not([size]),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-select:not([multiple]):not([size]),
.uk-overlay-primary .uk-select:not([multiple]):not([size]),
.uk-offcanvas-bar.uk-light.uk-select:not([multiple]):not([size]) {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20points%3D%2212%201%209%206%2015%206%22%20%2F%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20points%3D%2212%2013%209%208%2015%208%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.uk-light .uk-input[list]:hover,
.uk-light .uk-input[list]:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-input[list]:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-input[list]:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-input[list]:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-input[list]:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-input[list]:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-input[list]:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input[list]:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-input[list]:focus,
.uk-card-primary.uk-card-body .uk-input[list]:hover,
.uk-card-primary.uk-card-body .uk-input[list]:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-input[list]:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-input[list]:focus,
.uk-card-secondary.uk-card-body .uk-input[list]:hover,
.uk-card-secondary.uk-card-body .uk-input[list]:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-input[list]:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-input[list]:focus,
.uk-overlay-primary .uk-input[list]:hover,
.uk-overlay-primary .uk-input[list]:focus,
.uk-offcanvas-bar.uk-light.uk-input[list]:hover,
.uk-offcanvas-bar.uk-light.uk-input[list]:focus {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20points%3D%2212%2012%208%206%2016%206%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.uk-light .uk-radio,
.uk-light .uk-checkbox,
.uk-section-primary:not(.uk-preserve-color) .uk-radio,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox,
.uk-section-secondary:not(.uk-preserve-color) .uk-radio,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox,
.uk-tile-primary:not(.uk-preserve-color) .uk-radio,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox,
.uk-tile-secondary:not(.uk-preserve-color) .uk-radio,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox,
.uk-card-primary.uk-card-body .uk-radio,
.uk-card-primary.uk-card-body .uk-checkbox,
.uk-card-primary > :not([class*='uk-card-media']) .uk-radio,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox,
.uk-card-secondary.uk-card-body .uk-radio,
.uk-card-secondary.uk-card-body .uk-checkbox,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-radio,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox,
.uk-overlay-primary .uk-radio,
.uk-overlay-primary .uk-checkbox,
.uk-offcanvas-bar.uk-light.uk-radio,
.uk-offcanvas-bar.uk-light.uk-checkbox {
  background-color: rgba(242, 242, 242, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-radio:focus,
.uk-light .uk-checkbox:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-radio:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-radio:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-radio:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-radio:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:focus,
.uk-card-primary.uk-card-body .uk-radio:focus,
.uk-card-primary.uk-card-body .uk-checkbox:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-radio:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:focus,
.uk-card-secondary.uk-card-body .uk-radio:focus,
.uk-card-secondary.uk-card-body .uk-checkbox:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-radio:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:focus,
.uk-overlay-primary .uk-radio:focus,
.uk-overlay-primary .uk-checkbox:focus,
.uk-offcanvas-bar.uk-light.uk-radio:focus,
.uk-offcanvas-bar.uk-light.uk-checkbox:focus {
  border-color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-radio:checked,
.uk-light .uk-checkbox:checked,
.uk-light .uk-checkbox:indeterminate,
.uk-section-primary:not(.uk-preserve-color) .uk-radio:checked,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-section-secondary:not(.uk-preserve-color) .uk-radio:checked,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-tile-primary:not(.uk-preserve-color) .uk-radio:checked,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-tile-secondary:not(.uk-preserve-color) .uk-radio:checked,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-card-primary.uk-card-body .uk-radio:checked,
.uk-card-primary.uk-card-body .uk-checkbox:checked,
.uk-card-primary.uk-card-body .uk-checkbox:indeterminate,
.uk-card-primary > :not([class*='uk-card-media']) .uk-radio:checked,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:checked,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:indeterminate,
.uk-card-secondary.uk-card-body .uk-radio:checked,
.uk-card-secondary.uk-card-body .uk-checkbox:checked,
.uk-card-secondary.uk-card-body .uk-checkbox:indeterminate,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-radio:checked,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:checked,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:indeterminate,
.uk-overlay-primary .uk-radio:checked,
.uk-overlay-primary .uk-checkbox:checked,
.uk-overlay-primary .uk-checkbox:indeterminate,
.uk-offcanvas-bar.uk-light.uk-radio:checked,
.uk-offcanvas-bar.uk-light.uk-checkbox:checked,
.uk-offcanvas-bar.uk-light.uk-checkbox:indeterminate {
  background-color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-radio:checked:focus,
.uk-light .uk-checkbox:checked:focus,
.uk-light .uk-checkbox:indeterminate:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-radio:checked:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:checked:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:indeterminate:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-radio:checked:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:checked:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:indeterminate:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-radio:checked:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:checked:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:indeterminate:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-radio:checked:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:checked:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:indeterminate:focus,
.uk-card-primary.uk-card-body .uk-radio:checked:focus,
.uk-card-primary.uk-card-body .uk-checkbox:checked:focus,
.uk-card-primary.uk-card-body .uk-checkbox:indeterminate:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-radio:checked:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:checked:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:indeterminate:focus,
.uk-card-secondary.uk-card-body .uk-radio:checked:focus,
.uk-card-secondary.uk-card-body .uk-checkbox:checked:focus,
.uk-card-secondary.uk-card-body .uk-checkbox:indeterminate:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-radio:checked:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:checked:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:indeterminate:focus,
.uk-overlay-primary .uk-radio:checked:focus,
.uk-overlay-primary .uk-checkbox:checked:focus,
.uk-overlay-primary .uk-checkbox:indeterminate:focus,
.uk-offcanvas-bar.uk-light.uk-radio:checked:focus,
.uk-offcanvas-bar.uk-light.uk-checkbox:checked:focus,
.uk-offcanvas-bar.uk-light.uk-checkbox:indeterminate:focus {
  background-color: #e6e6e6;
}
.uk-light .uk-radio:checked,
.uk-section-primary:not(.uk-preserve-color) .uk-radio:checked,
.uk-section-secondary:not(.uk-preserve-color) .uk-radio:checked,
.uk-tile-primary:not(.uk-preserve-color) .uk-radio:checked,
.uk-tile-secondary:not(.uk-preserve-color) .uk-radio:checked,
.uk-card-primary.uk-card-body .uk-radio:checked,
.uk-card-primary > :not([class*='uk-card-media']) .uk-radio:checked,
.uk-card-secondary.uk-card-body .uk-radio:checked,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-radio:checked,
.uk-overlay-primary .uk-radio:checked,
.uk-offcanvas-bar.uk-light.uk-radio:checked {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Ccircle%20fill%3D%22%23666%22%20cx%3D%228%22%20cy%3D%228%22%20r%3D%222%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-light .uk-checkbox:checked,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:checked,
.uk-card-primary.uk-card-body .uk-checkbox:checked,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:checked,
.uk-card-secondary.uk-card-body .uk-checkbox:checked,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:checked,
.uk-overlay-primary .uk-checkbox:checked,
.uk-offcanvas-bar.uk-light.uk-checkbox:checked {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2211%22%20viewBox%3D%220%200%2014%2011%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%201%205%207.5%202%205%201%205.5%205%2010%2013%201.5%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");
}
.uk-light .uk-checkbox:indeterminate,
.uk-section-primary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-section-secondary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-tile-primary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-tile-secondary:not(.uk-preserve-color) .uk-checkbox:indeterminate,
.uk-card-primary.uk-card-body .uk-checkbox:indeterminate,
.uk-card-primary > :not([class*='uk-card-media']) .uk-checkbox:indeterminate,
.uk-card-secondary.uk-card-body .uk-checkbox:indeterminate,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-checkbox:indeterminate,
.uk-overlay-primary .uk-checkbox:indeterminate,
.uk-offcanvas-bar.uk-light.uk-checkbox:indeterminate {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22%23666%22%20x%3D%223%22%20y%3D%228%22%20width%3D%2210%22%20height%3D%221%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-light .uk-form-label,
.uk-section-primary:not(.uk-preserve-color) .uk-form-label,
.uk-section-secondary:not(.uk-preserve-color) .uk-form-label,
.uk-tile-primary:not(.uk-preserve-color) .uk-form-label,
.uk-tile-secondary:not(.uk-preserve-color) .uk-form-label,
.uk-card-primary.uk-card-body .uk-form-label,
.uk-card-primary > :not([class*='uk-card-media']) .uk-form-label,
.uk-card-secondary.uk-card-body .uk-form-label,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-form-label,
.uk-overlay-primary .uk-form-label,
.uk-offcanvas-bar.uk-light.uk-form-label {
  color: #fff;
}
.uk-light .uk-form-icon,
.uk-section-primary:not(.uk-preserve-color) .uk-form-icon,
.uk-section-secondary:not(.uk-preserve-color) .uk-form-icon,
.uk-tile-primary:not(.uk-preserve-color) .uk-form-icon,
.uk-tile-secondary:not(.uk-preserve-color) .uk-form-icon,
.uk-card-primary.uk-card-body .uk-form-icon,
.uk-card-primary > :not([class*='uk-card-media']) .uk-form-icon,
.uk-card-secondary.uk-card-body .uk-form-icon,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-form-icon,
.uk-overlay-primary .uk-form-icon,
.uk-offcanvas-bar.uk-light.uk-form-icon {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-form-icon:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-form-icon:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-form-icon:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-form-icon:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-form-icon:hover,
.uk-card-primary.uk-card-body .uk-form-icon:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-form-icon:hover,
.uk-card-secondary.uk-card-body .uk-form-icon:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-form-icon:hover,
.uk-overlay-primary .uk-form-icon:hover,
.uk-offcanvas-bar.uk-light.uk-form-icon:hover {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-button-default,
.uk-section-primary:not(.uk-preserve-color) .uk-button-default,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-default,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-default,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-default,
.uk-card-primary.uk-card-body .uk-button-default,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-default,
.uk-card-secondary.uk-card-body .uk-button-default,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-default,
.uk-overlay-primary .uk-button-default,
.uk-offcanvas-bar.uk-light.uk-button-default {
  background-color: transparent;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-button-default:hover,
.uk-light .uk-button-default:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-button-default:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-default:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-default:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-default:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-default:focus,
.uk-card-primary.uk-card-body .uk-button-default:hover,
.uk-card-primary.uk-card-body .uk-button-default:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-default:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-default:focus,
.uk-card-secondary.uk-card-body .uk-button-default:hover,
.uk-card-secondary.uk-card-body .uk-button-default:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-default:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-default:focus,
.uk-overlay-primary .uk-button-default:hover,
.uk-overlay-primary .uk-button-default:focus,
.uk-offcanvas-bar.uk-light.uk-button-default:hover,
.uk-offcanvas-bar.uk-light.uk-button-default:focus {
  background-color: transparent;
  color: #fff;
  border-color: #fff;
}
.uk-light .uk-button-default:active,
.uk-light .uk-button-default.uk-active,
.uk-section-primary:not(.uk-preserve-color) .uk-button-default:active,
.uk-section-primary:not(.uk-preserve-color) .uk-button-default.uk-active,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-default:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-default.uk-active,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-default:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-default.uk-active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-default:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-default.uk-active,
.uk-card-primary.uk-card-body .uk-button-default:active,
.uk-card-primary.uk-card-body .uk-button-default.uk-active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-default:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-default.uk-active,
.uk-card-secondary.uk-card-body .uk-button-default:active,
.uk-card-secondary.uk-card-body .uk-button-default.uk-active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-default:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-default.uk-active,
.uk-overlay-primary .uk-button-default:active,
.uk-overlay-primary .uk-button-default.uk-active,
.uk-offcanvas-bar.uk-light.uk-button-default:active,
.uk-offcanvas-bar.uk-light.uk-button-default.uk-active {
  background-color: transparent;
  color: #fff;
  border-color: #fff;
}
.uk-light .uk-button-primary,
.uk-section-primary:not(.uk-preserve-color) .uk-button-primary,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary,
.uk-card-primary.uk-card-body .uk-button-primary,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-primary,
.uk-card-secondary.uk-card-body .uk-button-primary,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-primary,
.uk-overlay-primary .uk-button-primary,
.uk-offcanvas-bar.uk-light.uk-button-primary {
  background-color: #fff;
  color: #666;
}
.uk-light .uk-button-primary:hover,
.uk-light .uk-button-primary:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-button-primary:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-button-primary:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary:focus,
.uk-card-primary.uk-card-body .uk-button-primary:hover,
.uk-card-primary.uk-card-body .uk-button-primary:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-primary:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-primary:focus,
.uk-card-secondary.uk-card-body .uk-button-primary:hover,
.uk-card-secondary.uk-card-body .uk-button-primary:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-primary:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-primary:focus,
.uk-overlay-primary .uk-button-primary:hover,
.uk-overlay-primary .uk-button-primary:focus,
.uk-offcanvas-bar.uk-light.uk-button-primary:hover,
.uk-offcanvas-bar.uk-light.uk-button-primary:focus {
  background-color: #f2f2f2;
  color: #666;
}
.uk-light .uk-button-primary:active,
.uk-light .uk-button-primary.uk-active,
.uk-section-primary:not(.uk-preserve-color) .uk-button-primary:active,
.uk-section-primary:not(.uk-preserve-color) .uk-button-primary.uk-active,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-primary.uk-active,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-primary.uk-active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-primary.uk-active,
.uk-card-primary.uk-card-body .uk-button-primary:active,
.uk-card-primary.uk-card-body .uk-button-primary.uk-active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-primary:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-primary.uk-active,
.uk-card-secondary.uk-card-body .uk-button-primary:active,
.uk-card-secondary.uk-card-body .uk-button-primary.uk-active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-primary:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-primary.uk-active,
.uk-overlay-primary .uk-button-primary:active,
.uk-overlay-primary .uk-button-primary.uk-active,
.uk-offcanvas-bar.uk-light.uk-button-primary:active,
.uk-offcanvas-bar.uk-light.uk-button-primary.uk-active {
  background-color: #e6e6e6;
  color: #666;
}
.uk-light .uk-button-secondary,
.uk-section-primary:not(.uk-preserve-color) .uk-button-secondary,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-secondary,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-secondary,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-secondary,
.uk-card-primary.uk-card-body .uk-button-secondary,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-secondary,
.uk-card-secondary.uk-card-body .uk-button-secondary,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-secondary,
.uk-overlay-primary .uk-button-secondary,
.uk-offcanvas-bar.uk-light.uk-button-secondary {
  background-color: #fff;
  color: #666;
}
.uk-light .uk-button-secondary:hover,
.uk-light .uk-button-secondary:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-button-secondary:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-button-secondary:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-secondary:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-secondary:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-secondary:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-secondary:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-secondary:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-secondary:focus,
.uk-card-primary.uk-card-body .uk-button-secondary:hover,
.uk-card-primary.uk-card-body .uk-button-secondary:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-secondary:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-secondary:focus,
.uk-card-secondary.uk-card-body .uk-button-secondary:hover,
.uk-card-secondary.uk-card-body .uk-button-secondary:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-secondary:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-secondary:focus,
.uk-overlay-primary .uk-button-secondary:hover,
.uk-overlay-primary .uk-button-secondary:focus,
.uk-offcanvas-bar.uk-light.uk-button-secondary:hover,
.uk-offcanvas-bar.uk-light.uk-button-secondary:focus {
  background-color: #f2f2f2;
  color: #666;
}
.uk-light .uk-button-secondary:active,
.uk-light .uk-button-secondary.uk-active,
.uk-section-primary:not(.uk-preserve-color) .uk-button-secondary:active,
.uk-section-primary:not(.uk-preserve-color) .uk-button-secondary.uk-active,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-secondary:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-secondary.uk-active,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-secondary:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-secondary.uk-active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-secondary:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-secondary.uk-active,
.uk-card-primary.uk-card-body .uk-button-secondary:active,
.uk-card-primary.uk-card-body .uk-button-secondary.uk-active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-secondary:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-secondary.uk-active,
.uk-card-secondary.uk-card-body .uk-button-secondary:active,
.uk-card-secondary.uk-card-body .uk-button-secondary.uk-active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-secondary:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-secondary.uk-active,
.uk-overlay-primary .uk-button-secondary:active,
.uk-overlay-primary .uk-button-secondary.uk-active,
.uk-offcanvas-bar.uk-light.uk-button-secondary:active,
.uk-offcanvas-bar.uk-light.uk-button-secondary.uk-active {
  background-color: #e6e6e6;
  color: #666;
}
.uk-light .uk-button-text,
.uk-section-primary:not(.uk-preserve-color) .uk-button-text,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-text,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-text,
.uk-card-primary.uk-card-body .uk-button-text,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-text,
.uk-card-secondary.uk-card-body .uk-button-text,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-text,
.uk-overlay-primary .uk-button-text,
.uk-offcanvas-bar.uk-light.uk-button-text {
  color: #fff;
}
.uk-light .uk-button-text::before,
.uk-section-primary:not(.uk-preserve-color) .uk-button-text::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-text::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-text::before,
.uk-card-primary.uk-card-body .uk-button-text::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-text::before,
.uk-card-secondary.uk-card-body .uk-button-text::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-text::before,
.uk-overlay-primary .uk-button-text::before,
.uk-offcanvas-bar.uk-light.uk-button-text::before {
  border-bottom-color: #fff;
}
.uk-light .uk-button-text:hover,
.uk-light .uk-button-text:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-button-text:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-button-text:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-text:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-text:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-text:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-text:focus,
.uk-card-primary.uk-card-body .uk-button-text:hover,
.uk-card-primary.uk-card-body .uk-button-text:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-text:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-text:focus,
.uk-card-secondary.uk-card-body .uk-button-text:hover,
.uk-card-secondary.uk-card-body .uk-button-text:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-text:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-text:focus,
.uk-overlay-primary .uk-button-text:hover,
.uk-overlay-primary .uk-button-text:focus,
.uk-offcanvas-bar.uk-light.uk-button-text:hover,
.uk-offcanvas-bar.uk-light.uk-button-text:focus {
  color: #fff;
}
.uk-light .uk-button-text:disabled,
.uk-section-primary:not(.uk-preserve-color) .uk-button-text:disabled,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-text:disabled,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-text:disabled,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-text:disabled,
.uk-card-primary.uk-card-body .uk-button-text:disabled,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-text:disabled,
.uk-card-secondary.uk-card-body .uk-button-text:disabled,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-text:disabled,
.uk-overlay-primary .uk-button-text:disabled,
.uk-offcanvas-bar.uk-light.uk-button-text:disabled {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-button-link,
.uk-section-primary:not(.uk-preserve-color) .uk-button-link,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-link,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-link,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-link,
.uk-card-primary.uk-card-body .uk-button-link,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-link,
.uk-card-secondary.uk-card-body .uk-button-link,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-link,
.uk-overlay-primary .uk-button-link,
.uk-offcanvas-bar.uk-light.uk-button-link {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-button-link:hover,
.uk-light .uk-button-link:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-button-link:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-button-link:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-link:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-button-link:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-link:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-button-link:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-link:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-button-link:focus,
.uk-card-primary.uk-card-body .uk-button-link:hover,
.uk-card-primary.uk-card-body .uk-button-link:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-link:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-button-link:focus,
.uk-card-secondary.uk-card-body .uk-button-link:hover,
.uk-card-secondary.uk-card-body .uk-button-link:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-link:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-button-link:focus,
.uk-overlay-primary .uk-button-link:hover,
.uk-overlay-primary .uk-button-link:focus,
.uk-offcanvas-bar.uk-light.uk-button-link:hover,
.uk-offcanvas-bar.uk-light.uk-button-link:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-grid-divider > :not(.uk-first-column)::before,
.uk-section-primary:not(.uk-preserve-color) .uk-grid-divider > :not(.uk-first-column)::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-grid-divider > :not(.uk-first-column)::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-grid-divider > :not(.uk-first-column)::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-grid-divider > :not(.uk-first-column)::before,
.uk-card-primary.uk-card-body .uk-grid-divider > :not(.uk-first-column)::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-grid-divider > :not(.uk-first-column)::before,
.uk-card-secondary.uk-card-body .uk-grid-divider > :not(.uk-first-column)::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-grid-divider > :not(.uk-first-column)::before,
.uk-overlay-primary .uk-grid-divider > :not(.uk-first-column)::before,
.uk-offcanvas-bar.uk-light.uk-grid-divider > :not(.uk-first-column)::before {
  border-left-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-section-primary:not(.uk-preserve-color) .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-card-primary.uk-card-body .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-card-secondary.uk-card-body .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-overlay-primary .uk-grid-divider.uk-grid-stack > .uk-grid-margin::before,
.uk-offcanvas-bar.uk-light.uk-grid-divider.uk-grid-stack > .uk-grid-margin::before {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-close,
.uk-section-primary:not(.uk-preserve-color) .uk-close,
.uk-section-secondary:not(.uk-preserve-color) .uk-close,
.uk-tile-primary:not(.uk-preserve-color) .uk-close,
.uk-tile-secondary:not(.uk-preserve-color) .uk-close,
.uk-card-primary.uk-card-body .uk-close,
.uk-card-primary > :not([class*='uk-card-media']) .uk-close,
.uk-card-secondary.uk-card-body .uk-close,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-close,
.uk-overlay-primary .uk-close,
.uk-offcanvas-bar.uk-light.uk-close {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-close:hover,
.uk-light .uk-close:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-close:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-close:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-close:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-close:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-close:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-close:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-close:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-close:focus,
.uk-card-primary.uk-card-body .uk-close:hover,
.uk-card-primary.uk-card-body .uk-close:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-close:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-close:focus,
.uk-card-secondary.uk-card-body .uk-close:hover,
.uk-card-secondary.uk-card-body .uk-close:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-close:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-close:focus,
.uk-overlay-primary .uk-close:hover,
.uk-overlay-primary .uk-close:focus,
.uk-offcanvas-bar.uk-light.uk-close:hover,
.uk-offcanvas-bar.uk-light.uk-close:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-totop,
.uk-section-primary:not(.uk-preserve-color) .uk-totop,
.uk-section-secondary:not(.uk-preserve-color) .uk-totop,
.uk-tile-primary:not(.uk-preserve-color) .uk-totop,
.uk-tile-secondary:not(.uk-preserve-color) .uk-totop,
.uk-card-primary.uk-card-body .uk-totop,
.uk-card-primary > :not([class*='uk-card-media']) .uk-totop,
.uk-card-secondary.uk-card-body .uk-totop,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-totop,
.uk-overlay-primary .uk-totop,
.uk-offcanvas-bar.uk-light.uk-totop {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-totop:hover,
.uk-light .uk-totop:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-totop:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-totop:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-totop:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-totop:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-totop:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-totop:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-totop:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-totop:focus,
.uk-card-primary.uk-card-body .uk-totop:hover,
.uk-card-primary.uk-card-body .uk-totop:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-totop:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-totop:focus,
.uk-card-secondary.uk-card-body .uk-totop:hover,
.uk-card-secondary.uk-card-body .uk-totop:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-totop:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-totop:focus,
.uk-overlay-primary .uk-totop:hover,
.uk-overlay-primary .uk-totop:focus,
.uk-offcanvas-bar.uk-light.uk-totop:hover,
.uk-offcanvas-bar.uk-light.uk-totop:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-totop:active,
.uk-section-primary:not(.uk-preserve-color) .uk-totop:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-totop:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-totop:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-totop:active,
.uk-card-primary.uk-card-body .uk-totop:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-totop:active,
.uk-card-secondary.uk-card-body .uk-totop:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-totop:active,
.uk-overlay-primary .uk-totop:active,
.uk-offcanvas-bar.uk-light.uk-totop:active {
  color: #fff;
}
.uk-light .uk-marker,
.uk-section-primary:not(.uk-preserve-color) .uk-marker,
.uk-section-secondary:not(.uk-preserve-color) .uk-marker,
.uk-tile-primary:not(.uk-preserve-color) .uk-marker,
.uk-tile-secondary:not(.uk-preserve-color) .uk-marker,
.uk-card-primary.uk-card-body .uk-marker,
.uk-card-primary > :not([class*='uk-card-media']) .uk-marker,
.uk-card-secondary.uk-card-body .uk-marker,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-marker,
.uk-overlay-primary .uk-marker,
.uk-offcanvas-bar.uk-light.uk-marker {
  background: #f8f8f8;
  color: #666;
}
.uk-light .uk-marker:hover,
.uk-light .uk-marker:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-marker:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-marker:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-marker:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-marker:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-marker:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-marker:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-marker:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-marker:focus,
.uk-card-primary.uk-card-body .uk-marker:hover,
.uk-card-primary.uk-card-body .uk-marker:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-marker:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-marker:focus,
.uk-card-secondary.uk-card-body .uk-marker:hover,
.uk-card-secondary.uk-card-body .uk-marker:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-marker:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-marker:focus,
.uk-overlay-primary .uk-marker:hover,
.uk-overlay-primary .uk-marker:focus,
.uk-offcanvas-bar.uk-light.uk-marker:hover,
.uk-offcanvas-bar.uk-light.uk-marker:focus {
  color: #666;
}
.uk-light .uk-badge,
.uk-section-primary:not(.uk-preserve-color) .uk-badge,
.uk-section-secondary:not(.uk-preserve-color) .uk-badge,
.uk-tile-primary:not(.uk-preserve-color) .uk-badge,
.uk-tile-secondary:not(.uk-preserve-color) .uk-badge,
.uk-card-primary.uk-card-body .uk-badge,
.uk-card-primary > :not([class*='uk-card-media']) .uk-badge,
.uk-card-secondary.uk-card-body .uk-badge,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-badge,
.uk-overlay-primary .uk-badge,
.uk-offcanvas-bar.uk-light.uk-badge {
  background-color: #fff;
  color: #666;
}
.uk-light .uk-badge:hover,
.uk-light .uk-badge:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-badge:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-badge:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-badge:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-badge:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-badge:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-badge:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-badge:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-badge:focus,
.uk-card-primary.uk-card-body .uk-badge:hover,
.uk-card-primary.uk-card-body .uk-badge:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-badge:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-badge:focus,
.uk-card-secondary.uk-card-body .uk-badge:hover,
.uk-card-secondary.uk-card-body .uk-badge:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-badge:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-badge:focus,
.uk-overlay-primary .uk-badge:hover,
.uk-overlay-primary .uk-badge:focus,
.uk-offcanvas-bar.uk-light.uk-badge:hover,
.uk-offcanvas-bar.uk-light.uk-badge:focus {
  color: #666;
}
.uk-light .uk-label,
.uk-section-primary:not(.uk-preserve-color) .uk-label,
.uk-section-secondary:not(.uk-preserve-color) .uk-label,
.uk-tile-primary:not(.uk-preserve-color) .uk-label,
.uk-tile-secondary:not(.uk-preserve-color) .uk-label,
.uk-card-primary.uk-card-body .uk-label,
.uk-card-primary > :not([class*='uk-card-media']) .uk-label,
.uk-card-secondary.uk-card-body .uk-label,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-label,
.uk-overlay-primary .uk-label,
.uk-offcanvas-bar.uk-light.uk-label {
  background-color: #fff;
  color: #666;
}
.uk-light .uk-article-meta,
.uk-section-primary:not(.uk-preserve-color) .uk-article-meta,
.uk-section-secondary:not(.uk-preserve-color) .uk-article-meta,
.uk-tile-primary:not(.uk-preserve-color) .uk-article-meta,
.uk-tile-secondary:not(.uk-preserve-color) .uk-article-meta,
.uk-card-primary.uk-card-body .uk-article-meta,
.uk-card-primary > :not([class*='uk-card-media']) .uk-article-meta,
.uk-card-secondary.uk-card-body .uk-article-meta,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-article-meta,
.uk-overlay-primary .uk-article-meta,
.uk-offcanvas-bar.uk-light.uk-article-meta {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-search-input,
.uk-section-primary:not(.uk-preserve-color) .uk-search-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-input,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-input,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-input,
.uk-card-primary.uk-card-body .uk-search-input,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-input,
.uk-card-secondary.uk-card-body .uk-search-input,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-input,
.uk-overlay-primary .uk-search-input,
.uk-offcanvas-bar.uk-light.uk-search-input {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-search-input:-ms-input-placeholder,
.uk-section-primary:not(.uk-preserve-color) .uk-search-input:-ms-input-placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-input:-ms-input-placeholder,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-input:-ms-input-placeholder,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-input:-ms-input-placeholder,
.uk-card-primary.uk-card-body .uk-search-input:-ms-input-placeholder,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-input:-ms-input-placeholder,
.uk-card-secondary.uk-card-body .uk-search-input:-ms-input-placeholder,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-input:-ms-input-placeholder,
.uk-overlay-primary .uk-search-input:-ms-input-placeholder,
.uk-offcanvas-bar.uk-light.uk-search-input:-ms-input-placeholder {
  color: rgba(255, 255, 255, 0.5) !important;
}
.uk-light .uk-search-input::placeholder,
.uk-section-primary:not(.uk-preserve-color) .uk-search-input::placeholder,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-input::placeholder,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-input::placeholder,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-input::placeholder,
.uk-card-primary.uk-card-body .uk-search-input::placeholder,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-input::placeholder,
.uk-card-secondary.uk-card-body .uk-search-input::placeholder,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-input::placeholder,
.uk-overlay-primary .uk-search-input::placeholder,
.uk-offcanvas-bar.uk-light.uk-search-input::placeholder {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-search .uk-search-icon,
.uk-section-primary:not(.uk-preserve-color) .uk-search .uk-search-icon,
.uk-section-secondary:not(.uk-preserve-color) .uk-search .uk-search-icon,
.uk-tile-primary:not(.uk-preserve-color) .uk-search .uk-search-icon,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search .uk-search-icon,
.uk-card-primary.uk-card-body .uk-search .uk-search-icon,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search .uk-search-icon,
.uk-card-secondary.uk-card-body .uk-search .uk-search-icon,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search .uk-search-icon,
.uk-overlay-primary .uk-search .uk-search-icon,
.uk-offcanvas-bar.uk-light.uk-search .uk-search-icon {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-search .uk-search-icon:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-search .uk-search-icon:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-search .uk-search-icon:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-search .uk-search-icon:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search .uk-search-icon:hover,
.uk-card-primary.uk-card-body .uk-search .uk-search-icon:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search .uk-search-icon:hover,
.uk-card-secondary.uk-card-body .uk-search .uk-search-icon:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search .uk-search-icon:hover,
.uk-overlay-primary .uk-search .uk-search-icon:hover,
.uk-offcanvas-bar.uk-light.uk-search .uk-search-icon:hover {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-search-default .uk-search-input,
.uk-section-primary:not(.uk-preserve-color) .uk-search-default .uk-search-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-default .uk-search-input,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-default .uk-search-input,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-default .uk-search-input,
.uk-card-primary.uk-card-body .uk-search-default .uk-search-input,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-default .uk-search-input,
.uk-card-secondary.uk-card-body .uk-search-default .uk-search-input,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-default .uk-search-input,
.uk-overlay-primary .uk-search-default .uk-search-input,
.uk-offcanvas-bar.uk-light.uk-search-default .uk-search-input {
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-search-default .uk-search-input:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-search-default .uk-search-input:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-default .uk-search-input:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-default .uk-search-input:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-default .uk-search-input:focus,
.uk-card-primary.uk-card-body .uk-search-default .uk-search-input:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-default .uk-search-input:focus,
.uk-card-secondary.uk-card-body .uk-search-default .uk-search-input:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-default .uk-search-input:focus,
.uk-overlay-primary .uk-search-default .uk-search-input:focus,
.uk-offcanvas-bar.uk-light.uk-search-default .uk-search-input:focus {
  background-color: transparent;
}
.uk-light .uk-search-navbar .uk-search-input,
.uk-section-primary:not(.uk-preserve-color) .uk-search-navbar .uk-search-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-navbar .uk-search-input,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-navbar .uk-search-input,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-navbar .uk-search-input,
.uk-card-primary.uk-card-body .uk-search-navbar .uk-search-input,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-navbar .uk-search-input,
.uk-card-secondary.uk-card-body .uk-search-navbar .uk-search-input,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-navbar .uk-search-input,
.uk-overlay-primary .uk-search-navbar .uk-search-input,
.uk-offcanvas-bar.uk-light.uk-search-navbar .uk-search-input {
  background-color: transparent;
}
.uk-light .uk-search-large .uk-search-input,
.uk-section-primary:not(.uk-preserve-color) .uk-search-large .uk-search-input,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-large .uk-search-input,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-large .uk-search-input,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-large .uk-search-input,
.uk-card-primary.uk-card-body .uk-search-large .uk-search-input,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-large .uk-search-input,
.uk-card-secondary.uk-card-body .uk-search-large .uk-search-input,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-large .uk-search-input,
.uk-overlay-primary .uk-search-large .uk-search-input,
.uk-offcanvas-bar.uk-light.uk-search-large .uk-search-input {
  background-color: transparent;
}
.uk-light .uk-search-toggle,
.uk-section-primary:not(.uk-preserve-color) .uk-search-toggle,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-toggle,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-toggle,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-toggle,
.uk-card-primary.uk-card-body .uk-search-toggle,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-toggle,
.uk-card-secondary.uk-card-body .uk-search-toggle,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-toggle,
.uk-overlay-primary .uk-search-toggle,
.uk-offcanvas-bar.uk-light.uk-search-toggle {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-search-toggle:hover,
.uk-light .uk-search-toggle:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-search-toggle:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-search-toggle:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-toggle:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-search-toggle:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-toggle:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-search-toggle:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-toggle:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-search-toggle:focus,
.uk-card-primary.uk-card-body .uk-search-toggle:hover,
.uk-card-primary.uk-card-body .uk-search-toggle:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-toggle:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-search-toggle:focus,
.uk-card-secondary.uk-card-body .uk-search-toggle:hover,
.uk-card-secondary.uk-card-body .uk-search-toggle:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-toggle:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-search-toggle:focus,
.uk-overlay-primary .uk-search-toggle:hover,
.uk-overlay-primary .uk-search-toggle:focus,
.uk-offcanvas-bar.uk-light.uk-search-toggle:hover,
.uk-offcanvas-bar.uk-light.uk-search-toggle:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-nav-parent-icon > .uk-parent > a::after,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent > a::after,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent > a::after,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent > a::after,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent > a::after,
.uk-card-primary.uk-card-body .uk-nav-parent-icon > .uk-parent > a::after,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-parent-icon > .uk-parent > a::after,
.uk-card-secondary.uk-card-body .uk-nav-parent-icon > .uk-parent > a::after,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-parent-icon > .uk-parent > a::after,
.uk-overlay-primary .uk-nav-parent-icon > .uk-parent > a::after,
.uk-offcanvas-bar.uk-light.uk-nav-parent-icon > .uk-parent > a::after {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20stroke-width%3D%221.1%22%20points%3D%2210%201%204%207%2010%2013%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-light .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-card-primary.uk-card-body .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-card-secondary.uk-card-body .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-overlay-primary .uk-nav-parent-icon > .uk-parent.uk-open > a::after,
.uk-offcanvas-bar.uk-light.uk-nav-parent-icon > .uk-parent.uk-open > a::after {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2214%22%20height%3D%2214%22%20viewBox%3D%220%200%2014%2014%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20stroke-width%3D%221.1%22%20points%3D%221%204%207%2010%2013%204%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-light .uk-nav-default > li > a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default > li > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default > li > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default > li > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default > li > a,
.uk-card-primary.uk-card-body .uk-nav-default > li > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default > li > a,
.uk-card-secondary.uk-card-body .uk-nav-default > li > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default > li > a,
.uk-overlay-primary .uk-nav-default > li > a,
.uk-offcanvas-bar.uk-light.uk-nav-default > li > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-nav-default > li > a:hover,
.uk-light .uk-nav-default > li > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default > li > a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default > li > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default > li > a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default > li > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default > li > a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default > li > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default > li > a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default > li > a:focus,
.uk-card-primary.uk-card-body .uk-nav-default > li > a:hover,
.uk-card-primary.uk-card-body .uk-nav-default > li > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default > li > a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default > li > a:focus,
.uk-card-secondary.uk-card-body .uk-nav-default > li > a:hover,
.uk-card-secondary.uk-card-body .uk-nav-default > li > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default > li > a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default > li > a:focus,
.uk-overlay-primary .uk-nav-default > li > a:hover,
.uk-overlay-primary .uk-nav-default > li > a:focus,
.uk-offcanvas-bar.uk-light.uk-nav-default > li > a:hover,
.uk-offcanvas-bar.uk-light.uk-nav-default > li > a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-nav-default > li.uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default > li.uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default > li.uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default > li.uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default > li.uk-active > a,
.uk-card-primary.uk-card-body .uk-nav-default > li.uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default > li.uk-active > a,
.uk-card-secondary.uk-card-body .uk-nav-default > li.uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default > li.uk-active > a,
.uk-overlay-primary .uk-nav-default > li.uk-active > a,
.uk-offcanvas-bar.uk-light.uk-nav-default > li.uk-active > a {
  color: #fff;
}
.uk-light .uk-nav-default .uk-nav-header,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-header,
.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-header,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-header,
.uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-header,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-header,
.uk-overlay-primary .uk-nav-default .uk-nav-header,
.uk-offcanvas-bar.uk-light.uk-nav-default .uk-nav-header {
  color: #fff;
}
.uk-light .uk-nav-default .uk-nav-divider,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-divider,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-divider,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-divider,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-divider,
.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-divider,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-divider,
.uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-divider,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-divider,
.uk-overlay-primary .uk-nav-default .uk-nav-divider,
.uk-offcanvas-bar.uk-light.uk-nav-default .uk-nav-divider {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-nav-default .uk-nav-sub a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a,
.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-sub a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub a,
.uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-sub a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub a,
.uk-overlay-primary .uk-nav-default .uk-nav-sub a,
.uk-offcanvas-bar.uk-light.uk-nav-default .uk-nav-sub a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-nav-default .uk-nav-sub a:hover,
.uk-light .uk-nav-default .uk-nav-sub a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub a:focus,
.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-sub a:hover,
.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-sub a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub a:focus,
.uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-sub a:hover,
.uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-sub a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub a:focus,
.uk-overlay-primary .uk-nav-default .uk-nav-sub a:hover,
.uk-overlay-primary .uk-nav-default .uk-nav-sub a:focus,
.uk-offcanvas-bar.uk-light.uk-nav-default .uk-nav-sub a:hover,
.uk-offcanvas-bar.uk-light.uk-nav-default .uk-nav-sub a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-card-primary.uk-card-body .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-card-secondary.uk-card-body .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-overlay-primary .uk-nav-default .uk-nav-sub li.uk-active > a,
.uk-offcanvas-bar.uk-light.uk-nav-default .uk-nav-sub li.uk-active > a {
  color: #fff;
}
.uk-light .uk-nav-primary > li > a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary > li > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary > li > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary > li > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary > li > a,
.uk-card-primary.uk-card-body .uk-nav-primary > li > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary > li > a,
.uk-card-secondary.uk-card-body .uk-nav-primary > li > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary > li > a,
.uk-overlay-primary .uk-nav-primary > li > a,
.uk-offcanvas-bar.uk-light.uk-nav-primary > li > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-nav-primary > li > a:hover,
.uk-light .uk-nav-primary > li > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary > li > a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary > li > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary > li > a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary > li > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary > li > a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary > li > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary > li > a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary > li > a:focus,
.uk-card-primary.uk-card-body .uk-nav-primary > li > a:hover,
.uk-card-primary.uk-card-body .uk-nav-primary > li > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary > li > a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary > li > a:focus,
.uk-card-secondary.uk-card-body .uk-nav-primary > li > a:hover,
.uk-card-secondary.uk-card-body .uk-nav-primary > li > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary > li > a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary > li > a:focus,
.uk-overlay-primary .uk-nav-primary > li > a:hover,
.uk-overlay-primary .uk-nav-primary > li > a:focus,
.uk-offcanvas-bar.uk-light.uk-nav-primary > li > a:hover,
.uk-offcanvas-bar.uk-light.uk-nav-primary > li > a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-nav-primary > li.uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary > li.uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary > li.uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary > li.uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary > li.uk-active > a,
.uk-card-primary.uk-card-body .uk-nav-primary > li.uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary > li.uk-active > a,
.uk-card-secondary.uk-card-body .uk-nav-primary > li.uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary > li.uk-active > a,
.uk-overlay-primary .uk-nav-primary > li.uk-active > a,
.uk-offcanvas-bar.uk-light.uk-nav-primary > li.uk-active > a {
  color: #fff;
}
.uk-light .uk-nav-primary .uk-nav-header,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-header,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-header,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-header,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-header,
.uk-card-primary.uk-card-body .uk-nav-primary .uk-nav-header,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-header,
.uk-card-secondary.uk-card-body .uk-nav-primary .uk-nav-header,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-header,
.uk-overlay-primary .uk-nav-primary .uk-nav-header,
.uk-offcanvas-bar.uk-light.uk-nav-primary .uk-nav-header {
  color: #fff;
}
.uk-light .uk-nav-primary .uk-nav-divider,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-divider,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-divider,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-divider,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-divider,
.uk-card-primary.uk-card-body .uk-nav-primary .uk-nav-divider,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-divider,
.uk-card-secondary.uk-card-body .uk-nav-primary .uk-nav-divider,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-divider,
.uk-overlay-primary .uk-nav-primary .uk-nav-divider,
.uk-offcanvas-bar.uk-light.uk-nav-primary .uk-nav-divider {
  border-top-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-nav-primary .uk-nav-sub a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a,
.uk-card-primary.uk-card-body .uk-nav-primary .uk-nav-sub a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub a,
.uk-card-secondary.uk-card-body .uk-nav-primary .uk-nav-sub a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub a,
.uk-overlay-primary .uk-nav-primary .uk-nav-sub a,
.uk-offcanvas-bar.uk-light.uk-nav-primary .uk-nav-sub a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-nav-primary .uk-nav-sub a:hover,
.uk-light .uk-nav-primary .uk-nav-sub a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub a:focus,
.uk-card-primary.uk-card-body .uk-nav-primary .uk-nav-sub a:hover,
.uk-card-primary.uk-card-body .uk-nav-primary .uk-nav-sub a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub a:focus,
.uk-card-secondary.uk-card-body .uk-nav-primary .uk-nav-sub a:hover,
.uk-card-secondary.uk-card-body .uk-nav-primary .uk-nav-sub a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub a:focus,
.uk-overlay-primary .uk-nav-primary .uk-nav-sub a:hover,
.uk-overlay-primary .uk-nav-primary .uk-nav-sub a:focus,
.uk-offcanvas-bar.uk-light.uk-nav-primary .uk-nav-sub a:hover,
.uk-offcanvas-bar.uk-light.uk-nav-primary .uk-nav-sub a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-card-primary.uk-card-body .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-card-secondary.uk-card-body .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-overlay-primary .uk-nav-primary .uk-nav-sub li.uk-active > a,
.uk-offcanvas-bar.uk-light.uk-nav-primary .uk-nav-sub li.uk-active > a {
  color: #fff;
}
.uk-light .uk-navbar-nav > li > a,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a,
.uk-card-primary.uk-card-body .uk-navbar-nav > li > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a,
.uk-card-secondary.uk-card-body .uk-navbar-nav > li > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a,
.uk-overlay-primary .uk-navbar-nav > li > a,
.uk-offcanvas-bar.uk-light.uk-navbar-nav > li > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-navbar-nav > li:hover > a,
.uk-light .uk-navbar-nav > li > a:focus,
.uk-light .uk-navbar-nav > li > a.uk-open,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav > li:hover > a,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a.uk-open,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li:hover > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a.uk-open,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav > li:hover > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a.uk-open,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav > li:hover > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a.uk-open,
.uk-card-primary.uk-card-body .uk-navbar-nav > li:hover > a,
.uk-card-primary.uk-card-body .uk-navbar-nav > li > a:focus,
.uk-card-primary.uk-card-body .uk-navbar-nav > li > a.uk-open,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-nav > li:hover > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a.uk-open,
.uk-card-secondary.uk-card-body .uk-navbar-nav > li:hover > a,
.uk-card-secondary.uk-card-body .uk-navbar-nav > li > a:focus,
.uk-card-secondary.uk-card-body .uk-navbar-nav > li > a.uk-open,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-nav > li:hover > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a.uk-open,
.uk-overlay-primary .uk-navbar-nav > li:hover > a,
.uk-overlay-primary .uk-navbar-nav > li > a:focus,
.uk-overlay-primary .uk-navbar-nav > li > a.uk-open,
.uk-offcanvas-bar.uk-light.uk-navbar-nav > li:hover > a,
.uk-offcanvas-bar.uk-light.uk-navbar-nav > li > a:focus,
.uk-offcanvas-bar.uk-light.uk-navbar-nav > li > a.uk-open {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-navbar-nav > li > a:active,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav > li > a:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav > li > a:active,
.uk-card-primary.uk-card-body .uk-navbar-nav > li > a:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a:active,
.uk-card-secondary.uk-card-body .uk-navbar-nav > li > a:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-nav > li > a:active,
.uk-overlay-primary .uk-navbar-nav > li > a:active,
.uk-offcanvas-bar.uk-light.uk-navbar-nav > li > a:active {
  color: #fff;
}
.uk-light .uk-navbar-nav > li.uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-nav > li.uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-nav > li.uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-nav > li.uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-nav > li.uk-active > a,
.uk-card-primary.uk-card-body .uk-navbar-nav > li.uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-nav > li.uk-active > a,
.uk-card-secondary.uk-card-body .uk-navbar-nav > li.uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-nav > li.uk-active > a,
.uk-overlay-primary .uk-navbar-nav > li.uk-active > a,
.uk-offcanvas-bar.uk-light.uk-navbar-nav > li.uk-active > a {
  color: #fff;
}
.uk-light .uk-navbar-item,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-item,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-item,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-item,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-item,
.uk-card-primary.uk-card-body .uk-navbar-item,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-item,
.uk-card-secondary.uk-card-body .uk-navbar-item,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-item,
.uk-overlay-primary .uk-navbar-item,
.uk-offcanvas-bar.uk-light.uk-navbar-item {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-navbar-toggle,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-toggle,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-toggle,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-toggle,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-toggle,
.uk-card-primary.uk-card-body .uk-navbar-toggle,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-toggle,
.uk-card-secondary.uk-card-body .uk-navbar-toggle,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-toggle,
.uk-overlay-primary .uk-navbar-toggle,
.uk-offcanvas-bar.uk-light.uk-navbar-toggle {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-navbar-toggle:hover,
.uk-light .uk-navbar-toggle:focus,
.uk-light .uk-navbar-toggle.uk-open,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-toggle:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-toggle:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-navbar-toggle.uk-open,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-toggle:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-toggle:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-navbar-toggle.uk-open,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-toggle:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-toggle:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-navbar-toggle.uk-open,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-toggle:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-toggle:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-navbar-toggle.uk-open,
.uk-card-primary.uk-card-body .uk-navbar-toggle:hover,
.uk-card-primary.uk-card-body .uk-navbar-toggle:focus,
.uk-card-primary.uk-card-body .uk-navbar-toggle.uk-open,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-toggle:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-toggle:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-navbar-toggle.uk-open,
.uk-card-secondary.uk-card-body .uk-navbar-toggle:hover,
.uk-card-secondary.uk-card-body .uk-navbar-toggle:focus,
.uk-card-secondary.uk-card-body .uk-navbar-toggle.uk-open,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-toggle:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-toggle:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-navbar-toggle.uk-open,
.uk-overlay-primary .uk-navbar-toggle:hover,
.uk-overlay-primary .uk-navbar-toggle:focus,
.uk-overlay-primary .uk-navbar-toggle.uk-open,
.uk-offcanvas-bar.uk-light.uk-navbar-toggle:hover,
.uk-offcanvas-bar.uk-light.uk-navbar-toggle:focus,
.uk-offcanvas-bar.uk-light.uk-navbar-toggle.uk-open {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-subnav > * > :first-child,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > * > :first-child,
.uk-card-primary.uk-card-body .uk-subnav > * > :first-child,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav > * > :first-child,
.uk-card-secondary.uk-card-body .uk-subnav > * > :first-child,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav > * > :first-child,
.uk-overlay-primary .uk-subnav > * > :first-child,
.uk-offcanvas-bar.uk-light.uk-subnav > * > :first-child {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-subnav > * > a:hover,
.uk-light .uk-subnav > * > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav > * > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav > * > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav > * > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > * > a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > * > a:focus,
.uk-card-primary.uk-card-body .uk-subnav > * > a:hover,
.uk-card-primary.uk-card-body .uk-subnav > * > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav > * > a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav > * > a:focus,
.uk-card-secondary.uk-card-body .uk-subnav > * > a:hover,
.uk-card-secondary.uk-card-body .uk-subnav > * > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav > * > a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav > * > a:focus,
.uk-overlay-primary .uk-subnav > * > a:hover,
.uk-overlay-primary .uk-subnav > * > a:focus,
.uk-offcanvas-bar.uk-light.uk-subnav > * > a:hover,
.uk-offcanvas-bar.uk-light.uk-subnav > * > a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-subnav > .uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav > .uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav > .uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav > .uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > .uk-active > a,
.uk-card-primary.uk-card-body .uk-subnav > .uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav > .uk-active > a,
.uk-card-secondary.uk-card-body .uk-subnav > .uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav > .uk-active > a,
.uk-overlay-primary .uk-subnav > .uk-active > a,
.uk-offcanvas-bar.uk-light.uk-subnav > .uk-active > a {
  color: #fff;
}
.uk-light .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-primary.uk-card-body .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-secondary.uk-card-body .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-overlay-primary .uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before,
.uk-offcanvas-bar.uk-light.uk-subnav-divider > :nth-child(n+2):not(.uk-first-column)::before {
  border-left-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-subnav-pill > * > :first-child,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav-pill > * > :first-child,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > :first-child,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav-pill > * > :first-child,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > :first-child,
.uk-card-primary.uk-card-body .uk-subnav-pill > * > :first-child,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav-pill > * > :first-child,
.uk-card-secondary.uk-card-body .uk-subnav-pill > * > :first-child,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav-pill > * > :first-child,
.uk-overlay-primary .uk-subnav-pill > * > :first-child,
.uk-offcanvas-bar.uk-light.uk-subnav-pill > * > :first-child {
  background-color: transparent;
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-subnav-pill > * > a:hover,
.uk-light .uk-subnav-pill > * > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav-pill > * > a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav-pill > * > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav-pill > * > a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav-pill > * > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > a:focus,
.uk-card-primary.uk-card-body .uk-subnav-pill > * > a:hover,
.uk-card-primary.uk-card-body .uk-subnav-pill > * > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav-pill > * > a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav-pill > * > a:focus,
.uk-card-secondary.uk-card-body .uk-subnav-pill > * > a:hover,
.uk-card-secondary.uk-card-body .uk-subnav-pill > * > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav-pill > * > a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav-pill > * > a:focus,
.uk-overlay-primary .uk-subnav-pill > * > a:hover,
.uk-overlay-primary .uk-subnav-pill > * > a:focus,
.uk-offcanvas-bar.uk-light.uk-subnav-pill > * > a:hover,
.uk-offcanvas-bar.uk-light.uk-subnav-pill > * > a:focus {
  background-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-subnav-pill > * > a:active,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav-pill > * > a:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > a:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav-pill > * > a:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav-pill > * > a:active,
.uk-card-primary.uk-card-body .uk-subnav-pill > * > a:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav-pill > * > a:active,
.uk-card-secondary.uk-card-body .uk-subnav-pill > * > a:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav-pill > * > a:active,
.uk-overlay-primary .uk-subnav-pill > * > a:active,
.uk-offcanvas-bar.uk-light.uk-subnav-pill > * > a:active {
  background-color: rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-subnav-pill > .uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav-pill > .uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav-pill > .uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav-pill > .uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav-pill > .uk-active > a,
.uk-card-primary.uk-card-body .uk-subnav-pill > .uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav-pill > .uk-active > a,
.uk-card-secondary.uk-card-body .uk-subnav-pill > .uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav-pill > .uk-active > a,
.uk-overlay-primary .uk-subnav-pill > .uk-active > a,
.uk-offcanvas-bar.uk-light.uk-subnav-pill > .uk-active > a {
  background-color: #fff;
  color: #666;
}
.uk-light .uk-subnav > .uk-disabled > a,
.uk-section-primary:not(.uk-preserve-color) .uk-subnav > .uk-disabled > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-subnav > .uk-disabled > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-subnav > .uk-disabled > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-subnav > .uk-disabled > a,
.uk-card-primary.uk-card-body .uk-subnav > .uk-disabled > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-subnav > .uk-disabled > a,
.uk-card-secondary.uk-card-body .uk-subnav > .uk-disabled > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-subnav > .uk-disabled > a,
.uk-overlay-primary .uk-subnav > .uk-disabled > a,
.uk-offcanvas-bar.uk-light.uk-subnav > .uk-disabled > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-breadcrumb > * > *,
.uk-section-primary:not(.uk-preserve-color) .uk-breadcrumb > * > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-breadcrumb > * > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-breadcrumb > * > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-breadcrumb > * > *,
.uk-card-primary.uk-card-body .uk-breadcrumb > * > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-breadcrumb > * > *,
.uk-card-secondary.uk-card-body .uk-breadcrumb > * > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-breadcrumb > * > *,
.uk-overlay-primary .uk-breadcrumb > * > *,
.uk-offcanvas-bar.uk-light.uk-breadcrumb > * > * {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-breadcrumb > * > :hover,
.uk-light .uk-breadcrumb > * > :focus,
.uk-section-primary:not(.uk-preserve-color) .uk-breadcrumb > * > :hover,
.uk-section-primary:not(.uk-preserve-color) .uk-breadcrumb > * > :focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-breadcrumb > * > :hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-breadcrumb > * > :focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-breadcrumb > * > :hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-breadcrumb > * > :focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-breadcrumb > * > :hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-breadcrumb > * > :focus,
.uk-card-primary.uk-card-body .uk-breadcrumb > * > :hover,
.uk-card-primary.uk-card-body .uk-breadcrumb > * > :focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-breadcrumb > * > :hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-breadcrumb > * > :focus,
.uk-card-secondary.uk-card-body .uk-breadcrumb > * > :hover,
.uk-card-secondary.uk-card-body .uk-breadcrumb > * > :focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-breadcrumb > * > :hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-breadcrumb > * > :focus,
.uk-overlay-primary .uk-breadcrumb > * > :hover,
.uk-overlay-primary .uk-breadcrumb > * > :focus,
.uk-offcanvas-bar.uk-light.uk-breadcrumb > * > :hover,
.uk-offcanvas-bar.uk-light.uk-breadcrumb > * > :focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-breadcrumb > :last-child > *,
.uk-section-primary:not(.uk-preserve-color) .uk-breadcrumb > :last-child > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-breadcrumb > :last-child > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-breadcrumb > :last-child > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-breadcrumb > :last-child > *,
.uk-card-primary.uk-card-body .uk-breadcrumb > :last-child > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-breadcrumb > :last-child > *,
.uk-card-secondary.uk-card-body .uk-breadcrumb > :last-child > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-breadcrumb > :last-child > *,
.uk-overlay-primary .uk-breadcrumb > :last-child > *,
.uk-offcanvas-bar.uk-light.uk-breadcrumb > :last-child > * {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-section-primary:not(.uk-preserve-color) .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-primary.uk-card-body .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-secondary.uk-card-body .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-overlay-primary .uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before,
.uk-offcanvas-bar.uk-light.uk-breadcrumb > :nth-child(n+2):not(.uk-first-column)::before {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-pagination > * > *,
.uk-section-primary:not(.uk-preserve-color) .uk-pagination > * > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-pagination > * > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-pagination > * > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-pagination > * > *,
.uk-card-primary.uk-card-body .uk-pagination > * > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-pagination > * > *,
.uk-card-secondary.uk-card-body .uk-pagination > * > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-pagination > * > *,
.uk-overlay-primary .uk-pagination > * > *,
.uk-offcanvas-bar.uk-light.uk-pagination > * > * {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-pagination > * > :hover,
.uk-light .uk-pagination > * > :focus,
.uk-section-primary:not(.uk-preserve-color) .uk-pagination > * > :hover,
.uk-section-primary:not(.uk-preserve-color) .uk-pagination > * > :focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-pagination > * > :hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-pagination > * > :focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-pagination > * > :hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-pagination > * > :focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-pagination > * > :hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-pagination > * > :focus,
.uk-card-primary.uk-card-body .uk-pagination > * > :hover,
.uk-card-primary.uk-card-body .uk-pagination > * > :focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-pagination > * > :hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-pagination > * > :focus,
.uk-card-secondary.uk-card-body .uk-pagination > * > :hover,
.uk-card-secondary.uk-card-body .uk-pagination > * > :focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-pagination > * > :hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-pagination > * > :focus,
.uk-overlay-primary .uk-pagination > * > :hover,
.uk-overlay-primary .uk-pagination > * > :focus,
.uk-offcanvas-bar.uk-light.uk-pagination > * > :hover,
.uk-offcanvas-bar.uk-light.uk-pagination > * > :focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-pagination > .uk-active > *,
.uk-section-primary:not(.uk-preserve-color) .uk-pagination > .uk-active > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-pagination > .uk-active > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-pagination > .uk-active > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-pagination > .uk-active > *,
.uk-card-primary.uk-card-body .uk-pagination > .uk-active > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-pagination > .uk-active > *,
.uk-card-secondary.uk-card-body .uk-pagination > .uk-active > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-pagination > .uk-active > *,
.uk-overlay-primary .uk-pagination > .uk-active > *,
.uk-offcanvas-bar.uk-light.uk-pagination > .uk-active > * {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-pagination > .uk-disabled > *,
.uk-section-primary:not(.uk-preserve-color) .uk-pagination > .uk-disabled > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-pagination > .uk-disabled > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-pagination > .uk-disabled > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-pagination > .uk-disabled > *,
.uk-card-primary.uk-card-body .uk-pagination > .uk-disabled > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-pagination > .uk-disabled > *,
.uk-card-secondary.uk-card-body .uk-pagination > .uk-disabled > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-pagination > .uk-disabled > *,
.uk-overlay-primary .uk-pagination > .uk-disabled > *,
.uk-offcanvas-bar.uk-light.uk-pagination > .uk-disabled > * {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-tab::before,
.uk-section-primary:not(.uk-preserve-color) .uk-tab::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-tab::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-tab::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-tab::before,
.uk-card-primary.uk-card-body .uk-tab::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-tab::before,
.uk-card-secondary.uk-card-body .uk-tab::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-tab::before,
.uk-overlay-primary .uk-tab::before,
.uk-offcanvas-bar.uk-light.uk-tab::before {
  border-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-tab > * > a,
.uk-section-primary:not(.uk-preserve-color) .uk-tab > * > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-tab > * > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-tab > * > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-tab > * > a,
.uk-card-primary.uk-card-body .uk-tab > * > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-tab > * > a,
.uk-card-secondary.uk-card-body .uk-tab > * > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-tab > * > a,
.uk-overlay-primary .uk-tab > * > a,
.uk-offcanvas-bar.uk-light.uk-tab > * > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-tab > * > a:hover,
.uk-light .uk-tab > * > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-tab > * > a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-tab > * > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-tab > * > a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-tab > * > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-tab > * > a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-tab > * > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-tab > * > a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-tab > * > a:focus,
.uk-card-primary.uk-card-body .uk-tab > * > a:hover,
.uk-card-primary.uk-card-body .uk-tab > * > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-tab > * > a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-tab > * > a:focus,
.uk-card-secondary.uk-card-body .uk-tab > * > a:hover,
.uk-card-secondary.uk-card-body .uk-tab > * > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-tab > * > a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-tab > * > a:focus,
.uk-overlay-primary .uk-tab > * > a:hover,
.uk-overlay-primary .uk-tab > * > a:focus,
.uk-offcanvas-bar.uk-light.uk-tab > * > a:hover,
.uk-offcanvas-bar.uk-light.uk-tab > * > a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-tab > .uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-tab > .uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-tab > .uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-tab > .uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-tab > .uk-active > a,
.uk-card-primary.uk-card-body .uk-tab > .uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-tab > .uk-active > a,
.uk-card-secondary.uk-card-body .uk-tab > .uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-tab > .uk-active > a,
.uk-overlay-primary .uk-tab > .uk-active > a,
.uk-offcanvas-bar.uk-light.uk-tab > .uk-active > a {
  color: #fff;
  border-color: #fff;
}
.uk-light .uk-tab > .uk-disabled > a,
.uk-section-primary:not(.uk-preserve-color) .uk-tab > .uk-disabled > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-tab > .uk-disabled > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-tab > .uk-disabled > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-tab > .uk-disabled > a,
.uk-card-primary.uk-card-body .uk-tab > .uk-disabled > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-tab > .uk-disabled > a,
.uk-card-secondary.uk-card-body .uk-tab > .uk-disabled > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-tab > .uk-disabled > a,
.uk-overlay-primary .uk-tab > .uk-disabled > a,
.uk-offcanvas-bar.uk-light.uk-tab > .uk-disabled > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-slidenav,
.uk-section-primary:not(.uk-preserve-color) .uk-slidenav,
.uk-section-secondary:not(.uk-preserve-color) .uk-slidenav,
.uk-tile-primary:not(.uk-preserve-color) .uk-slidenav,
.uk-tile-secondary:not(.uk-preserve-color) .uk-slidenav,
.uk-card-primary.uk-card-body .uk-slidenav,
.uk-card-primary > :not([class*='uk-card-media']) .uk-slidenav,
.uk-card-secondary.uk-card-body .uk-slidenav,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-slidenav,
.uk-overlay-primary .uk-slidenav,
.uk-offcanvas-bar.uk-light.uk-slidenav {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-slidenav:hover,
.uk-light .uk-slidenav:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-slidenav:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-slidenav:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-slidenav:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-slidenav:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-slidenav:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-slidenav:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-slidenav:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-slidenav:focus,
.uk-card-primary.uk-card-body .uk-slidenav:hover,
.uk-card-primary.uk-card-body .uk-slidenav:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-slidenav:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-slidenav:focus,
.uk-card-secondary.uk-card-body .uk-slidenav:hover,
.uk-card-secondary.uk-card-body .uk-slidenav:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-slidenav:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-slidenav:focus,
.uk-overlay-primary .uk-slidenav:hover,
.uk-overlay-primary .uk-slidenav:focus,
.uk-offcanvas-bar.uk-light.uk-slidenav:hover,
.uk-offcanvas-bar.uk-light.uk-slidenav:focus {
  color: rgba(255, 255, 255, 0.95);
}
.uk-light .uk-slidenav:active,
.uk-section-primary:not(.uk-preserve-color) .uk-slidenav:active,
.uk-section-secondary:not(.uk-preserve-color) .uk-slidenav:active,
.uk-tile-primary:not(.uk-preserve-color) .uk-slidenav:active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-slidenav:active,
.uk-card-primary.uk-card-body .uk-slidenav:active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-slidenav:active,
.uk-card-secondary.uk-card-body .uk-slidenav:active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-slidenav:active,
.uk-overlay-primary .uk-slidenav:active,
.uk-offcanvas-bar.uk-light.uk-slidenav:active {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-dotnav > * > *,
.uk-section-primary:not(.uk-preserve-color) .uk-dotnav > * > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-dotnav > * > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-dotnav > * > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-dotnav > * > *,
.uk-card-primary.uk-card-body .uk-dotnav > * > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-dotnav > * > *,
.uk-card-secondary.uk-card-body .uk-dotnav > * > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-dotnav > * > *,
.uk-overlay-primary .uk-dotnav > * > *,
.uk-offcanvas-bar.uk-light.uk-dotnav > * > * {
  background-color: transparent;
  border-color: rgba(255, 255, 255, 0.9);
}
.uk-light .uk-dotnav > * > :hover,
.uk-light .uk-dotnav > * > :focus,
.uk-section-primary:not(.uk-preserve-color) .uk-dotnav > * > :hover,
.uk-section-primary:not(.uk-preserve-color) .uk-dotnav > * > :focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-dotnav > * > :hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-dotnav > * > :focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-dotnav > * > :hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-dotnav > * > :focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-dotnav > * > :hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-dotnav > * > :focus,
.uk-card-primary.uk-card-body .uk-dotnav > * > :hover,
.uk-card-primary.uk-card-body .uk-dotnav > * > :focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-dotnav > * > :hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-dotnav > * > :focus,
.uk-card-secondary.uk-card-body .uk-dotnav > * > :hover,
.uk-card-secondary.uk-card-body .uk-dotnav > * > :focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-dotnav > * > :hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-dotnav > * > :focus,
.uk-overlay-primary .uk-dotnav > * > :hover,
.uk-overlay-primary .uk-dotnav > * > :focus,
.uk-offcanvas-bar.uk-light.uk-dotnav > * > :hover,
.uk-offcanvas-bar.uk-light.uk-dotnav > * > :focus {
  background-color: rgba(255, 255, 255, 0.9);
  border-color: transparent;
}
.uk-light .uk-dotnav > * > :active,
.uk-section-primary:not(.uk-preserve-color) .uk-dotnav > * > :active,
.uk-section-secondary:not(.uk-preserve-color) .uk-dotnav > * > :active,
.uk-tile-primary:not(.uk-preserve-color) .uk-dotnav > * > :active,
.uk-tile-secondary:not(.uk-preserve-color) .uk-dotnav > * > :active,
.uk-card-primary.uk-card-body .uk-dotnav > * > :active,
.uk-card-primary > :not([class*='uk-card-media']) .uk-dotnav > * > :active,
.uk-card-secondary.uk-card-body .uk-dotnav > * > :active,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-dotnav > * > :active,
.uk-overlay-primary .uk-dotnav > * > :active,
.uk-offcanvas-bar.uk-light.uk-dotnav > * > :active {
  background-color: rgba(255, 255, 255, 0.5);
  border-color: transparent;
}
.uk-light .uk-dotnav > .uk-active > *,
.uk-section-primary:not(.uk-preserve-color) .uk-dotnav > .uk-active > *,
.uk-section-secondary:not(.uk-preserve-color) .uk-dotnav > .uk-active > *,
.uk-tile-primary:not(.uk-preserve-color) .uk-dotnav > .uk-active > *,
.uk-tile-secondary:not(.uk-preserve-color) .uk-dotnav > .uk-active > *,
.uk-card-primary.uk-card-body .uk-dotnav > .uk-active > *,
.uk-card-primary > :not([class*='uk-card-media']) .uk-dotnav > .uk-active > *,
.uk-card-secondary.uk-card-body .uk-dotnav > .uk-active > *,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-dotnav > .uk-active > *,
.uk-overlay-primary .uk-dotnav > .uk-active > *,
.uk-offcanvas-bar.uk-light.uk-dotnav > .uk-active > * {
  background-color: rgba(255, 255, 255, 0.9);
  border-color: transparent;
}
.uk-light .uk-accordion-title,
.uk-section-primary:not(.uk-preserve-color) .uk-accordion-title,
.uk-section-secondary:not(.uk-preserve-color) .uk-accordion-title,
.uk-tile-primary:not(.uk-preserve-color) .uk-accordion-title,
.uk-tile-secondary:not(.uk-preserve-color) .uk-accordion-title,
.uk-card-primary.uk-card-body .uk-accordion-title,
.uk-card-primary > :not([class*='uk-card-media']) .uk-accordion-title,
.uk-card-secondary.uk-card-body .uk-accordion-title,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-accordion-title,
.uk-overlay-primary .uk-accordion-title,
.uk-offcanvas-bar.uk-light.uk-accordion-title {
  color: #fff;
}
.uk-light .uk-accordion-title:hover,
.uk-light .uk-accordion-title:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-accordion-title:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-accordion-title:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-accordion-title:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-accordion-title:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-accordion-title:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-accordion-title:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-accordion-title:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-accordion-title:focus,
.uk-card-primary.uk-card-body .uk-accordion-title:hover,
.uk-card-primary.uk-card-body .uk-accordion-title:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-accordion-title:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-accordion-title:focus,
.uk-card-secondary.uk-card-body .uk-accordion-title:hover,
.uk-card-secondary.uk-card-body .uk-accordion-title:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-accordion-title:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-accordion-title:focus,
.uk-overlay-primary .uk-accordion-title:hover,
.uk-overlay-primary .uk-accordion-title:focus,
.uk-offcanvas-bar.uk-light.uk-accordion-title:hover,
.uk-offcanvas-bar.uk-light.uk-accordion-title:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-iconnav > * > a,
.uk-section-primary:not(.uk-preserve-color) .uk-iconnav > * > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-iconnav > * > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-iconnav > * > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-iconnav > * > a,
.uk-card-primary.uk-card-body .uk-iconnav > * > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-iconnav > * > a,
.uk-card-secondary.uk-card-body .uk-iconnav > * > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-iconnav > * > a,
.uk-overlay-primary .uk-iconnav > * > a,
.uk-offcanvas-bar.uk-light.uk-iconnav > * > a {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-iconnav > * > a:hover,
.uk-light .uk-iconnav > * > a:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-iconnav > * > a:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-iconnav > * > a:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-iconnav > * > a:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-iconnav > * > a:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-iconnav > * > a:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-iconnav > * > a:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-iconnav > * > a:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-iconnav > * > a:focus,
.uk-card-primary.uk-card-body .uk-iconnav > * > a:hover,
.uk-card-primary.uk-card-body .uk-iconnav > * > a:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-iconnav > * > a:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-iconnav > * > a:focus,
.uk-card-secondary.uk-card-body .uk-iconnav > * > a:hover,
.uk-card-secondary.uk-card-body .uk-iconnav > * > a:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-iconnav > * > a:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-iconnav > * > a:focus,
.uk-overlay-primary .uk-iconnav > * > a:hover,
.uk-overlay-primary .uk-iconnav > * > a:focus,
.uk-offcanvas-bar.uk-light.uk-iconnav > * > a:hover,
.uk-offcanvas-bar.uk-light.uk-iconnav > * > a:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-iconnav > .uk-active > a,
.uk-section-primary:not(.uk-preserve-color) .uk-iconnav > .uk-active > a,
.uk-section-secondary:not(.uk-preserve-color) .uk-iconnav > .uk-active > a,
.uk-tile-primary:not(.uk-preserve-color) .uk-iconnav > .uk-active > a,
.uk-tile-secondary:not(.uk-preserve-color) .uk-iconnav > .uk-active > a,
.uk-card-primary.uk-card-body .uk-iconnav > .uk-active > a,
.uk-card-primary > :not([class*='uk-card-media']) .uk-iconnav > .uk-active > a,
.uk-card-secondary.uk-card-body .uk-iconnav > .uk-active > a,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-iconnav > .uk-active > a,
.uk-overlay-primary .uk-iconnav > .uk-active > a,
.uk-offcanvas-bar.uk-light.uk-iconnav > .uk-active > a {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-text-lead,
.uk-section-primary:not(.uk-preserve-color) .uk-text-lead,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-lead,
.uk-tile-primary:not(.uk-preserve-color) .uk-text-lead,
.uk-tile-secondary:not(.uk-preserve-color) .uk-text-lead,
.uk-card-primary.uk-card-body .uk-text-lead,
.uk-card-primary > :not([class*='uk-card-media']) .uk-text-lead,
.uk-card-secondary.uk-card-body .uk-text-lead,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-text-lead,
.uk-overlay-primary .uk-text-lead,
.uk-offcanvas-bar.uk-light.uk-text-lead {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-text-meta,
.uk-section-primary:not(.uk-preserve-color) .uk-text-meta,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-meta,
.uk-tile-primary:not(.uk-preserve-color) .uk-text-meta,
.uk-tile-secondary:not(.uk-preserve-color) .uk-text-meta,
.uk-card-primary.uk-card-body .uk-text-meta,
.uk-card-primary > :not([class*='uk-card-media']) .uk-text-meta,
.uk-card-secondary.uk-card-body .uk-text-meta,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-text-meta,
.uk-overlay-primary .uk-text-meta,
.uk-offcanvas-bar.uk-light.uk-text-meta {
  color: rgba(255, 255, 255, 0.5);
}
.uk-light .uk-text-muted,
.uk-section-primary:not(.uk-preserve-color) .uk-text-muted,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-muted,
.uk-tile-primary:not(.uk-preserve-color) .uk-text-muted,
.uk-tile-secondary:not(.uk-preserve-color) .uk-text-muted,
.uk-card-primary.uk-card-body .uk-text-muted,
.uk-card-primary > :not([class*='uk-card-media']) .uk-text-muted,
.uk-card-secondary.uk-card-body .uk-text-muted,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-text-muted,
.uk-overlay-primary .uk-text-muted,
.uk-offcanvas-bar.uk-light.uk-text-muted {
  color: rgba(255, 255, 255, 0.5) !important;
}
.uk-light .uk-text-emphasis,
.uk-section-primary:not(.uk-preserve-color) .uk-text-emphasis,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-emphasis,
.uk-tile-primary:not(.uk-preserve-color) .uk-text-emphasis,
.uk-tile-secondary:not(.uk-preserve-color) .uk-text-emphasis,
.uk-card-primary.uk-card-body .uk-text-emphasis,
.uk-card-primary > :not([class*='uk-card-media']) .uk-text-emphasis,
.uk-card-secondary.uk-card-body .uk-text-emphasis,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-text-emphasis,
.uk-overlay-primary .uk-text-emphasis,
.uk-offcanvas-bar.uk-light.uk-text-emphasis {
  color: #fff !important;
}
.uk-light .uk-text-primary,
.uk-section-primary:not(.uk-preserve-color) .uk-text-primary,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-primary,
.uk-tile-primary:not(.uk-preserve-color) .uk-text-primary,
.uk-tile-secondary:not(.uk-preserve-color) .uk-text-primary,
.uk-card-primary.uk-card-body .uk-text-primary,
.uk-card-primary > :not([class*='uk-card-media']) .uk-text-primary,
.uk-card-secondary.uk-card-body .uk-text-primary,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-text-primary,
.uk-overlay-primary .uk-text-primary,
.uk-offcanvas-bar.uk-light.uk-text-primary {
  color: #fff !important;
}
.uk-light .uk-text-secondary,
.uk-section-primary:not(.uk-preserve-color) .uk-text-secondary,
.uk-section-secondary:not(.uk-preserve-color) .uk-text-secondary,
.uk-tile-primary:not(.uk-preserve-color) .uk-text-secondary,
.uk-tile-secondary:not(.uk-preserve-color) .uk-text-secondary,
.uk-card-primary.uk-card-body .uk-text-secondary,
.uk-card-primary > :not([class*='uk-card-media']) .uk-text-secondary,
.uk-card-secondary.uk-card-body .uk-text-secondary,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-text-secondary,
.uk-overlay-primary .uk-text-secondary,
.uk-offcanvas-bar.uk-light.uk-text-secondary {
  color: #fff !important;
}
.uk-light .uk-column-divider,
.uk-section-primary:not(.uk-preserve-color) .uk-column-divider,
.uk-section-secondary:not(.uk-preserve-color) .uk-column-divider,
.uk-tile-primary:not(.uk-preserve-color) .uk-column-divider,
.uk-tile-secondary:not(.uk-preserve-color) .uk-column-divider,
.uk-card-primary.uk-card-body .uk-column-divider,
.uk-card-primary > :not([class*='uk-card-media']) .uk-column-divider,
.uk-card-secondary.uk-card-body .uk-column-divider,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-column-divider,
.uk-overlay-primary .uk-column-divider,
.uk-offcanvas-bar.uk-light.uk-column-divider {
  column-rule-color: rgba(255, 255, 255, 0.2);
}
.uk-light .uk-logo,
.uk-section-primary:not(.uk-preserve-color) .uk-logo,
.uk-section-secondary:not(.uk-preserve-color) .uk-logo,
.uk-tile-primary:not(.uk-preserve-color) .uk-logo,
.uk-tile-secondary:not(.uk-preserve-color) .uk-logo,
.uk-card-primary.uk-card-body .uk-logo,
.uk-card-primary > :not([class*='uk-card-media']) .uk-logo,
.uk-card-secondary.uk-card-body .uk-logo,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-logo,
.uk-overlay-primary .uk-logo,
.uk-offcanvas-bar.uk-light.uk-logo {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-logo:hover,
.uk-light .uk-logo:focus,
.uk-section-primary:not(.uk-preserve-color) .uk-logo:hover,
.uk-section-primary:not(.uk-preserve-color) .uk-logo:focus,
.uk-section-secondary:not(.uk-preserve-color) .uk-logo:hover,
.uk-section-secondary:not(.uk-preserve-color) .uk-logo:focus,
.uk-tile-primary:not(.uk-preserve-color) .uk-logo:hover,
.uk-tile-primary:not(.uk-preserve-color) .uk-logo:focus,
.uk-tile-secondary:not(.uk-preserve-color) .uk-logo:hover,
.uk-tile-secondary:not(.uk-preserve-color) .uk-logo:focus,
.uk-card-primary.uk-card-body .uk-logo:hover,
.uk-card-primary.uk-card-body .uk-logo:focus,
.uk-card-primary > :not([class*='uk-card-media']) .uk-logo:hover,
.uk-card-primary > :not([class*='uk-card-media']) .uk-logo:focus,
.uk-card-secondary.uk-card-body .uk-logo:hover,
.uk-card-secondary.uk-card-body .uk-logo:focus,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-logo:hover,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-logo:focus,
.uk-overlay-primary .uk-logo:hover,
.uk-overlay-primary .uk-logo:focus,
.uk-offcanvas-bar.uk-light.uk-logo:hover,
.uk-offcanvas-bar.uk-light.uk-logo:focus {
  color: rgba(255, 255, 255, 0.7);
}
.uk-light .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-section-primary:not(.uk-preserve-color) .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-section-secondary:not(.uk-preserve-color) .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-tile-primary:not(.uk-preserve-color) .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-tile-secondary:not(.uk-preserve-color) .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-card-primary.uk-card-body .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-card-primary > :not([class*='uk-card-media']) .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-card-secondary.uk-card-body .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-card-secondary > :not([class*='uk-card-media']) .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-overlay-primary .uk-logo > :not(.uk-logo-inverse):not(:only-of-type),
.uk-offcanvas-bar.uk-light.uk-logo > :not(.uk-logo-inverse):not(:only-of-type) {
  display: none;
}
.uk-light .uk-logo-inverse,
.uk-section-primary:not(.uk-preserve-color) .uk-logo-inverse,
.uk-section-secondary:not(.uk-preserve-color) .uk-logo-inverse,
.uk-tile-primary:not(.uk-preserve-color) .uk-logo-inverse,
.uk-tile-secondary:not(.uk-preserve-color) .uk-logo-inverse,
.uk-card-primary.uk-card-body .uk-logo-inverse,
.uk-card-primary > :not([class*='uk-card-media']) .uk-logo-inverse,
.uk-card-secondary.uk-card-body .uk-logo-inverse,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-logo-inverse,
.uk-overlay-primary .uk-logo-inverse,
.uk-offcanvas-bar.uk-light.uk-logo-inverse {
  display: inline;
}
.uk-light .uk-accordion-title::before,
.uk-section-primary:not(.uk-preserve-color) .uk-accordion-title::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-accordion-title::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-accordion-title::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-accordion-title::before,
.uk-card-primary.uk-card-body .uk-accordion-title::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-accordion-title::before,
.uk-card-secondary.uk-card-body .uk-accordion-title::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-accordion-title::before,
.uk-overlay-primary .uk-accordion-title::before,
.uk-offcanvas-bar.uk-light.uk-accordion-title::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%20%20%20%20%3Crect%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20width%3D%221%22%20height%3D%2213%22%20x%3D%226%22%20y%3D%220%22%20%2F%3E%0A%3C%2Fsvg%3E");
}
.uk-light .uk-open > .uk-accordion-title::before,
.uk-section-primary:not(.uk-preserve-color) .uk-open > .uk-accordion-title::before,
.uk-section-secondary:not(.uk-preserve-color) .uk-open > .uk-accordion-title::before,
.uk-tile-primary:not(.uk-preserve-color) .uk-open > .uk-accordion-title::before,
.uk-tile-secondary:not(.uk-preserve-color) .uk-open > .uk-accordion-title::before,
.uk-card-primary.uk-card-body .uk-open > .uk-accordion-title::before,
.uk-card-primary > :not([class*='uk-card-media']) .uk-open > .uk-accordion-title::before,
.uk-card-secondary.uk-card-body .uk-open > .uk-accordion-title::before,
.uk-card-secondary > :not([class*='uk-card-media']) .uk-open > .uk-accordion-title::before,
.uk-overlay-primary .uk-open > .uk-accordion-title::before,
.uk-offcanvas-bar.uk-light.uk-open > .uk-accordion-title::before {
  background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2213%22%20height%3D%2213%22%20viewBox%3D%220%200%2013%2013%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Crect%20fill%3D%22rgba%28255,%20255,%20255,%200.7%29%22%20width%3D%2213%22%20height%3D%221%22%20x%3D%220%22%20y%3D%226%22%20%2F%3E%0A%3C%2Fsvg%3E");
}

/* ==== themes/red/css/styles.css ==== */
@keyframes opacity-fade-show {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes opacity-fade-hide {
    0% {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
@keyframes opacity-fade-bottom-show {
    0% {
        opacity: 0;
        transform: translateY(-30%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes opacity-fade-top-show {
    0% {
        opacity: 0;
        transform: translateY(30%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes opacity-fade-in {
    0% {
        opacity: 0.4;
    }
    to {
        opacity: 1;
    }
}
@keyframes opacity-fade-light-show-modal {
    0% {
        opacity: 0;
        transform: scale(0.8);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes opacity-fade-show-modal-strict {
    0% {
        opacity: 0;
        transform: scale(0.1);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes opacity-fade-show-modal {
    0% {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes opacity-fade-hide-modal {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    to {
        opacity: 0;
        transform: scale(0.7);
    }
}
@keyframes opacity-zoom-fade-hide {
    0% {
        opacity: 0.5;
    }
    to {
        opacity: 0;
        transform: scale(6);
    }
}
@keyframes ring {
    0% {
        transform: rotate(-15deg);
    }
    2% {
        transform: rotate(15deg);
    }
    12%,
    4% {
        transform: rotate(-18deg);
    }
    14%,
    6% {
        transform: rotate(18deg);
    }
    8% {
        transform: rotate(-22deg);
    }
    10% {
        transform: rotate(22deg);
    }
    16% {
        transform: rotate(-12deg);
    }
    18% {
        transform: rotate(12deg);
    }
    20%,
    to {
        transform: rotate(0deg);
    }
}
@keyframes pointing-down {
    0%,
    to {
        transform: translate3d(0, 0, 0);
    }
    50% {
        transform: translate3d(0, -10%, 0);
    }
}
@keyframes form-alert-top-and-hide {
    0% {
        opacity: 0;
        transform: translateY(50px);
    }
    20%,
    80% {
        opacity: 1;
        transform: translateY(0);
    }
    to {
        opacity: 0;
    }
}
@keyframes move-from-right {
    0% {
        transform: translateX(100%);
    }
    to {
        transform: translateX(0);
    }
}
@keyframes move-bottom-right {
    0% {
        transform: translateY(100%);
    }
    to {
        transform: translateY(0);
    }
}
@keyframes landing-opacity-zoom-fade-show-delay {
    0% {
        opacity: 0;
        transform: translateY(20%);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes landing-opacity-move-left-delay {
    0% {
        opacity: 0.4;
        transform: translateX(-20%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes toast-flash-show {
    0% {
        opacity: 0;
        transform: translateY(0);
    }
    to {
        opacity: 1;
        transform: translateY(64px);
    }
}
@keyframes circleFadeDelay {
    0%,
    39%,
    to {
        opacity: 0;
    }
    40% {
        opacity: 1;
    }
}
@keyframes scanner {
    0% {
        top: 0;
    }
    to {
        top: calc(100% - 3px);
    }
}
@keyframes loader-ds {
    to {
        transform: rotate(360deg);
    }
}
@keyframes loader-ds-circle {
    0% {
        stroke-dasharray: 1px, 200px;
        stroke-dashoffset: 0;
    }
    50% {
        stroke-dasharray: 100px, 200px;
        stroke-dashoffset: -15px;
    }
    to {
        stroke-dasharray: 100px, 200px;
        stroke-dashoffset: -125px;
    }
}
@keyframes select-animation-spin {
    to {
        transform: rotate(1turn);
    }
}
@keyframes select-animation-fadeIn {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes video-player-animation-play-desktop {
    0% {
        opacity: 0.6;
        transform: translateX(-50%) translateY(-50%) scale(1);
    }
    to {
        opacity: 0;
        transform: translateX(-50%) translateY(-50%) scale(1.5);
    }
}
@keyframes moving-stripes {
    0% {
        background-position: 0 0;
    }
    to {
        background-position: 1rem 0;
    }
}
@keyframes toast-animation-show {
    0% {
        opacity: 0.3;
        right: calc(100% + 50px);
    }
    to {
        opacity: 1;
        right: 0;
    }
}
@keyframes toast-animation-hide {
    0% {
        opacity: 1;
        right: 0;
    }
    to {
        opacity: 0.3;
        right: calc(100% + 50px);
    }
}
@keyframes ability-animation-for-left {
    0% {
        opacity: 0;
        transform: translateX(-40%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes ability-animation-for-right {
    0% {
        opacity: 0;
        transform: translateX(40%);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes arrow-down-animated-move {
    0% {
        top: -26px;
    }
    to {
        top: 4px;
    }
}
@keyframes arrow-down-animated-move-infinity {
    0%,
    70% {
        top: -26px;
    }
    to {
        top: 4px;
    }
}
@keyframes controls-appearance {
    0% {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes animation-ability-tip {
    0%,
    50% {
        transform: scale(0);
    }
    80% {
        transform: scale(1.2);
    }
    to {
        transform: scale(1);
    }
}
@keyframes animation-element-highlighted {
    0%,
    20%,
    to {
        box-shadow: 0 0 0 4px transparent;
    }
    10% {
        box-shadow: 0 0 2px 4px #f59e0b;
    }
    30% {
        box-shadow: 0 0 2px 4px rgba(163, 73, 252, 0.8);
    }
}
@keyframes smile-appear {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes flareAnimation {
    0%,
    30% {
        transform: translateX(-100%);
    }
    50%,
    to {
        transform: translateX(100%);
    }
}
@keyframes skeleton-animation {
    0%,
    to {
        opacity: 1;
    }
    50% {
        opacity: 0.4;
    }
}
@keyframes donut-spin {
    0% {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}
@keyframes animation-comment-highlighted {
    0%,
    50% {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}
@keyframes animate-slide {
    0% {
        opacity: 0;
        transform: translate(16px, 0);
    }
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}
@keyframes fadeIn {
    0% {
        opacity: 0;
        transform: translate(12px, 0);
    }
    to {
        opacity: 1;
        transform: translate(0, 0);
    }
}

body {
    background: #050506;
    font: 0.875rem "Open Sans", Helvetica, "Roboto", "Arial", sans-serif;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    font-weight: 500;
    font-family: 'Open Sans'!important;
}
html {
    font-size: 16px;
    -webkit-tap-highlight-color: transparent;
}
body,
html {
    text-size-adjust: 100%;
    letter-spacing: 0.031rem;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 2dppx) {
    body,
    html {
        letter-spacing: 0.019rem;
    }
}
.text-underline {
    text-decoration: underline;
}
a {
    color: #a4a4a4;
    cursor: pointer;
    text-decoration: none;
    font-family: 'Open Sans'!important;
}
a:active,
a:focus,
a:hover {
    color: #f8f8f8;
    text-decoration: none;
}
p {
    margin-bottom: 1rem;
    margin-top: 0;
}
.small {
    font-size: 80%;
    font-weight: 500;
}
.strong {
    font-weight: 700;
}
.strong-500 {
    font-weight: 500;
}
.text-left {
    text-align: left;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
.no-wrap {
    white-space: nowrap;
}
.pre-line {
    white-space: pre-line;
}
.color-ios,
.color-ios:hover {
    color: #2e7cf6;
}
.color-teaser {
    color: #f9d400;
}
.color-st {
    color: #a2252d;
}
.black-color-text,
.black-color-text:hover {
    color: #000;
}
.white-color-text,
.white-color-text:hover {
    color: #fff;
}
.white-color-text-2,
.white-color-text-2:hover {
    color: #49494a;
}
.white-color-text-4,
.white-color-text-4:hover {
    color: #707071;
}
.white-color-text-opacity-4,
.white-color-text-opacity-4:hover {
    color: rgba(255, 255, 255, 0.4);
}
.white-color-text-6,
.white-color-text-6:hover {
    color: #a0a0a1;
}
.white-color-text-opacity-6,
.white-color-text-opacity-6:hover {
    color: rgba(255, 255, 255, 0.6);
}
.white-color-text-8,
.white-color-text-8:hover {
    color: #cfcfd0;
}
.white-color-text-opacity-8,
.white-color-text-opacity-8:hover {
    color: rgba(255, 255, 255, 0.8);
}
.color-green-light {
    color: #83cb3e;
}
.color-grey-100 {
    color: #d4d4d4;
}
.color-grey-200 {
    color: #808085;
}
.color-grey-300 {
    color: #5f5f67;
}
.color-grey-400 {
    color: #424248;
}
.color-grey-500 {
    color: #343437;
}
.color-grey-600 {
    color: #232325;
}
.color-grey-700 {
    color: #1b1b1d;
}
.color-grey-800 {
    color: #111113;
}
.color-grey-900 {
    color: #050506;
}
.pale-light-text {
    opacity: 0.8;
}
.pale-text-7 {
    opacity: 0.7;
}
.pale-text {
    color: #a0a0a1;
}
.pale-x-text {
    opacity: 0.4;
}
.white-pale-text {
    color: #a0a0a1;
}
.white-pale-text-04 {
    color: #707071;
}
.primary-default-color-text,
.primary-default-color-text:hover {
    color: #d97706;
}
.accent-color-text,
.accent-color-text-bg:hover,
.accent-color-text:hover {
    color: #f59e0b;
}
.accent-color-text-bg,
.color-positive-light-text-bg {
    align-items: center;
    border-radius: 6px;
    display: inline-flex;
    height: 18px;
    padding: 2px 4px;
}
.accent-color-text-bg {
    background: #28234a;
    color: #f59e0b;
}
.color-positive-light-text-bg {
    background: #1c2a24;
    color: #67ed27;
}
.color-positive-light-text-bg:hover {
    color: #67ed27;
}
.accent-color-text-with-hover:active,
.accent-color-text-with-hover:hover,
.accent-light-color-text,
.accent-light-color-text:hover {
    color: #d97706;
}
.accent-color-text-with-hover {
    color: #f59e0b;
    text-decoration: underline;
}
.color-like,
.color-like:hover {
    color: #f44;
}
.color-positive,
.color-positive:hover {
    color: #21b062;
}
.primary-color-text,
.primary-color-text:hover {
    color: var(--primary-border);
}
.primary-dark-x-color-text,
.primary-dark-x-color-text:hover {
    color: #c2410c;
}
.primary-light-color-text,
.primary-light-color-text:hover {
    color: #d97706;
}
.yellow-color-text,
.yellow-color-text:hover {
    color: #ffd600;
}
.alive-link {
    pointer-events: auto;
    text-decoration: underline;
}
.alive-link:hover {
    text-decoration: none;
}
.red-color-text,
.red-color-text:hover {
    color: #ef7d00;
}
.red-light-color-text,
.red-light-color-text:hover {
    color: #fd4967;
}
.error-color-text,
.error-color-text:hover {
    color: #fd3a5b;
}
.error-light-color-text,
.error-light-color-text:hover {
    color: #ef7d00;
}
.color-pale {
    opacity: 0.6;
}
.color-pale-x {
    opacity: 0.4;
}
.color-warning,
.color-warning:hover {
    color: #fccf49;
}
.email-text::after {
    content: "help@my.club";
}
.text-onf::before {
    content: "Only";
}
.text-onf::after {
    content: "Fans";
}
.text-starsavn::before {
    content: "AVN";
}
.text-starsavn::after {
    content: " Stars";
}
.text-fansly::before {
    content: "Fan";
}
.text-fansly::after {
    content: "sly";
}
.text-bold {
    font-weight: 700;
}
.text-uppercase {
    text-transform: uppercase;
}
.text-lowercase {
    text-transform: lowercase;
}
.cursor-pointer {
    cursor: pointer;
}
a.text-link {
    color: inherit;
}
.color-male {
    color: #1fc9ff;
}
.color-female {
    color: #f423a2;
}
.color-trans {
    color: #a862ff;
}
.content-header-text {
    font-size: 40px;
    font-weight: 700;
    margin: 0 0 32px;
}
@media screen and (max-width: 639px) {
    .content-header-text {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 12px;
    }
}
.trending-header {
    font-size: 40px;
    font-weight: 700;
    line-height: 49px;
    margin: 0;
    padding: 0;
    position: relative;
    width: 100%;
}
.trending-header--center {
    margin-right: 49px;
    text-align: center;
}
.trending-header__subtitle {
    color: #a0a0a1;
    font-size: 16px;
    font-weight: 400;
    line-height: normal;
    position: absolute;
    width: 100%;
}
.trending-header__text {
    overflow: hidden;
    text-overflow: ellipsis;
}
@media screen and (max-width: 639px) {
    .trending-header {
        font-size: 27px;
        line-height: 32px;
    }
    .trending-header--center {
        margin: 0 0 34px;
        text-align: left;
    }
}
.is-multiple a.select-value-label:hover,
.underline-hover:hover,
a.text-link {
    text-decoration: underline;
}
.opacity-hover:hover {
    opacity: 0.8;
}
.terms-address::before {
    content: "Spyrou Kyprianou 79, 2";
}
.terms-address::after {
    content: " Floor, Flat 201, 3076, Limassol, Cyprus";
}
.hidden {
    display: none !important;
}
.page-wrapper {
    display: flex;
    flex-direction: column;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 0;
}
.container.island-page,
.island-page {
    display: flex;
    justify-content: center;
    padding: 60px 0;
    text-align: center;
}
.container.island-page > .island-wrapper,
.form-fields .settings-field > div.settings-label > label,
.island-page > .island-wrapper {
    text-align: left;
}
.island-wrapper {
    display: inline-block;
    max-width: 100%;
    position: relative;
    vertical-align: top;
}
.island-top {
    align-items: center;
    justify-content: space-between;
    padding-bottom: 10px;
    position: relative;
    display: flex;
    flex-direction: row;
}
.island-top-title {
    color: #fff;
    display: inline-block;
    margin: 0;
    font-size: 1.5rem;
}
.island {
    background-color: var(--primary-modal);
    border: 0;
    border-radius: 8px;
}
.footer-bottom > a,
.island .text {
    color: #fff;
}
.island .link {
    color: #e3e3e3;
    text-decoration: underline;
}
.island .link:hover {
    text-decoration: none;
}
.island .link-after-text {
    margin-left: 0.3em;
}
.island .field {
    display: block;
    position: relative;
}
.island .field-action {
    text-align: center;
}
.island .btn-action {
    font-weight: 700;
    opacity: 0.9;
}
.island .btn-action.disabled,
.island .btn-action:disabled {
    opacity: 0.33;
}
.island-small {
    max-width: 100%;
    padding: 18px 20px;
    width: 300px;
}
.island-small .island-title {
    font-size: 1.5rem;
}
.island-small .link,
.island-small .suggestion {
    font-size: 0.75rem;
}
.island-small .field {
    margin-top: 20px;
}
.island-small .field:first-child {
    margin-top: 0;
}
.island-small .btn-action {
    line-height: 38px;
    min-width: 160px;
    font-size: 0.938rem;
}
.island-small .textarea,
.island-small input.input[type="date"],
.island-small input.input[type="email"],
.island-small input.input[type="password"],
.island-small input.input[type="text"] {
    padding: 0 15px;
    width: 100%;
    font-size: 0.875rem;
}
.island-small .tooltip > .tooltip-inner {
    font-size: 0.75rem;
}
@media screen and (max-width: 1023px) {
    .island-small .tooltip-inner {
        padding: 0;
    }
}
.columns {
    display: flex;
    flex-wrap: wrap;
    margin-left: -0.375rem;
    margin-right: -0.375rem;
}
.column {
    display: block;
    flex: 1 1 0;
    padding: 0 0.375rem;
}
.container {
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    width: 100%;
}
@media screen and (min-width: 1600px) {
    .container {
        max-width: 1388px;
        padding-left: 0;
        padding-right: 0;
        width: 1388px;
    }
    .fs {
        right: 560px!important;
    }

}
.spacer {
    margin-top: 0.375rem;
}
.spacer-small-x {
    margin-top: 0.25rem;
}
.spacer-small-s {
    margin-top: 0.5rem;
}
.spacer-10 {
    margin-top: 10px;
}
.spacer-small {
    margin-top: 0.75rem;
}
.spacer-medium-x {
    margin-top: 1rem;
}
.spacer-medium {
    margin-top: 1.25rem;
}
.spacer-large,
.spacer-large-double {
    margin-top: 1.5rem;
}
.spacer-large-2 {
    margin-top: 2rem;
}
.spacer-large-xs {
    margin-top: 2.5rem;
}
.spacer-large-x {
    margin-top: 3rem;
}
.spacer-large-xx {
    margin-top: 80px;
}
.line {
    background: rgba(255, 255, 255, 0.1);
    height: 1px;
}
.indent-left-small {
    margin-left: 12px;
}
.indent-right-medium {
    margin-right: 16px;
}
.indent-right-16,
.indent-right-small {
    margin-right: 12px;
}
.indent-right-small-6 {
    margin-right: 6px;
}
.indent-right-small-8 {
    margin-right: 8px;
}
.indent-right-small-4 {
    margin-right: 4px;
}
.indent-right-small-10 {
    margin-right: 10px;
}
.indent-left-small-6 {
    margin-left: 6px;
}
.indent-left-small-4 {
    margin-left: 4px;
}
.indent-left-10 {
    margin-left: 10px;
}
.indent-left-16 {
    margin-left: 16px;
}
@media screen and (max-width: 639px) {
    .media-up-to-s-hidden {
        display: none !important;
    }
}
@media screen and (min-width: 640px) {
    .media-after-m-hidden {
        display: none !important;
    }
}
@media screen and (min-width: 1024px) {
    .media-after-l-hidden {
        display: none !important;
    }
}
@media screen and (max-width: 639px) {
    .from-tablet {
        display: none;
    }
}
@media screen and (min-width: 640px) {
    .only-phone {
        display: none;
    }
}
.max-height-300 {
    max-height: 300px;
}
.min-width-200 {
    min-width: 200px;
}
.min-width-500 {
    min-width: 500px;
}
.max-width-140 {
    max-width: 140px;
}
.max-width-230 {
    max-width: 230px;
}
.min-width-140 {
    min-width: 140px;
}
.min-width-230 {
    min-width: 230px;
}
.max-width-560 {
    max-width: 560px;
}
.max-width-590 {
    max-width: 590px;
}
.text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.flex-align-left {
    align-items: center;
    display: flex;
    justify-content: flex-start;
}
.flex-align-center {
    justify-content: center;
}
.flex-align-center,
.flex-vertical-center {
    align-items: center;
    display: flex;
}
.align-center {
    justify-content: center;
    text-align: center;
}
.align-right {
    justify-content: flex-end;
    text-align: right;
}
.align-end {
    justify-content: flex-end;
    text-align: end;
}
.align-space-between {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.line-1 {
    background: rgba(255, 255, 255, 0.1);
    height: 1px;
}
.disabled-click,
.disabled-content {
    pointer-events: none;
}
.disabled-content {
    opacity: 0.6;
}
.break-word {
    word-break: break-word;
}
.block {
    clear: both;
    display: block;
}
.observer-page {
    height: 400px;
    pointer-events: none;
    position: absolute;
    transform: translateY(-218px);
}
.list-dot {
    list-style: inside disc;
}
.grid-align-center {
    align-items: center;
    display: grid;
    grid-auto-flow: column;
    justify-content: center;
}
.columns-grid-medium {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.position-relative {
    position: relative;
}
.padding-regular-x {
    padding-left: 20px;
    padding-right: 20px;
}
.padding-regular-y {
    padding-bottom: 20px;
    padding-top: 20px;
}
.error-boundary {
    align-items: center;
    background: #000;
    bottom: 0;
    color: #fff;
    display: flex;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
}
.error-boundary__content {
    max-width: 470px;
    padding: 35px;
    position: relative;
}
.error-boundary__title {
    font-size: 20px;
    line-height: 26px;
    margin: 10px 0 0;
    opacity: 0.9;
}
.error-boundary__text {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    font-size: 15px;
    line-height: 22px;
    opacity: 0.6;
    padding-bottom: 30px;
}
.error-boundary__text-error {
    font-size: 13px;
    margin: 30px 0 0;
    opacity: 0.4;
}
.error-boundary__text-error-number {
    display: block;
    margin-top: 4px;
    word-break: break-all;
}
.error-boundary__textarea {
    display: block;
    margin: 10px 0;
    min-height: 100px;
    width: 100%;
}
.error-boundary .button {
    margin: 30px 0;
}
.main-layout {
    min-height: 100vh;
    overflow: hidden;
    padding-bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom));
    padding-top: var(--pwa-notification-height);
}
.main-layout__landing-body {
    overscroll-behavior-y: none;
}
@media screen and (max-width: 1023px) {
    .main-layout__landing-body {
        overscroll-behavior-x: none;
    }
}
.main-layout__landing-body .default-footer {
    background: 0 0;
}
.main-layout__wrapper {
    min-height: 100vh;
    padding: 0 0 40px;
}
.main-layout--clear-page {
    background: linear-gradient(199.01deg, #27053d 0, #050506 72.26%);
}
.main-layout__shadow-circle {
    background: #f59e0b;
    border-radius: 50%;
    filter: blur(250px);
    height: 625px;
    left: -180px;
    opacity: 0.08;
    position: fixed;
    top: 659px;
    width: 625px;
    z-index: 1;
}
.main-layout--landing {
    background: #050506;
}
@media screen and (min-width: 640px) {
    .main-layout--cookie .messenger-chats {
        bottom: 60px;
    }
    .main-layout--cookie .messenger-chat--expanded .content {
        max-height: calc(100vh - 160px);
    }
}
:root {
    /* Marca Privê das Estrelas: accent LARANJA (era vermelho do Belloo). */
    --accent: #f59e0b;
    --accent-dark: #d97706;
    --primary: #ef7d00;
    --primary-light: #ffb020;
    --primary-dark: #d97706;
    --primary-border: #d97706;
    --primary-modal: #c2410c;
    /* Tokens do design system (docs/design-system.md). Componentes novos usam
       só estes; os legados migram aos poucos. */
    --ds-bg: #050506;
    --ds-surface: #111113;
    --ds-surface-2: #1a1a1d;
    --ds-surface-3: #232325;
    --ds-border: #2a2a2e;
    --ds-text: #f4f4f5;
    --ds-text-muted: #a0a0a1;
    --ds-primary: #ef7d00;
    --ds-primary-hover: #ffb020;
    --ds-success: #21b062;
    --ds-success-bg: #0a3d20;
    --ds-warning: #ffc107;
    --ds-error: #ff5a5f;
    --ds-error-bg: #3a0f12;
    --ds-radius: 12px;
    --ds-radius-sm: 8px;
    --ds-tap: 44px;
    --pwa-notification-height: 0px;
    --pwa-sticky-header-height: 0px;
    --tap-bar-height: 0px;
}
* {
    box-sizing: inherit;
}
::selection {
    background: #d97706;
    color: #fff;
}
html {
    background: #050506;
    box-sizing: border-box;
    min-height: 100vh;
}
html.disable-scroll {
    overflow: hidden;
    position: fixed;
    width: 100%;
}
html.scroll-lock--hard {
    overflow: hidden;
}
html.scroll-lock--hard > body {
    overflow: hidden;
    position: fixed;
}
html.scroll-lock--hard-mobile > body {
    position: fixed;
}
body {
    color: #fff;
    width: 100%;
}
li,
ul {
    padding: 0;
}
body,
li {
    margin: 0;
}
ul {
    list-style: none;
    margin-bottom: 0;
    margin-top: 1rem;
}
img {
    border: 0;
    vertical-align: middle;
}
button,
input,
select,
textarea {
    line-height: inherit;
    margin: 0;
    outline: 0;
}
textarea {
    font: 0.875rem "Rubik", Helvetica, "Roboto", "Arial", sans-serif;
    resize: vertical;
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button,
input[type="search"],
input[type="submit"] {
    -webkit-appearance: none;
    appearance: none;
}
input[type="number"] {
    -moz-appearance: textfield;
}
input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
    margin: 0;
}
hr {
    border: 0;
    border-top: 0.0625rem solid rgba(0, 0, 0, 0.1);
    margin: 1rem 0;
}
.adsbox {
    bottom: 0;
    left: 0;
    position: fixed;
}
.invisible-block {
    visibility: hidden;
}

.mobile-show {
    display: none !important;
}
.profile-media-pills{

}
@media screen and (max-width: 1023px) {
    .mobile-hide {
        display: none !important;
    }
    .mobile-show {
        display: inline-flex !important;
    }  
    .fs {
        background: #0c0c0c!important;
    }      
    .user-media-content-sub-title{
        margin-left: 20px!important;
    }
    .profile-media-pills{
        margin-top: 15px!important;
        margin-right: 15px!important;
        margin-left: 15px!important;
    }
    .header-notifications {
        position: fixed!important;
        bottom: 60px!important;
        top: initial!important;
    } 

}
@media screen and (max-width: 639px) {
    .before-tablet-hide {
        display: none !important;
    }
}
@media screen and (max-width: 374px) {
    .before-phablet-hide {
        display: none !important;
    }
}
@media screen and (min-width: 1024px) {
    .desktop-hide {
        display: none !important;
    }
}
@media screen and (min-width: 640px) {
    .after-phone-hide {
        display: none !important;
    }
}
@media screen and (max-width: 639px) {
    .phone-hide {
        display: none !important;
    }
}
@media screen and (min-width: 480px) {
    .before-phone-hide {
        display: none !important;
    }
}
#body_loader {
    pointer-events: none;
    transition: opacity 0.5s;
    z-index: 10000;
}
.hide {
    display: none !important;
}
.footer-description {
    opacity: 0.4;
    padding: 0 30px 0 0;
}
.footer-description p:last-child {
    margin: 0;
}
.default-footer {
    background: #050506;
    color: #fff;
    padding: 0;
    position: relative;
    font-size: 0.75rem;
}
.default-footer__content {
    margin: 0 auto;
    max-width: 1400px;
    padding: 0 40px;
}
.default-footer .column {
    padding: 0.375rem 0.7rem 0.375rem 0;
}
.default-footer .column:last-child {
    padding-right: 0;
}
.default-footer .icon-agreement {
    opacity: 0.4;
}
@media screen and (max-width: 1023px) {
    .default-footer__content {
        padding: 0 16px;
    }
}
@media screen and (min-width: 640px) and (max-width: 1023px) {
    .default-footer .footer-section:nth-child(-n + 2) {
        margin-bottom: 20px;
    }
}
@media screen and (min-width: 480px) and (max-width: 639px) {
    .default-footer .column {
        padding: 0.375rem;
    }
    .default-footer .footer-address {
        flex-wrap: wrap;
    }
    .default-footer .footer-section:nth-child(-n + 2) {
        margin-bottom: 20px;
    }
    .default-footer .footer-left .footer-nav {
        margin: 10px 0 0;
        display: flex;
        flex-direction: row;
    }
    .default-footer .icon-agreement {
        display: none;
    }
}
@media screen and (max-width: 479px) {
    .default-footer .footer-description {
        padding: 0;
    }
    .default-footer .columns {
        margin: 0;
    }
    .default-footer .column {
        padding: 0.375rem 0;
    }
    .default-footer .footer-bottom {
        border-top: 1px solid rgba(255, 255, 255, 0.25);
        display: block;
        margin: 0;
        padding: 24px 0 0;
    }
    .default-footer .footer-address {
        margin: 16px 0 0;
    }
    .default-footer .footer-top {
        margin-bottom: 0;
    }
    .default-footer .footer-section:nth-child(-n + 2) {
        margin-bottom: 20px;
    }
    .default-footer .footer-additionally {
        border-bottom: 1px solid rgba(164, 164, 164, 0.2);
        border-top-width: 0;
        margin-top: 0;
    }
    .default-footer .footer-left .footer-nav {
        display: flex;
        margin: 10px 0;
        flex-direction: column;
    }
    .default-footer .icon-agreement {
        display: none;
    }
    .default-footer .footer-left .footer-nav .footer-section {
        width: 100%;
    }
}
.footer-top {
    margin-bottom: 0.375rem;
}
.footer-section-header {
    color: rgba(255, 255, 255, 0.6);
    margin: 0 0 8px;
}
.footer-social-link {
    vertical-align: middle;
    display: flex;
    flex-direction: row;
}
.footer-social-link .icon {
    fill: #a4a4a4;
    margin-right: 6px;
    margin-top: 1px;
}
.footer-social-link:hover .icon {
    fill: #d97706;
}
.footer-right {
    margin: -0.375rem 0;
}
.footer-right .footer-nav .footer-section:last-child {
    flex: 0;
}
.footer-address {
    justify-content: flex-end;
    margin-top: -3px;
    display: flex;
    flex-direction: row;
}
.footer-bottom,
.footer-logo {
    align-items: center;
    justify-content: space-between;
    display: flex;
    flex-direction: row;
}
.footer-bottom {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin: 0 0 4px;
    opacity: 0.4;
    padding: 20px 0 0;
}
.footer-logo {
    flex-wrap: wrap;
    margin: 0 0 24px;
}
.footer-logo__icon {
    background: url('../../themes/red/logo.jpeg') no-repeat;
    background-size: contain;
    display: block;
    height: 34px;
    margin: 0 0 20px;
    opacity: 0.6;
    transition: opacity 0.3s;
    width: 146px;
}
.footer-logo__icon:hover {
    opacity: 1;
}
.footer-section__social {
    align-items: center;
    display: flex;
    margin: 20px 0;
}
.footer-section__social-item {
    margin: 0 18px 0 0;
}
.footer-section__social-item-icon {
    height: 18px;
    width: 18px;
}
.footer-section__link {
    color: #707071;
    transition: color 0.3s;
}
.footer-section__link--purple {
    color: #7f6e8c;
}
.footer-section__link:hover {
    color: #fff;
}
.footer-section-item {
    font-size: 0.813rem;
    line-height: 1.125rem;
    margin: 8px 0;
}
.footer-section-item .icon-myclub-logo {
    opacity: 0.6;
}
.footer-section-item__q-icon {
    margin: 0 0 0 4px;
    position: absolute;
}
.footer-section-item__tel {
    color: #fff;
    opacity: 0.4;
    transition: opacity 0.3s;
}
.footer-section-item__tel::before {
    content: "1-855-610-0599 ";
}
.footer-section-item__tel::after {
    content: "(USA Toll Free)";
    display: inline-block;
}
.footer-section-item__title {
    color: rgba(255, 255, 255, 0.4);
    margin-right: 4px;
    white-space: nowrap;
}
.footer-place::after {
    content: "Warmtech Ltd Spyrou Kyprianou 79, Protopapas Blg, flat 201, 3076, Limassol, Cyprus";
}
.btn {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 12px;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-weight: 400;
    justify-content: center;
    outline: 0;
    overflow: hidden;
    padding: 0 20px;
    text-align: center;
    text-decoration: none;
    text-overflow: ellipsis;
    touch-action: manipulation;
    vertical-align: middle;
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
    font-size: 0.813rem;
    letter-spacing: 0.013rem;
    line-height: 1.813rem;
}
.btn.overflow-visible {
    overflow: visible;
}
.btn:active,
.btn:focus,
.btn:hover {
    text-decoration: none;
}
.btn:active {
    transform: translateY(1px);
}
.btn.disabled,
.btn:disabled {
    cursor: default;
    opacity: 0.33;
    pointer-events: none;
}
.btn--width--medium {
    width: 140px;
}
.btn--width--wide {
    width: 100%;
}
.btn__percent {
    display: inline-block;
    text-align: right;
    width: 3em;
}
.btn-extra-small {
    line-height: 19px;
}
.btn-small {
    line-height: 23px;
}
.btn-medium {
    height: 32px;
}
.btn-medium-x {
    height: 36px;
    line-height: 34px;
}
.btn-medium-xx {
    height: 38px;
    line-height: 36px;
    padding: 0 8px;
}
.btn-medium-xx-compact {
    align-items: center;
    display: flex;
    height: 38px;
    justify-content: center;
    min-width: 48px;
    padding: 0 6px;
    font-size: 1rem;
}
.btn-large-compact.disabled,
.btn-large-compact:disabled,
.btn-medium-xx-compact.disabled,
.btn-medium-xx-compact:disabled {
    opacity: 0.9;
}
.btn-large {
    height: 40px;
    line-height: 38px;
    font-size: 0.875rem;
}
.btn-large-compact {
    align-items: center;
    display: flex;
    height: 40px;
    justify-content: center;
    min-width: 44px;
    padding: 0 6px;
    font-size: 1rem;
}
.btn-block,
.btn-flex {
    display: block;
}
.btn-flex {
    align-items: center;
}
.btn-default {
    background: #343437;
    color: #fff;
    transition: background 250ms, color 250ms;
    border-color: transparent;
}
.btn-default > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-default:hover {
    background: #424248;
    color: #fff;
}
.btn-default:active,
.btn-default:focus {
    background: #343437;
    color: #fff;
}
.btn-default .btn-loader-overlay {
    background-color: #343437;
    color: #fff;
}
.btn-default.hover,
.btn-default:hover {
    border-color: transparent;
}
.btn-default.active,
.btn-default.focus,
.btn-default:active,
.btn-default:focus {
    border-color: transparent;
}
.btn-dark {
    background: #111113;
    color: #fff;
    transition: background 250ms, color 250ms;
    border-color: transparent;
}
.btn-dark > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-dark:hover {
    background: #232325;
    color: #fff;
}
.btn-dark:active,
.btn-dark:focus {
    background: #232325;
    color: #fff;
}
.btn-dark .btn-loader-overlay {
    background-color: #111113;
    color: #fff;
}
.btn-dark.hover,
.btn-dark:hover {
    border-color: transparent;
}
.btn-dark.active,
.btn-dark.focus,
.btn-dark:active,
.btn-dark:focus {
    border-color: transparent;
}
.btn-accept {
    background: #ef7d00 !important;
    color: #f1f1f1;
    transition: background 250ms, color 250ms;
}
.btn-accept > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-accept:hover {
    background: #424248;
    color: #fff;
}
.btn-accept:active,
.btn-accept:focus {
    background: #9c2a32;
    color: #fff;
}
.btn-accept .btn-loader-overlay {
    background-color: #ef7d00;
    color: #fff;
}
.btn-red-chat {
    background: rgba(210, 27, 76, 0.2);
    color: #ef7d00;
    transition: background 250ms, color 250ms;
}
.btn-red-chat > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-red-chat:hover {
    background: rgba(210, 27, 76, 0.4);
    color: #ef7d00;
}
.btn-red-chat:active,
.btn-red-chat:focus {
    background: rgba(210, 27, 76, 0.4);
    color: #ef7d00;
}
.btn-red-chat .btn-loader-overlay {
    background-color: rgba(210, 27, 76, 0.2);
    color: #ef7d00;
}
.btn-green-chat {
    background: rgba(33, 176, 98, 0.2);
    color: #21b062;
    transition: background 250ms, color 250ms;
}
.btn-green-chat > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-green-chat:hover {
    background: rgba(33, 176, 98, 0.4);
    color: #21b062;
}
.btn-green-chat:active,
.btn-green-chat:focus {
    background: rgba(33, 176, 98, 0.4);
    color: #21b062;
}
.btn-green-chat .btn-loader-overlay {
    background-color: rgba(33, 176, 98, 0.2);
    color: #21b062;
}
.btn-apply {
    background: #d97706;
    color: #fff;
    transition: background 250ms, color 250ms;
}
.btn-apply > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-apply:hover {
    background: #ea8f0c;
    color: #fff;
}
.btn-apply:active,
.btn-apply:focus {
    background: #f59e0b;
    color: #fff;
}
.btn-apply .btn-loader-overlay {
    background-color: #d97706;
    color: #fff;
}
.btn-apply-outline {
    background: 0 0;
    border-color: #d97706;
    border-width: 2px;
    color: #fff;
    transition: background 250ms;
}
.btn-apply-outline:hover {
    background: #d97706;
    border-color: #d97706;
}
.btn-apply-primary {
    background: #34b353;
    color: #fff;
    transition: background 250ms, color 250ms;
}
.btn-apply-primary > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-apply-primary:hover {
    background: #34c753;
    color: #fff;
}
.btn-apply-primary:active,
.btn-apply-primary:focus {
    background: #34c753;
    color: #fff;
}
.btn-apply-primary .btn-loader-overlay {
    background-color: #34b353;
    color: #fff;
}
.btn-light {
    background: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.6);
    transition: background 250ms, color 250ms;
    font-weight: 400;
}
.btn-light > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-light:hover {
    background: rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.8);
}
.btn-light:active,
.btn-light:focus {
    background: rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.8);
}
.btn-light .btn-loader-overlay {
    background-color: rgba(255, 255, 255, 0.1);
    color: rgba(255, 255, 255, 0.8);
}
.btn-join {
    transition: background 250ms, color 250ms;
}
.btn-join > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-join,
.btn-join:hover {
    background: #f59e0b;
    color: #fff;
}
.btn-join:active,
.btn-join:focus {
    background: #f59e0b;
    color: #fff;
}
.btn-join .btn-loader-overlay {
    background-color: #f59e0b;
    color: #fff;
}
.btn-outline {
    background: 0 0;
    color: #fdfdfd;
    transition: background 250ms, color 250ms;
    border-color: rgba(255, 255, 255, 0.2);
}
.btn-outline > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-outline:hover {
    background: #fff;
    color: #414141;
}
.btn-outline:active,
.btn-outline:focus {
    background: #fff;
    color: #414141;
}
.btn-outline .btn-loader-overlay {
    background-color: transparent;
    color: #414141;
}
.btn-outline.hover,
.btn-outline:hover {
    border-color: #fff;
}
.btn-outline.active,
.btn-outline.focus,
.btn-outline:active,
.btn-outline:focus {
    border-color: #fff;
}
.btn-outline-pale {
    background: 0 0;
    color: #fff;
    transition: background 250ms, color 250ms;
    border-color: #343437;
    border-width: 2px;
}
.btn-outline-pale > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-outline-pale:hover {
    background: #424248;
    color: #fff;
}
.btn-outline-pale:active,
.btn-outline-pale:focus {
    background: #232325;
    color: #fff;
}
.btn-outline-pale .btn-loader-overlay {
    background-color: transparent;
    color: #fff;
}
.btn-outline-pale.hover,
.btn-outline-pale:hover {
    border-color: #424248;
}
.btn-outline-pale.active,
.btn-outline-pale.focus,
.btn-outline-pale:active,
.btn-outline-pale:focus {
    border-color: #232325;
}
.btn-signup {
    background: #f1f1f1;
    color: #d97706;
}
.btn-signup:active,
.btn-signup:focus,
.btn-signup:hover {
    opacity: 0.9;
}
.btn-signup .btn-loader-overlay {
    color: #1b1b1d;
}
.btn-goal {
    background: #fff;
    color: #21b062;
}
.btn-goal:active,
.btn-goal:focus,
.btn-goal:hover {
    background: rgba(255, 255, 255, 0.8);
}
.btn-goal .btn-loader-overlay {
    color: #21b062;
}
.btn-pale {
    background: 0 0;
    color: rgba(255, 255, 255, 0.6);
    transition: background 250ms, color 250ms;
    border-color: rgba(255, 255, 255, 0.3);
}
.btn-pale > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-pale:hover {
    background: 0 0;
    color: rgba(255, 255, 255, 0.8);
}
.btn-pale:active,
.btn-pale:focus {
    background: 0 0;
    color: rgba(255, 255, 255, 0.8);
}
.btn-pale .btn-loader-overlay {
    background-color: transparent;
    color: rgba(255, 255, 255, 0.8);
}
.btn-pale.hover,
.btn-pale:hover {
    border-color: rgba(255, 255, 255, 0.6);
}
.btn-pale.active,
.btn-pale.focus,
.btn-pale:active,
.btn-pale:focus {
    border-color: rgba(255, 255, 255, 0.6);
}
.btn-telegram {
    background: #27a7e9;
    color: #fff;
    transition: background 250ms, color 250ms;
    border-width: 0;
}
.btn-telegram > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-telegram:hover {
    background: #098fd4;
    color: #fff;
}
.btn-telegram:active,
.btn-telegram:focus {
    background: #119de6;
    color: #fff;
}
.btn-telegram .btn-loader-overlay {
    background-color: #27a7e9;
    color: #fff;
}
.btn-text {
    background: 0 0;
    color: rgba(255, 255, 255, 0.6);
    transition: background 250ms, color 250ms;
    padding: 0;
}
.btn-text > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-text:hover {
    background: 0 0;
    color: rgba(255, 255, 255, 0.8);
}
.btn-text:active,
.btn-text:focus {
    background: 0 0;
    color: rgba(255, 255, 255, 0.8);
}
.btn-text .btn-loader-overlay {
    background-color: transparent;
    color: rgba(255, 255, 255, 0.8);
}
.btn-default-filled {
    background: rgba(255, 255, 255, 0.8);
    color: #000;
    transition: background 250ms, color 250ms;
}
.btn-default-filled > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-default-filled:hover {
    background: rgba(255, 255, 255, 0.6);
    color: #000;
}
.btn-default-filled:active,
.btn-default-filled:focus {
    background: #fff;
    color: #000;
}
.btn-default-filled .btn-loader-overlay {
    background-color: rgba(255, 255, 255, 0.8);
    color: #000;
}
.btn-default-outline {
    background: 0 0;
    color: #fff;
    transition: background 250ms, color 250ms;
    border-color: #343437;
}
.btn-default-outline > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-default-outline:hover {
    background: #000;
    color: #fff;
}
.btn-default-outline:active,
.btn-default-outline:focus {
    background: #343437;
    color: #fff;
}
.btn-default-outline .btn-loader-overlay {
    background-color: transparent;
    color: #fff;
}
.btn-default-outline.hover,
.btn-default-outline:hover {
    border-color: #424248;
}
.btn-default-outline.active,
.btn-default-outline.focus,
.btn-default-outline:active,
.btn-default-outline:focus {
    border-color: #343437;
}
.btn-second {
    background: 0 0;
    color: rgba(255, 255, 255, 0.8);
    transition: background 250ms, color 250ms;
    border-color: rgba(255, 255, 255, 0.4);
}
.btn-second > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-second:hover {
    background: 0 0;
    color: #fff;
}
.btn-second:active,
.btn-second:focus {
    background: 0 0;
    color: #fff;
}
.btn-second .btn-loader-overlay {
    background-color: transparent;
    color: #fff;
}
.btn-second.hover,
.btn-second:hover {
    border-color: rgba(255, 255, 255, 0.6);
}
.btn-second.active,
.btn-second.focus,
.btn-second:active,
.btn-second:focus {
    border-color: #fff;
}
.btn-gray-ds {
    background: #424248;
    color: #fff;
    transition: background 250ms, color 250ms;
    border-width: 0;
}
.btn-gray-ds > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-gray-ds:hover {
    background: #5f5f5f;
    color: #fff;
}
.btn-gray-ds:active,
.btn-gray-ds:focus {
    background: #525252;
    color: #fff;
}
.btn-gray-ds .btn-loader-overlay {
    background-color: #424248;
    color: #fff;
}
.btn-loading.btn-loading {
    color: transparent;
    opacity: 1;
    position: relative;
}
.btn-loading.btn-loading > svg {
    opacity: 0;
}
.btn-loader-overlay {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.btn-dark-blue {
    background: #2a244b;
    color: #fff;
    transition: background 250ms, color 250ms;
}
.btn-dark-blue > .icon {
    transition: fill 250ms, color 250ms;
}
.btn-dark-blue:hover {
    background: #d97706;
    color: #fff;
}
.btn-dark-blue:active,
.btn-dark-blue:focus {
    background: #f59e0b;
    color: #fff;
}
.btn-dark-blue .btn-loader-overlay {
    background-color: #2a244b;
    color: #fff;
}
.pwa-install-notification {
    align-items: center;
    animation: opacity-fade-show 0.5s;
    background: #232325;
    display: flex;
    left: 0;
    padding: 10px 15px;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 105;
}
.pwa-install-notification .btn {
    margin-bottom: 0;
    margin-left: 10px;
    padding: 0 12px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
.pwa-install-notification .close-button {
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    margin: 0 11px 0 0;
    opacity: 0.5;
    padding: 4px;
}
.pwa-install-notification-title {
    color: #fff;
    font-weight: 700;
    font-size: 0.875rem;
}
.pwa-install-notification-description {
    color: #fff;
    margin-top: 4px;
    opacity: 0.8;
    font-size: 0.75rem;
    line-height: 1.063rem;
}
.pwa-install-notification-body {
    justify-content: space-between;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.pwa-install-notification-body,
.pwa-install-notification-content,
.pwa-install-notification-logo {
    align-items: center;
    display: flex;
    flex-direction: row;
}
.pwa-install-notification-logo {
    height: 48px;
    justify-content: center;
    margin-right: 10px;
    width: 48px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
.pwa-install-notification-logo.transparent {
    background: 0 0;
}
.pwa-install-notification-logo img,
.pwa-install-popup-logo img {
    height: 100%;
    width: 100%;
}
.post-page {
    column-gap: 20px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0 auto;
    position: relative;
}
.post-page__post {
    width: 642px;
}
.post-page__comments {
    max-width: 100%;
    position: relative;
    width: 300px;
}
.post-page .comments-gallery {
    height: 100%;
}
.post-page .comments-gallery__wrapper {
    border-radius: 16px;
    height: 100%;
}
.post-page .comments-gallery__count {
    border-top: 0;
}
@media screen and (max-width: 1279px) {
    .post-page .comments-gallery__wrapper {
        position: relative;
    }
    .post-page__comments {
        width: 642px;
    }
}
@media screen and (max-width: 639px) {
    .post-page {
        margin: 0-16px;
    }
}
.signup-page {
    max-width: 320px;
}
.landing-webcam-page__wrapper {
    align-items: center;
    display: flex;
    min-height: 100vh;
    width: 100%;
}
.landing-webcam-page__info {
    flex: 1;
    margin: 0 130px 0 0;
    padding: 10px 0 0;
}
.landing-webcam-page__animation--move-left {
    animation: landing-opacity-move-left-delay 0.6s;
}
.landing-webcam-page__animation--fade-in {
    animation: landing-opacity-zoom-fade-show-delay 1s;
}
.landing-webcam-page__title {
    font-size: 40px;
    font-weight: 500;
    line-height: 46px;
    margin: 22px 0 0;
}
.landing-webcam-page__description {
    color: #a0a0a1;
    font-size: 16px;
    line-height: 24px;
    margin: 20px 0 0;
}
.landing-webcam-page__benefit-list {
    font-size: 18px;
    font-weight: 400;
    line-height: 20px;
    margin: 58px 0 20px;
}
.landing-webcam-page__benefit {
    color: #a0a0a1;
    margin: 22px 0;
    padding: 0 0 0 44px;
    position: relative;
}
.landing-webcam-page__benefit-icon {
    color: #f59e0b;
    left: 0;
    position: absolute;
    top: 0;
}
.landing-webcam-page__content {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 0 auto;
    max-width: 1280px;
    padding: 20px 40px;
    width: 100%;
}
.landing-webcam-page__right {
    display: flex;
    justify-content: center;
}
.landing-webcam-page__form {
    max-width: 100%;
    width: 384px;
}
@media screen and (max-width: 1023px) {
    .landing-webcam-page__info {
        margin: 80px 0 0;
        padding: 0;
    }
    .landing-webcam-page__content {
        display: block;
        padding: 0 24px 20px;
    }
    .landing-webcam-page__title {
        font-size: 32px;
        font-weight: 700;
        line-height: 39px;
    }
    .landing-webcam-page__right {
        margin: 20px 0 0;
    }
}
@media screen and (max-width: 479px) {
    .landing-webcam-page__logo {
        width: 222px;
    }
    .landing-webcam-page__title {
        margin: 0;
    }
    .landing-webcam-page__description {
        font-size: 14px;
        line-height: 24px;
    }
}
@media screen and (max-width: 320px) {
    .landing-webcam-page__content {
        padding: 20px 10px;
    }
}
.confirm-email-page {
    margin-bottom: 100px;
    margin-top: 100px;
    max-width: 600px;
    padding-bottom: 0;
    text-align: center;
}
.confirm-email-page .confirm-email-description {
    line-height: 34px;
    margin-bottom: 30px;
    margin-top: 25px;
    font-size: 1.75rem;
}
.confirm-email-page .confirm-email-actions {
    margin-top: 10px;
}
.confirm-email-page .confirm-email-actions > .btn {
    padding: 0 30px;
}
.confirm-email-page .icon-wrong {
    fill: #eab744;
}
.confirm-email-page .icon-error {
    fill: #fa7055;
}
@media screen and (max-width: 480px) {
    .confirm-email-page {
        margin-bottom: 20px;
        margin-top: 20px;
    }
}
.unsubscribe-page {
    display: flex;
    flex-direction: column;
}
.unsubscribe-page .header {
    font-weight: 700;
    margin: 20px;
    font-size: 1.25rem;
    line-height: 1.375rem;
}
.unsubscribe-page .description {
    margin-bottom: 10px;
    font-size: 0.813rem;
    line-height: 1rem;
}
.unsubscribe-page .subscription {
    font-weight: 700;
    margin-bottom: 32px;
    font-size: 0.938rem;
    line-height: 1.125rem;
}
.unsubscribe-page .subscription.font-weight-normal {
    font-weight: 400;
}
.unsubscribe-page .btn {
    margin-bottom: 32px;
}
.unsubscribe-page .footer {
    align-self: center;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
    color: rgba(255, 255, 255, 0.8);
    padding: 20px 40px;
    font-size: 0.75rem;
    line-height: 0.875rem;
}
.unsubscribe-page .footer .btn {
    margin-top: 20px;
}
.subscriptions-page__navigation {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 48px;
    justify-content: flex-start;
}
.subscriptions-page__link {
    font-size: 32px;
    font-weight: 700;
}
.subscriptions-page__link--active {
    color: #fff;
}
.subscriptions-page__link-icon {
    margin-right: 20px;
}
.user-photo-upload-menu-modal__content {
    max-width: 100%;
    width: 500px;
}
.user-photo-upload-menu-modal__camera {
    display: flex;
    max-width: 100%;
    min-height: min(380px, 50vh);
    padding: 20px;
    width: 500px;
}
.user-photo-upload-menu-modal__title {
    font-size: 16px;
    font-weight: 500;
}
.user-photo-upload-menu-modal .error {
    background-color: #603838;
    color: #fff;
    padding: 10px;
    text-align: center;
}
.user-photo-upload-menu-modal .divider {
    background-color: rgba(248, 248, 248, 0.05);
    height: 2px;
    margin: 24px 0;
    width: 100%;
}
.user-photo-upload-menu-modal .footer {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
}
.user-photo-upload-menu-modal .limits-description {
    color: #bfbfbf;
    left: 0;
    margin-top: 10px;
    position: absolute;
    right: 0;
    text-align: center;
    top: 100%;
    font-size: 0.75rem;
}
@media screen and (max-width: 479px) {
    .user-photo-upload-menu-modal .cA {
        font-size: 1.125rem;
        line-height: 1.375rem;
    }
    .user-photo-upload-menu-modal .panes {
        margin-top: 20px;
    }
    .user-photo-upload-menu-modal .panes .pane {
        padding: 22.5px 0;
    }
    .user-photo-upload-menu-modal .divider {
        height: 1px;
        margin: 20px 0;
    }
}
.panes {
    margin-top: 24px;
    overflow: hidden;
    text-align: center;
    border-radius: 4px;
}
.panes > .pane {
    align-items: center;
    background-color: #424248;
    background-size: cover;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 10px;
    min-width: calc(50% - 0.75rem);
    padding: 42.5px 0;
    position: relative;
    width: 100%;
}
.panes > .pane.is-pending > :not(.loader) {
    opacity: 0.33;
    pointer-events: none;
}
.panes > .pane:first-child {
    margin-left: 0;
}
.panes > .pane:last-child {
    margin-right: 0;
}
.panes > .pane > .pane-icon {
    display: flex;
    flex-direction: row;
    margin-bottom: 10px;
}
.panes > .pane > .pane-icon > svg {
    fill: #ccc;
    height: 32px;
    margin: 0;
    width: auto;
}
.panes > .pane > input[type="file"] {
    display: none;
}
.header-top,
.header-top .container {
    display: flex;
    width: 100%;
    max-width: 1480px;
    margin: 0 auto;    
}
.header-top {
    background: #050506;
    box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.15);
    height: 56px;
    left: 0;
    position: fixed;
    right: 0;
    top: var(--pwa-notification-height);
    transition: top 0.3s;
    z-index: 105;
    flex-direction: row;
}
.header-top--hidden {
    top: calc(-56px + var(--pwa-notification-height));
}
@media screen and (max-width: 479px) {
    .header-top-logo {
        margin-left: 1.125rem;
    }
}
.header-top__story {
    position: absolute;
    right: 24px;
    top: 80px;
    z-index: 1;
}
.header-top__back {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    margin: 0 6px 0 16px;
    min-width: 24px;
    width: 24px;
}
.header-top .container {
    align-items: center;
    justify-content: space-between;
    margin: 0 auto;
    position: relative;
}
.header-top .container .dropdown-link.active {
    background-color: #1b1b1d;
}
.header-top .container .dropdown-link:hover,
.header-top .container .nav-link:hover a {

    color: #fff;
    border-radius: 10px;
}
.header-top .container .dropdown-link.active,
.header-top .container .link.active,
.header-top .container .nav-link .active {
    color: #fff;
}
.header-top .container .accent {
    font-weight: 700;
}
.header-top .container .icon-dot {
    fill: #9fe20d;
    margin-right: 7px;
}
.header-top .container .icon-best-models {
    margin-right: 8px;
}
.header-top .container .icon-menu {
    margin: 0;
}
@media screen and (max-width: 1599px) {
    .header-top .container nav.nav-right {
        padding-right: 0;
    }
}
.header-top .icon-dot {
    height: 9px;
    width: 9px;
}
@media screen and (max-width: 479px) {
    .header-top .container {
        padding: 0;
    }
    .header-top .container nav.nav-left,
    .header-top .container nav.nav-right {
        flex: 1 1 50%;
    }
}
@media screen and (min-width: 1024px) {
    .header-top--hidden {
        top: 0;
    }
}
.header-top__create-menu {
    left: 0;
    margin-top: 20px;
    position: absolute;
    top: 100%;
}
@media screen and (max-width: 1023px) {
    .header-top__create-menu {
        left: 50%;
        margin: 0;
        position: fixed;
        top: calc(56px + var(--pwa-notification-height));
        transform: translateX(-50%);
    }
}
.header-top__create-post-button-wrapper {
    margin: 0 16px 0 32px;
    position: relative;
}
.header-top .header-top__create-post-button {
    font-size: 15px;
    font-weight: 400;
    padding: 0 16px;
}
.header-top .header-top__create-post-button .create-post-button__title {
    display: none;
}
@media screen and (min-width: 1024px) {
    .header-top .header-top__create-post-button .create-post-button__title {
        display: inline;
        margin-left: 12px;
    }
}
@media screen and (max-width: 1023px) {
    .header-top .header-top__create-post-button {
        border-radius: 6px;
        height: 24px;
        padding: 0;
        width: 24px;
    }
}
@media screen and (max-width: 479px) {
    .header-top .header-user-menu {
        max-width: 56px;
        width: 56px;
    }
    .header-top .header-user-menu--guest {
        margin-right: 0;
        max-width: none;
        width: auto;
    }
}
.main-layout__wrapper > header {
    height: 56px;
    min-height: 56px;
}
.nav-left {
    flex: 0;
    position: relative;
    z-index: 2;
}
.nav-right {
    justify-content: flex-end;
    z-index: 2;
}
.nav-left,
.nav-right {
    align-items: center;
    align-self: stretch;
    display: flex;
    flex-direction: row;
}
.header-user-menu {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    margin-left: 0;
    width: 68px;
}
.header-user-menu--guest {
    margin: 0 20px;
    width: auto;
}
.nav-center {
    display: flex;
    justify-content: flex-start;
    margin: 0 0 0 192px;
    padding: 0 190px 0 0;
    position: absolute;
}
@media screen and (min-width: 1280px) {
    .nav-center {
        padding: 0;
    }
}
.top-menu__link {
    align-items: center;
    color: #cfcfd0;
    display: inline-flex;
    font-size: 15px;
    height: 56px;
    margin: 0 16px;
    position: relative;
}
.top-menu__link--split {
    margin-left: 32px;
}
.top-menu__link--split::after {
    background: rgba(255, 255, 255, 0.1);
    bottom: 12px;
    content: "";
    left: -24px;
    position: absolute;
    top: 12px;
    width: 1px;
}
.top-menu__link:hover {
    color: #fff;
}
.top-menu__link.active::before {
    background: var(--primary-border);
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%;
}
.top-menu__gift-icon {
    margin: 0 8px 0 0;
}
.lazy-component-error {
    color: #f44;
    padding: 10px;
    text-align: center;
    transition: all 120msms ease-in-out 0s;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.account-disabled-page {
    max-width: 360px;
    padding: 70px 0;
    text-align: center;
}
.account-disabled-page .icon-account-disabled,
.account-disabled-page .icon-mail-filled {
    color: #d8d8d8;
    margin: 20px;
}
.account-disabled-page .account-disabled-header {
    color: #fff;
    font-weight: 500;
    line-height: 34px;
    margin-bottom: 10px;
    font-size: 1.75rem;
}
.account-disabled-page .account-disabled-description {
    color: #8d8d8d;
    line-height: 20px;
    margin-bottom: 30px;
    font-size: 0.875rem;
}
.account-disabled-page.model-deleted-page {
    max-width: inherit;
}
.account-disabled-page.model-deleted-page .deleted-wrapper {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding-bottom: 55px;
}
@media screen and (max-width: 480px) {
    .account-disabled-page {
        max-width: 320px;
    }
    .account-disabled-page .btn {
        margin-bottom: 10px;
        margin-right: 0;
    }
}
.icon {
    pointer-events: none;
    vertical-align: middle;
}
.icon--default-size {
    height: 1rem;
    width: 1rem;
}
.icon--top-2 {
    position: relative;
    top: -2px;
}
.icon__back {
    align-items: center;
    background: #343437;
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    min-width: 24px;
    padding: 0 2px 0 0;
    width: 24px;
}
.icon__back--space--regular {
    margin: 0 16px 0 0;
}
.icon__back--space--big {
    margin: 0 22px 0 0;
}
.verification-icon-shadow {
    background: radial-gradient(50% 50%at 50% 50%, rgba(81, 53, 255, 0.2) 0, rgba(27, 27, 29, 0) 100%);
    border-radius: 50%;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transform: scale(3);
    width: 100%;
}
.cj--mobile,
.cj__root > body {
    overscroll-behavior-x: none;
    overscroll-behavior-y: none;
}
.cj__root--mobile > body {
    position: fixed;
}
.cj--mobile {
    background: #000;
    bottom: 0;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 500;
}
.cj--mobile .video-player--playing .video-player__play {
    display: none;
}
.cj--mobile .video-player__video {
    background: 0 0;
    opacity: 1;
    pointer-events: auto;
}
.cj--mobile .cj__comments {
    animation: move-bottom-right 0.25s;
    background: rgba(0, 0, 0, 0.2);
}
.cj--mobile .image-swiper__points {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    bottom: 100%;
    height: 32px;
    justify-content: center;
    left: 50%;
    padding: 0 16px;
    transform: translateX(-50%);
    width: auto;
}
.cj--mobile-vertical .image-swiper__points,
.select .native-select > option {
    opacity: 0;
}
.cj__vertical-single-row {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    contain: strict;
    height: inherit;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.cj__root-showing.media-gallery__root {
    overflow: initial;
}
.cj__root-showing.media-gallery__root > body,
.de__root-showing > body {
    overflow: initial;
    position: initial;
}
.cj__comments,
.cj__user-tags {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.cj__vertical-controls {
    bottom: 38px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    position: absolute;
    right: 8px;
    z-index: 10;
}
.cj__vertical-controls--video {
    bottom: 82px;
}
.cj__vertical-controls .tile-button {
    background: 0 0;
    color: #fff;
    flex-direction: column;
    height: auto;
    min-width: 40px;
    padding: 6px 8px;
}
.cj__vertical-controls .tile-button:hover {
    background: 0 0;
}
.cj__vertical-controls .tile-button::before {
    background: radial-gradient(50% 50%at 50% 50%, rgba(0, 0, 0, 0.1) 0, transparent 100%);
    border-radius: 50%;
    content: "";
    height: 64px;
    position: absolute;
    top: 0;
    width: 64px;
    z-index: -1;
}
.cj__vertical-controls .tile-button .tile-button__text {
    font-size: 10px;
    font-weight: 500;
    margin: 2px 0 0;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}
.cj__vertical-controls .tile-button__count,
.pwa-install-popup-steps ul {
    margin: 0;
}
.cj__controls {
    display: flex;
}
.cj__vertical-controls,
.cj__vertical-user {
    opacity: 0;
    pointer-events: none;
}
.cj__stub-model-end {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 20px;
    height: 100%;
    justify-content: center;
    text-align: center;
}
.cj__arrow-thumb {
    align-items: center;
    background: #232325;
    display: flex;
    flex: 1;
    height: 100%;
    justify-content: center;
    transition: background 0.3s;
}
.cj__arrow-thumb--prev {
    transform: rotate(180deg);
}
.cj__arrow-thumb:hover {
    background: #343437;
}
.cj__toast-flash {
    align-items: center;
    display: flex;
    gap: 18px;
}
.cj__toast-flash-text {
    color: #cfcfd0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cj__user-vertical {
    bottom: 84px;
    left: 16px;
    position: absolute;
    z-index: 2;
}
.cj__icon-album {
    display: block;
    height: 32px;
    width: 32px;
}
.cj--aside-panel .media-gallery--mobile-portrait .media-gallery__close,
.cj--aside-panel .media-gallery--mobile-portrait .media-gallery__info {
    display: none;
}
.cj__lock {
    align-items: center;
    background: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%);
    color: #fff;
    display: flex;
    height: 100%;
    justify-content: center;
    width: 100%;
}
.cj__user {
    bottom: 86px;
    left: 20px;
    position: fixed;
    z-index: 4;
}
.cj__user-card {
    align-items: center;
    column-gap: 14px;
    display: flex;
    position: relative;
}
.cj__top-shadow {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0, transparent 100%);
    height: 64px;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
}
.cj__vertical-viewer-close {
    align-items: center;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    height: 48px;
    justify-content: center;
    position: fixed;
    right: 0;
    top: 0;
    width: 48px;
    z-index: 1;
}
.cj__vertical-viewer-controls {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    z-index: 2;
}
.cj--controls-visible .image-swiper__points,
.cj--controls-visible .cj__controls,
.cj--controls-visible .cj__vertical-controls,
.cj--controls-visible .cj__vertical-user,
.cj--controls-visible .cj__vertical-viewer-controls,
.cj--controls-visible .video-player__controls,
.cj--controls-visible .video-player__play {
    opacity: 1;
    pointer-events: auto;
}
.cj__vertical-user {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);
    bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    left: 0;
    padding: 20px 66px 42px 16px;
    position: absolute;
    right: 0;
    z-index: 2;
}
.cj__vertical-user--video {
    background: 0 0;
    bottom: 78px;
    padding-bottom: 0;
}
.cj__vertical-user-top {
    align-items: center;
    display: flex;
    gap: 20px;
}
.cj__vertical-user-follow {
    align-items: center;
    background: 0 0;
    border: 2px solid rgba(255, 255, 255, 0.8);
    border-radius: 8px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 12px;
    font-weight: 500;
    height: 24px;
    padding: 0 10px;
    white-space: nowrap;
}
.cj__vertical-user-follow--active {
    background: #fff;
    border-color: #fff;
    color: #000;
}
.cj__vertical-user-follow--joined {
    pointer-events: none;
}
.cj__vertical-user-follow--join-paid {
    background: #d97706;
    border-color: #d97706;
    color: #fff;
}
.cj__vertical-user-album {
    align-items: center;
    color: #cfcfd0;
    display: flex;
    gap: 4px;
    max-width: 70vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cj__vertical-user-body {
    -webkit-box-orient: vertical;
    color: #e7e7e7;
    display: -webkit-box;
    font-size: 14px;
    font-weight: 400;
    -webkit-line-clamp: 2;
    max-width: 340px;
    overflow: hidden;
    word-break: break-all;
}
.cj__vertical-user-hashtag {
    color: #fff;
    font-weight: 500;
    line-height: 140%;
    word-break: normal;
}
.cj__on-boarding {
    align-items: center;
    background: rgba(0, 0, 0, 0.7);
    bottom: 0;
    display: flex;
    font-size: 18px;
    font-weight: 400;
    justify-content: center;
    line-height: 27px;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 20;
}
.cj__on-boarding-icon {
    color: #a0a0a1;
}
.cj__on-boarding-icon--left {
    transform: rotate(180deg);
}
.cj__on-boarding-icon--top {
    transform: rotate(-90deg);
}
.cj__on-boarding-icon--bottom {
    transform: rotate(90deg);
}
.cj__on-boarding-bottom {
    bottom: 56px;
    position: absolute;
    right: 16px;
    text-align: right;
}
.cj__on-boarding-center {
    text-align: center;
}
.cj__on-boarding-center-text {
    align-items: center;
    display: flex;
    gap: 20px;
    justify-content: space-between;
    margin: 0 0 20px;
}
.cj__on-boarding-top {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: absolute;
    right: 48px;
    text-align: right;
    top: 80px;
}
.cj__on-boarding-bold {
    display: block;
    font-weight: 700;
}
.media-gallery--desktop .cj__comments {
    animation: move-from-right 0.25s;
}
.media-gallery--desktop .comments-gallery__wrapper {
    border-radius: 16px;
    height: 100%;
}
.media-gallery--desktop .comments-gallery__close {
    display: none;
}
.media-gallery--desktop .tile-button {
    margin: 0 0 0 12px;
}
.media-gallery--desktop .cj__user {
    bottom: auto;
    left: 24px;
    top: 30px;
}
.media-gallery--mobile-portrait .comments-gallery__footer {
    padding-bottom: max(12px, env(safe-area-inset-bottom));
}
.media-gallery--mobile-portrait .cj__comments,
.media-gallery--mobile-portrait .cj__user-tags {
    animation: move-bottom-right 0.25s;
}
.media-gallery--mobile-portrait .cj__user {
    bottom: 75px;
    left: 10px;
    position: fixed;
    top: auto;
    z-index: 4;
}
.media-gallery--mobile-portrait .cj__user--video {
    bottom: 140px;
}
.media-gallery--mobile-portrait .cj__controls {
    flex: 1;
    justify-content: space-between;
    left: -2px;
    position: relative;
}
.media-gallery--mobile-portrait .tile-button {
    background: 0 0;
    border-radius: 0;
    font-weight: 700;
    height: 36px;
    padding: 0 8px;
}
.media-gallery--mobile-portrait .tile-button:hover {
    background: 0 0;
}
.media-gallery--mobile-portrait .tile-button__text {
    display: none;
}
.media-gallery--mobile-portrait .tile-button__count {
    margin: 0 0 0 6px;
}
.cj--has-title .media-gallery--mobile-portrait .cj__user {
    bottom: 130px;
}
.media-gallery--mobile-landscape .cj__user {
    left: 10px;
    position: fixed;
    z-index: 4;
}
.media-gallery--mobile-landscape .cj__controls {
    filter: drop-shadow(0 0 4px rgba(0, 0, 0, 0.8));
    flex-direction: column;
    height: 100%;
    justify-content: center;
}
.media-gallery--mobile-landscape .tile-button {
    background: 0 0;
    border-radius: 0;
    color: #fff;
    flex-direction: row-reverse;
    font-weight: 700;
    height: 36px;
    padding: 0 8px;
}
.media-gallery--mobile-landscape .tile-button__count {
    margin: 0 6px 0 0;
}
.media-gallery--mobile-landscape .tile-button__text {
    display: none;
}
.dd {
    align-items: center;
    background: #232325;
    bottom: 0;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    justify-content: center;
    left: 0;
    min-height: 60px;
    padding: 10px 12px;
    position: fixed;
    width: 100%;
    z-index: 11;
    font-size: 0.813rem;
    line-height: 1.125rem;
}
.dd__icon-cookie {
    flex-shrink: 0;
}
.dd__description {
    line-height: normal;
    margin: 0 12px 0 15px;
}
@media screen and (max-width: 639px) {
    .dd__description {
        font-size: 11px;
    }
}
@media screen and (max-width: 479px) {
    .dd__description {
        font-size: 10px;
    }
}
@media screen and (max-width: 320px) {
    .dd__description {
        font-size: 9px;
    }
}
.dd__learn-more {
    color: #fff;
    opacity: 1;
}
@media (max-width: 479px) {
    .dd {
        bottom: 60px;
    }
}
.pwa-install-popup-wrapper {
    background: rgba(0, 0, 0, 0.8);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 210;
}
.pwa-install-popup {
    background-color: #3b3b3b;
    border-radius: 12px;
    bottom: 20px;
    color: #fff;
    left: 50%;
    max-width: 290px;
    padding: 38px 24px 20px;
    pointer-events: all;
    position: fixed;
    transform: translateX(-50%);
    width: 100%;
    z-index: 500;
}
.pwa-install-popup::before {
    border-style: solid;
    border-color: #3b3b3b transparent transparent;
    border-width: 8px 8px 0;
    content: "";
    height: 0;
    left: calc(50% - 8px);
    position: absolute;
    top: 100%;
    width: 0;
}
.pwa-install-popup .close-button {
    color: #f8f8f8;
    margin-right: 15px;
    opacity: 0.5;
    position: absolute;
    right: 0;
    top: 10px;
}
.pwa-install-popup .close-button .icon {
    fill: #f8f8f8;
    margin: 0;
}
.pwa-install-popup-title {
    font-weight: 700;
    margin: 8px 0;
    font-size: 1rem;
    line-height: 1.125rem;
}
.pwa-install-popup-description {
    margin: 8px 0;
    opacity: 0.6;
    font-size: 0.813rem;
    line-height: 1rem;
}
.pwa-install-popup-steps {
    font-size: 0.75rem;
    line-height: 1rem;
}
.pwa-install-popup-steps li {
    align-items: center;
    display: flex;
    padding: 8px 0;
}
.pwa-install-popup-steps .icon {
    color: #fff;
    fill: #fff;
    margin-left: 5px;
    margin-top: -5px;
}
.pwa-install-popup-logo {
    align-items: center;
    background: 0 0;
    border-radius: 13px;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.1);
    height: 48px;
    justify-content: center;
    position: absolute;
    top: 0;
    transform: translateY(-40%);
    width: 48px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
    display: flex;
    flex-direction: row;
}
.pwa-install-popup-logo .icon {
    margin: 0;
}
.toast-notifications {
    bottom: 16px;
    right: 12px;
    position: fixed;
    width: 362px;
    z-index: 1001;
}
@media screen and (max-width: 424px) {
    .toast-notifications {
        bottom: 20px;
        left: 16px;
        max-width: calc(100vw - 32px);
    }
}
.da {
    background: #111113;
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    z-index: 210;
}
.da--purple {
    background: #0d0711;
}
.da__navigation {
    align-items: center;
    color: #a0a0a1;
    display: flex;
    font-size: 11px;
    height: var(--tap-bar-height);
    justify-content: space-around;
    width: 100%;
}
.da__container {
    padding-bottom: env(safe-area-inset-bottom);
    transition: all 150ms linear;
}
.da__menu-item-button {
    background: 0 0;
    border: 0;
    font-size: inherit;
}
.da__create-post-button,
.da__menu-item-button {
    align-items: center;
    color: inherit;
    display: flex;
    flex: 1;
    flex-direction: column;
    padding: 0 8px;
    position: relative;
    transition: color 100ms linear;
    white-space: nowrap;
}
.da__create-post-button--active,
.da__create-post-button.active,
.da__create-post-button:active,
.da__menu-item-button--active,
.da__menu-item-button.active,
.da__menu-item-button:active {
    color: #fff;
}
.da__create-post-button--has-unread-notifications::after,
.da__menu-item-button--has-unread-notifications::after {
    background-color: #e12947;
    border: 3px solid #111113;
    border-radius: 10px;
    content: "";
    height: 10px;
    position: absolute;
    right: 18px;
    top: -6px;
    width: 10px;
}

.has-unread-msg {
    background-color: #fb0000f7;
    border-radius: 15px;
    font-size: 0.6rem;
    line-height: 15px;
    text-align: center;
    height: 15px;
    position: absolute;
    right: -20px;
    top: 21px;
    width: 15px;
}


.da__create-post-menu {
    bottom: var(--tap-bar-height);
    left: 50%;
    margin: 0 0 10px;
    position: fixed;
    transform: translateX(-50%);
}
.da__create-post-button {
    background: 0 0;
    border: 0;
    font-size: 11px;
}
.da__icon-outline {
    background: 0 0;
    border: 2px solid #d97706;
    border-radius: 6px;
    display: grid;
    height: 24px;
    margin-bottom: 4px;
    place-items: center;
    width: 24px;
}
.da__menu-item-icon {
    height: 20px;
    margin-bottom: 4px;
    width: 20px;
}
.db {
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 1001;
}
.db__content {
    animation: toast-flash-show 0.2s ease-in-out;
    background: #1b1b1d;
    border-radius: 20px;
    display: inline-block;
    margin: 0 auto;
    max-width: min(100vw - 32px, 400px);
    overflow: hidden;
    padding: 12px 18px;
    transform: translateY(64px);
}
.dc {
    color: #a0a0a1;
}
.dc .recaptcha {
    display: flex;
    justify-content: center;
    margin: 20px auto 0;
}
.user-feed-page__header {
    margin: 0 auto;
    max-width: calc(100vw - 32px);
    width: 642px;
}
.confirmation-modal-controls {
    display: flex;
    gap: 20px;
    justify-content: flex-end;
}
.confirmation-modal-description {
    color: #cfcfd0;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
    margin: 12px 0 20px;
}
.confirmation-modal-title {
    font-size: 18px;
    line-height: 22px;
    margin: 0 0 16px;
}
.confirmation-modal-btn-confirm {
    float: right;
}
.page-block {
    background-color: #1b1b1d;
    border: 0;
    padding: 20px;
    position: relative;
    border-radius: 4px;
}
.page-block::after {
    clear: both;
    content: "";
    display: table;
}
.page-block__title {
    font-weight: 500;
    margin: 0;
    font-size: 1rem;
}
.page-block.empty {
    opacity: 0.33;
}
.page {
    min-height: 120px;
    padding-bottom: 20px;
    padding-top: 60px;
    margin: 0 auto;
    max-width: 100%;
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
}
@media screen and (min-width: 1600px) {
    .page {
        max-width: 1388px;
        padding-left: 0;
        padding-right: 0;
        width: 1388px;
    }
}
.page__content {
    margin: 0 40px;
}
.page--limited-width {
    max-width: 1000px;
}
@media screen and (max-width: 1023px) {
    .page {
        padding-top: 32px;
    }
    .page__content {
        margin: 0;
    }
}
.page-header {
    margin: 0 0 30px;
}
.landing {
    display: flex;
    justify-content: center;
    position: relative;
    scroll-behavior: smooth;
}
.landing__main-arrow {
    bottom: 12px;
    cursor: pointer;
    left: 50%;
    margin-left: -18px;
    position: fixed;
    transition: opacity 1s;
}
.landing__main-arrow--hidden {
    opacity: 0;
    pointer-events: none;
}
.landing__content {
    max-width: 1400px;
    padding: 0 100px;
}
.landing__section {
    min-height: 100vh;
    padding-top: var(--pwa-sticky-header-height);
}
.landing__section-login {
    min-height: max(100vh, 800px);
    position: relative;
}
.landing__section-flex,
.landing__section-flex-center {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.landing__section-flex-center {
    justify-content: center;
}
.landing__footer-gradient {
    background: radial-gradient(74.17% 69.92%at 50% -6.37%, #3f1962 0, transparent 100%);
    bottom: 0;
    height: 155vh;
    pointer-events: none;
    position: absolute;
    transform: rotate(-180deg);
    width: 100%;
    z-index: -1;
}
.landing__top-gradient {
    background: radial-gradient(86.51% 96.48%at 92.2% 11.85%, #27053d 0, #050506 80.7%);
    height: 100vh;
    left: 0;
    min-height: 800px;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100vw;
    z-index: -1;
}
.landing__profile-card-wrapper {
    flex: 1;
    margin: 100px auto 84px;
    transform: translateY(-60px);
    width: 100%;
}
@media screen and (max-width: 1023px) {
    .landing {
        display: block;
    }
    .landing__content {
        padding: 0 40px;
    }
    .landing__section-login {
        width: auto;
    }
}
@media screen and (min-width: 768px) {
    .landing__nav_center {
        justify-content: flex-end;
    }
}
@media screen and (max-width: 767px) {
    .landing__nav-left {
        flex: 1 1 50%;
    }
    .landing__logo-wrapper {
        width: 100%;
    }
}
@media screen and (max-width: 639px) {
    .landing {
        margin: unset;
    }
    .landing__content {
        padding: 0 24px;
    }
    .landing__header {
        justify-content: space-between;
        padding-right: 10px;
    }
    .landing__nav-center {
        justify-content: flex-end;
    }
    .landing__section {
        min-height: unset;
    }
    .landing__section-flex {
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
    }
    .landing__section-login {
        flex-direction: column-reverse;
    }
    .landing__profile-card-wrapper {
        transform: translateY(0);
    }
}
.profile-card {
    align-items: center;
    border-radius: 44px;
    margin: 0 auto;
    max-width: 340px;
    padding: 24px;
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.profile-card--colored {
    background: linear-gradient(201.03deg, #2d0844 4.82%, transparent 97.07%);
}
.profile-card__border-gradient {
    position: absolute;
}
.profile-card__avatar-wrapper {
    margin-bottom: 16px;
}
.profile-card__text {
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 8px;
    margin-bottom: 24px;
    place-items: center;
}
.profile-card__description {
    color: rgba(255, 255, 255, 0.6);
    text-align: center;
}
.profile-card__button {
    margin-bottom: 24px;
    width: 100%;
}
.profile-card__hint {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: normal;
    color: rgba(255, 255, 255, 0.4);
    line-height: 16px;
    text-align: center;
    white-space: pre-wrap;
}
.avatar {
    align-items: center;
    border: var(--avatar-border-size) solid rgba(255, 255, 255, 0.1);
    border-radius: 30.75%;
    color: rgba(191, 191, 191, 0.5);
    display: inline-flex;
    font-size: 5px;
    height: var(--avatar-size);
    justify-content: center;
    line-height: 1;
    min-width: var(--avatar-size);
    position: relative;
    text-align: center;
    text-decoration: none;
    text-transform: capitalize;
    transition: border-color 0.3s;
    vertical-align: middle;
    width: var(--avatar-size);
    -webkit-user-select: none;
    user-select: none;
}
.avatar--skeleton {
    background: rgba(255, 255, 255, 0.15);
}
.avatar:hover {
    border-color: #fff;
    text-decoration: none;
}
.avatar__img {
    align-items: center;
    background-color: #201e1e;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: inherit;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.avatar__img--dark::before {
    background: rgba(0, 0, 0, 0.8);
    border-radius: inherit;
    bottom: -1px;
    content: "";
    left: -1px;
    position: absolute;
    right: -1px;
    top: -1px;
}
.avatar__story-border {
    background: #5f5f67;
    border-radius: 33.75%;
    bottom: -7.5%;
    left: -7.5%;
    overflow: hidden;
    position: absolute;
    right: -7.5%;
    top: -7.5%;
}
.avatar__story-border::before {
    background: #050506;
    border-radius: 32.75%;
    bottom: 1px;
    content: "";
    left: 1px;
    position: absolute;
    right: 1px;
    top: 1px;
}
.avatar__story-border--active {
    background: linear-gradient(225deg, #c2410c 14.64%, #f59e0b 37.98%, #fcc217 85.36%);
}
.avatar__story-border--active::before {
    bottom: max(2.5%, 2px);
    left: max(2.5%, 2px);
    right: max(2.5%, 2px);
    top: max(2.5%, 2px);
}

.avatar__story-border--popular {
    background: linear-gradient(225deg, #d97706 14.64%, #f59e0b 37.98%, #d97706 85.36%);
}
.avatar__story-border--popular::before {
    bottom: max(2.5%, 2px);
    left: max(2.5%, 2px);
    right: max(2.5%, 2px);
    top: max(2.5%, 2px);
}

.avatar__story-border--add-story {
    background: linear-gradient(313deg, #1bff24 14.64%, #a9ff00 37.98%, #00ffde 85.36%);
}
.avatar__story-border--add-story::before {
    bottom: max(2.5%, 2px);
    left: max(2.5%, 2px);
    right: max(2.5%, 2px);
    top: max(2.5%, 2px);
}

.avatar .icon-user-deleted {
    fill: #424242;
    height: 70%;
    left: 50%;
    margin: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 70%;
}
.avatar .user-status-icon {
    height: 20%;
    left: -3%;
    position: absolute;
    text-align: left;
    top: -3%;
    width: 20%;
}
.avatar__edit-button {
    align-items: center;
    backdrop-filter: blur(3.2px);
    background: rgba(0, 0, 0, 0.4);
    border-radius: 50%;
    bottom: -7%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 35%;
    justify-content: center;
    position: absolute;
    right: -7%;
    width: 35%;
}
.avatar__edit-button--left {
    left: -7%;
    right: auto;
}
.avatar__edit-button--disabled {
    color: #707071;
    cursor: default;
}
.avatar__edit-button:hover {
    color: #f59e0b;
}
.avatar__edit-button .icon {
    height: 46%;
    width: 46%;
}
.avatar__moderation {
    align-items: center;
    background: rgba(252, 207, 73, 0.6);
    border-radius: inherit;
    bottom: 0;
    color: #000;
    display: flex;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
}
.avatar__moderation-icon {
    height: 30%;
    margin: 0 !important;
    width: 30%;
}
.landing-login-form {
    border-radius: 44px;
    flex: 1;
    margin: 60px 0;
    max-width: 368px;
    padding: 40px 24px;
    position: relative;
    z-index: 1;
}
.landing-login-form--colored {
    background: linear-gradient(201.03deg, #000 4.82%, transparent 97.07%);
}
.landing-login-form--dark {
    background: linear-gradient(201.03deg, #000 4.82%, transparent 97.07%), #020202;
    box-shadow: 0 0 80px #000, 0 0 80px #000, 0 0 80px #000, 0 0 80px #000;
}
.landing-login-form__header {
    align-items: center;
    display: flex;
    flex-direction: column;
}
.landing-login-form__title {
    font-size: 22px;
    font-weight: 700;
    line-height: 27px;
    margin: 0 0 8px;
}
.landing-login-form__description {
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    margin: 0 0 6px;
    opacity: 0.8;
}
.landing-login-form__sub-title {
    display: flex;
    margin: -18px auto 16px;
    max-width: 264px;
}
.landing-login-form__sub-title-left {
    align-items: center;
    display: flex;
    font-size: 24px;
    font-weight: 700;
    margin: 0 6px 0 0;
}
.landing-login-form__sub-title-right {
    color: #a0a0a1;
    font-size: 12px;
    line-height: 15px;
}
.landing-login-form__dollar {
    position: relative;
    top: -2px;
}
.landing-login-form__dollar .smile {
    height: 26px;
    margin: 0;
    width: 26px;
}
.landing-login-form__sub-footer {
    display: flex;
    justify-content: center;
    left: 0;
    margin: 30px 0 0;
    right: 0;
    top: 100%;
}
.landing-login-form__sub-footer-link {
    align-items: center;
    color: #707071;
    display: flex;
    justify-content: center;
}
.landing-login-form__sub-footer-link:hover {
    color: #fff;
}
.landing-login-form .avatar {
    height: 96px;
    margin: 0 0 26px;
    width: 96px;
}
@media screen and (max-width: 1023px) {
    .landing-login-form {
        padding: 32px 20px;
    }
}
@media screen and (max-width: 479px) {
    .landing-login-form .avatar {
        height: 64px;
        margin-bottom: 16px;
        width: 64px;
    }
}
@media screen and (max-width: 639px) {
    .landing-login-form {
        width: 100%;
    }
    .landing-login-form--with-margin {
        margin: 40px auto 84px;
        top: -180px;
    }
}
.subscription-tabs {
    margin: 0 0 40px;
}
.subscription-tabs__accent {
    opacity: 0.6;
}
.pill-control__item--active .subscription-tabs__accent {
    opacity: 1;
}
.login-wrapper .island-top-title {
    line-height: 1.875rem;
}
.login-wrapper .island {
    border-radius: 8px;
}
.login-wrapper.recaptcha-shown {
    max-width: 100%;
}
.login-wrapper.recaptcha-shown .island-small {
    min-width: 344px;
    width: auto;
}
.login-wrapper.recaptcha-shown .field-recaptcha {
    min-height: 78px;
}
@media screen and (max-width: 480px) {
    .login-wrapper.recaptcha-shown .island-small {
        min-width: 300px;
        width: 300px;
    }
}
.modal-ds-content .login-wrapper {
    background: linear-gradient(71.77deg, #11021a 1.36%, #26053a 17.56%, rgba(52, 5, 81, 0.97) 33%, rgba(53, 7, 81, 0.92) 43.39%, #1e052e 99.41%);
    max-width: 100%;
    padding: 24px 40px;
    width: 400px;
}
.signup-wrapper__model-invite-text {
    font-size: 34px;
    font-weight: 700;
    line-height: 120%;
    margin: 20px 0 0;
}
.signup-wrapper__model-invite-text .smile {
    height: 34px;
    margin: 0 0 0 10px;
    transform: rotate(-10deg);
    width: 34px;
}
.signup-wrapper__right-content .landing-webcam-page__benefit-list {
    font-size: 15px;
    font-weight: 500;
    line-height: 20px;
}
.signup-wrapper__right-content .landing-webcam-page__benefit {
    margin: 12px 0;
}
.signup-wrapper__right-content .landing-webcam-page__benefit-icon {
    transform: scale(0.9);
}
.being-redirected {
    align-items: center;
    display: flex;
    flex-direction: column;
}
.being-redirected .being-redirected-message {
    color: rgba(255, 255, 255, 0.6);
    font-weight: 500;
    margin: 30px 0 0;
}
.being-redirected .loader,
.my-collection .page-header .edit-button button {
    margin: 0;
}
.loader-container {
    bottom: 0;
    left: 0;
    padding-bottom: 60%;
    position: relative;
    right: 0;
    top: 0;
}
.loader-container--small {
    height: 400px;
    padding: 0;
}
.loader {
    pointer-events: none;
}
.loader.centered {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.loader.inline {
    display: inline-block;
    margin-right: 4px;
    vertical-align: middle;
}
.fading-circle {
    height: 66px;
    margin: 0 auto;
    position: relative;
    width: 66px;
}
.loader-circle {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.loader-circle-inner {
    animation: circleFadeDelay 960ms infinite ease-in-out both;
    background: #666;
    border-radius: 100%;
    height: 15%;
    margin: 0 auto;
    width: 15%;
}
.login-wrapper {
    width: 320px;
}
.login-wrapper .island-top {
    color: #fff;
    justify-content: center;
    margin-bottom: 32px;
    text-align: center;
}
.reset-password-form {
    display: flex;
    flex-direction: column;
    width: 320px;
}
.reset-password-form__field {
    margin-bottom: 16px;
}
.reset-password-form__input.input {
    background: rgba(255, 255, 255, 0.1);
    transition: all ease 0.25s;
    width: 100%;
}
.reset-password-form__submit-button {
    width: 100%;
}
.reset-password-form__terms-warning {
    align-self: center;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 32px;
    font-size: 0.813rem;
}
.reset-password-form__terms-warning .link {
    text-decoration-line: underline;
    transition: all ease 0.25s;
}
.reset-password-form__terms-warning .link:hover {
    color: rgba(255, 255, 255, 0.8);
}
.reset-password-form__login-suggestion {
    align-self: center;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 32px;
    transition: all ease 0.25s;
    font-size: 0.813rem;
}
.reset-password-form__login-suggestion .link {
    color: #f59e0b;
}
.reset-password-form__login-suggestion .link:hover {
    color: #d97706;
}
.forgot-password-wrapper {
    display: flex;
    flex-direction: column;
    max-width: 320px;
}
.forgot-password-wrapper__header {
    margin-bottom: 16px;
    text-align: center;
}
.forgot-password-wrapper__header-title {
    font-size: 22px;
    font-weight: 500;
    line-height: 27px;
}
.forgot-password-wrapper__header-description {
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    opacity: 0.6;
}
.forgot-password-wrapper__field {
    margin-bottom: 16px;
}
.forgot-password-wrapper .forgot-password-wrapper__input.input {
    background: rgba(255, 255, 255, 0.1);
    transition: all ease 0.25s;
    width: 100%;
}
.forgot-password-wrapper__actions {
    align-items: center;
    display: flex;
    flex-direction: column;
    width: 100%;
}
.forgot-password-wrapper__submit-button {
    width: 100%;
}
.forgot-password-wrapper__return-to-signin {
    align-items: center;
    display: flex;
    margin-top: 36px;
}
.forgot-password-wrapper__return-to-signin:hover {
    text-decoration: none;
}
.forgot-password-wrapper__return-to-signin .icon-wrapper {
    align-items: center;
    backdrop-filter: blur(10px);
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    height: 40px;
    justify-content: center;
    width: 40px;
}
.forgot-password-wrapper__return-to-signin .icon-wrapper .icon {
    fill: rgba(255, 255, 255, 0.6);
    margin: 0;
}
.forgot-password-wrapper__return-to-signin .title {
    color: rgba(255, 255, 255, 0.6);
    margin-left: 14px;
}
.forgot-password-wrapper .recaptcha {
    align-items: center;
    display: flex;
    justify-content: center;
    margin: 0 auto 14px;
}
.modal-ds-content .forgot-password-wrapper {
    background: linear-gradient(71.77deg, #11021a 1.36%, #26053a 17.56%, rgba(52, 5, 81, 0.97) 33%, rgba(53, 7, 81, 0.92) 43.39%, #1e052e 99.41%);
    max-width: 100%;
    padding: 24px 40px;
    width: 400px;
}
.document-safe-upload {
    display: flex;
    justify-content: center;
}
.my-collection {
    width: 100%;
}
.my-collection .videos-list-item .video-controls {
    z-index: 10;
}
.my-collection .my-collection-load-more {
    padding: 40px 0;
    text-align: center;
}
.my-collection .my-collection-content-header {
    font-weight: 500;
    margin: 30px 0 20px;
    opacity: 0.8;
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: row;
    font-size: 1rem;
}
.my-collection .my-collection-content-header .header-icon {
    align-self: flex-start;
    flex: 0 0 16px;
}
.my-collection .my-collection-content-header .name {
    flex: 1 1 auto;
    margin: 0 10px;
}
.my-collection .my-collection-content-header .access-mode-controls {
    align-self: flex-start;
    flex: 0 0 auto;
}
.my-collection .my-collection-content-header .access-mode .icon,
.my-collection .my-collection-content-header .count,
.my-collection .my-collection-content-header .video-access-viewer {
    opacity: 0.4;
}
.my-collection .my-collection-content-header .btn-restore {
    float: right;
    margin: 0 0-2px;
}
.my-collection .my-collection-content-header .delete-album-button {
    cursor: pointer;
    float: right;
    opacity: 0.9;
}
.my-collection .my-collection-content-header .delete-album-button:hover {
    opacity: 1;
}
.my-collection .my-collection-content-header .count {
    margin-left: 10px;
}
.my-collection .my-collection-content-header .icon {
    fill: #fff;
    margin: 0;
    vertical-align: -2px;
}
.my-collection .page-header .my-collection-title,
.set-password .form-input input {
    width: 100%;
}
.my-collection .page-header .avatar {
    height: 48px;
    margin: 0 8px 0 0;
    width: 48px;
}
.my-collection .page-header .icon-prev-small {
    fill: #fff;
    margin: 4px 10px 4px 5px;
    vertical-align: -1px;
}
.my-collection .page-header .icon-next-small {
    fill: #fff;
    margin: 2px 20px 0;
    vertical-align: 1px;
}
.my-collection .page-header .stud {
    flex-grow: 1;
}
.my-collection .page-header .edit-button {
    text-align: right;
}
.my-collection .page-footer {
    align-items: baseline;
    flex-wrap: wrap;
    margin-top: 40px;
    display: flex;
    flex-direction: row;
}
.my-collection .page-footer .btn {
    margin-bottom: 10px;
    margin-right: 20px;
}
.my-collection .page-footer .description {
    opacity: 0.4;
}
.my-collection .faded > :not(.access-mode-controls) {
    opacity: 0.4;
    pointer-events: none;
}
.my-collection .model-list-content.restricted {
    background-color: rgba(255, 255, 255, 0.06);
    padding: 50px;
}
.my-collection .model-list-content.restricted .photos-gallery {
    align-items: center;
    display: flex;
    flex-direction: row;
}
.my-collection .model-list-content.restricted .photos-gallery .description-icon .icon {
    fill: #fff;
    opacity: 0.9;
}
.my-collection .model-list-content.restricted .photos-gallery .description {
    flex: 1 1 auto;
    padding: 0 10px;
}
.my-collection .model-list-content.restricted .photos-gallery .action .btn {
    margin: 0;
}
.my-collection .loader-container {
    height: 100px;
    margin-top: 50px;
    padding: 0;
    position: relative;
}
.hr-content {
    border-top: 2px solid rgba(255, 255, 255, 0.15);
    margin: 60px 0 50px;
    width: 100%;
}
.hr-content--small {
    border-top-width: 1px;
    margin: 10px 0;
}
.hr-content--medium {
    margin: 40px 0;
}
@media screen and (max-width: 639px) {
    .hr-content {
        margin: 20px 0;
    }
    .hr-content--small {
        margin: 8px 0;
    }
}
.profile-page .page {
    padding-top: 0;
}
.header-logo-link {
    margin: 0 0 0 10px;
}
@media screen and (max-width: 479px) {
    .header-logo-link {
        margin-right: 0;
        padding: 0;
        width: 100%;
    }
    .header-logo-link .header-logo {
        margin-left: -2px;
        width: 100%;
    }
}
.set-password {
    background-color: #1b1b1d;
    border: 0;
    line-height: 18px;
    padding: 20px;
    text-align: left;
}
.set-password a:not(.btn) {
    color: #69a8e0;
    text-decoration: underline;
}
.set-password .set-password-title {
    line-height: 20px;
    font-size: 1.125rem;
}
.set-password .set-password-description {
    line-height: 18px;
    margin: 20px 0;
    font-size: 0.875rem;
}
.set-password .set-password-inputs {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
}
.set-password .set-password-controls {
    margin-top: 20px;
    display: flex;
    flex-direction: row;
}
.set-password .form-field {
    align-items: center;
    margin: 10px 0;
    width: 100%;
    display: flex;
    flex-direction: row;
}
.set-password .form-label {
    text-align: left;
    flex: 1;
    flex-basis: 30%;
    flex-grow: 1;
    flex-shrink: 0;
}
.set-password .form-input {
    flex: 1;
    flex-basis: 70%;
    flex-grow: 1;
    flex-shrink: 0;
}
@media screen and (max-width: 480px) {
    .set-password .form-field {
        align-items: stretch;
        flex-flow: column;
    }
    .set-password .form-field .form-label {
        margin-bottom: 10px;
    }
    .set-password .set-password-controls {
        justify-content: center;
    }

    .has-unread-msg {
        right: 25px;
        top: 2px;
    }

}
.header-dropdown,
.header-dropdown .dropdown-link {
    align-items: center;
    align-self: stretch;
    position: relative;
    display: flex;
    flex-direction: row;
}
.header-dropdown .dropdown-link {
    color: rgba(255, 255, 255, 0.6);
    display: block;
    padding: 0 18px;
    text-decoration: none;
    transition: color 120ms 120ms;
}
.header-dropdown .dropdown-link .icon-menu {
    margin: 0;
}
.header-dropdown .dropdown-link .dropdown-arrow {
    margin-left: 6px;
}
.header-dropdown .dropdown-link .dropdown-arrow .icon {
    fill: rgba(255, 255, 255, 0.6);
    height: 7px;
    margin: 0;
    width: 7px;
    transition: all 120msms ease-in-out 0s;
}
.header-dropdown .dropdown-link.mobile-nav-link .icon {
    margin: 0;
}
.header-dropdown__menu-alert {
    left: 14px;
    line-height: 0;
    position: absolute;
    top: 9px;
}
.header-dropdown .badge-alert-small {
    left: 12px;
    position: absolute;
    top: 9px;
}
.header-dropdown__avatar-badge {
    left: 7px;
    position: absolute;
    top: 9px;
}
.header-dropdown--active .dropdown-link {
    background-color: #1b1b1d;
}
.header-dropdown--active .dropdown-link .dropdown-arrow .icon {
    transform: rotate(180deg);
}
.header-dropdown-content-wrapper {
    animation: opacity-fade-show 0.2s forwards;
    left: 0;
    overflow: auto;
    position: absolute;
    top: calc(100% + 12px);
    z-index: 201;
}
.header-dropdown .scroll-bar-container {
    max-height: 60vh;
    max-width: 320px;
    overflow: hidden auto;
    z-index: 1;
}
.header-dropdown .scroll-bar-container:last-child {
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
}
@media screen and (max-width: 479px) {
    .header-dropdown.header-user-menu a.dropdown-link.mobile-nav-link {
        margin-right: 0;
        max-width: 56px;
        width: 56px;
    }
}
.header-dropdown-content {
    background-color: #232325;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    display: block;
    margin: 0;
    white-space: nowrap;
}
.header-dropdown-content li {
    min-width: 200px;
    position: relative;
}
.header-dropdown-content li > a:not(.btn),
.header-dropdown-content li > button {
    align-items: center;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    line-height: 42px;
    padding: 0 18px;
    text-decoration: none;
    text-overflow: ellipsis;
}
.header-dropdown-content li > a:not(.btn):hover,
.header-dropdown-content li > button:hover {
    background: #343437;
    color: #fff;
    transition: all 30ms ease-in-out 0s;
}
.header-dropdown-content li > button {
    border-radius: 0;
    justify-content: flex-start;
    width: 100%;
}
.header-dropdown-content li .user-menu-avatar-wrapper {
    color: rgba(255, 255, 255, 0.8);
    line-height: 42px;
    padding: 0 18px;
    text-decoration: none;
    text-overflow: ellipsis;
}
.header-dropdown-content li .user-menu-avatar-wrapper:hover {
    background: #343437;
    color: #fff;
    transition: all 30ms ease-in-out 0s;
}
.header-dropdown-content li .btn,
.header-dropdown-content li.list-item-wrapper .btn {
    margin: 0;
}
.header-dropdown-content li.list-item-wrapper {
    padding: 20px;
}
.header-dropdown-content li.list-item-wrapper .btn.btn-block:not(:last-child) {
    margin-bottom: 20px;
}
.header-user-menu.header-dropdown > .btn {
    margin: 0 12px 0 0;
    vertical-align: top;
}
.header-user-menu.header-dropdown > .btn:last-of-type {
    margin-right: 0;
}
.header-user-menu.header-dropdown > .dropdown-link {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
    padding: 0 12px;
    margin-top: 5px;
    margin-bottom: 5px;
}
.header-user-menu.header-dropdown > .dropdown-link > .avatar {
    font-size: 2px;
    margin-right: 2px;
}
.header-user-menu.header-dropdown ul > li .badge.badge-alert-small {
    left: 15px;
    position: absolute;
    top: 10px;
}
.header-user-menu.header-dropdown ul > li .user-menu-avatar-wrapper {
    align-items: flex-start;
    display: flex;
    margin: 0;
    max-width: 320px;
    padding: 8px 16px;
    width: 100%;
}
.header-user-menu.header-dropdown .header-dropdown-content-wrapper {
    left: auto;
    right: 0;
}
.header-user-menu.header-dropdown .header-dropdown-content-wrapper-bordered {
    border-radius: 16px;
}
.header-user-menu.header-dropdown .header-dropdown-content-wrapper:before {
    left: auto;
    right: 20px;
}
.header-user-menu.header-dropdown .header-dropdown-content {
    min-width: 310px;
    padding: 10px 0;
}
.header-user-menu.header-dropdown .icon-menu {
    height: 18px;
    width: 18px;
}
@media screen and (max-width: 1023px) {
    .header-user-menu.header-dropdown .header-dropdown-content-wrapper {
        right: 0;
    }
    .header-user-menu.header-dropdown .header-dropdown-content-wrapper:before {
        right: 8px;
    }
    .header-user-menu.header-dropdown .mobile-nav-link {
        margin-right: -0.75rem;
    }
}
.creator-lists-page__header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 42px;
}
.creator-lists-page__new-list-icon {
    height: 14px;
    margin-right: 10px;
    width: 14px;
}
.creator-list-page__header {
    display: flex;
    gap: 10px;
    justify-content: space-between;
}
.creator-list-page__header .bread-crumbs__item {
    display: grid;
    grid-auto-flow: column;
    word-break: break-all;
}
.creator-list-page__list-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.creator-list-page__header-actions {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}
.creator-list-page__plus-icon {
    margin-right: 12px;
}
.creators-onboarding-page__description {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 32px;
}
.agreement-popup__loader {
    font-size: 16px;
    font-weight: 400;
    left: 50%;
    line-height: 28px;
    opacity: 0.8;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.agreement-popup__loader > .loader-ds {
    margin: 0 auto 20px;
}
.agreement-popup__button-icon {
    margin: 0 8px 0 0;
}
.agreement-popup .modal-ds-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    padding: 20px;
}
.agreement-popup .modal-ds-footer {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    flex-direction: row;
    height: 82px;
    justify-content: space-between;
    max-height: 110px;
    padding: 20px;
}
.agreement-popup .modal-ds-body {
    height: 80%;
    margin: auto;
    max-width: 900px;
    width: 80%;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
.agreement-footer-bottom,
.agreement-footer-top {
    align-items: center;
    display: flex;
    justify-content: flex-end;
}
.agreement-footer-bottom {
    justify-content: space-between;
    flex-direction: row;
}
.agreement-popup-input {
    align-items: center;
    display: flex;
    font-weight: 500;
    margin-right: 10px;
    opacity: 0.6;
}
.agreement-text {
    margin: 10px 0;
}
.share-link {
    padding: 22px 24px;
}
.share-link--size--small {
    max-width: 414px;
}
.share-link__title {
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin: 0 0 12px;
}
.share-link__title > .smile {
    height: 24px;
    margin: 0 0 0 8px;
    position: relative;
    width: 24px;
}
.share-link__gift-icon {
    margin: 0 10px 0 0;
    position: relative;
    top: 4px;
}
.share-link__description {
    color: #a0a0a1;
    font-size: 13px;
    font-weight: 400;
    line-height: 18px;
}
.share-link__split {
    background: rgba(255, 255, 255, 0.1);
    height: 1px;
    margin: 12px 0;
}
.share-link__form {
    display: flex;
    margin: 16px 0 0;
}
.share-link__form .input-wrapper {
    flex: 1;
    margin: 0 12px 0 0;
}
.share-link__form .input-wrapper .input {
    padding: 0 12px;
}
@media screen and (max-width: 639px) {
    .share-link__form {
        flex-direction: column;
    }
    .share-link__form .input-wrapper {
        margin: 0 0 12px;
    }
}
.select-username-modal .site-logo {
    height: 30px;
    width: 130px;
}
.select-username-modal-wrapper {
    background-image: url(/assets/users/components/ui/SelectUsernameModal/images/bg.png);
    background-position: right;
    background-size: cover;
    border-radius: 8px;
    padding: 35px;
}
.select-username-modal-header {
    align-items: center;
    margin-bottom: 25px;
    display: flex;
    flex-direction: row;
}
.select-username-modal-header .icon-user-username {
    fill: #fff;
}
.select-username-modal-header .select-username-modal-title-wrapper {
    margin-left: 10px;
}
.select-username-modal-header .select-username-modal-title {
    color: #cfcfd0;
    font-size: 15px;
    line-height: 18px;
}
.select-username-modal-header .select-username-modal-sub-title {
    font-size: 22px;
    line-height: 27px;
}
.select-username-modal-body .select-username-modal-description {
    color: #a0a0a1;
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 25px;
    max-width: 350px;
}
.select-username-modal-body .select-username-modal-controls {
    display: flex;
    flex-direction: column;
}
.select-username-modal-body .select-username-modal-controls-input {
    position: relative;
}
.select-username-modal-body .input {
    min-width: 250px;
}
.select-username-modal-body .btn-default-filled {
    background: 0 0;
    border: 2px solid rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    color: rgba(255, 255, 255, 0.8);
    margin: 0 0 0 10px;
    padding: 0 35px;
}
.select-username-modal-body .btn-default-filled:hover:not(:disabled) {
    color: rgba(255, 255, 255, 0.9) !important;
}
.cG__content {
    margin: 0 20px;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
}
.cG__content-agreement {
    flex: 1;
    overflow: hidden;
    padding: 60px 60px 20px;
    position: relative;
    width: 100%;
}
.cG__text-block {
    color: #a0a0a1;
    line-height: 140%;
}
.cG__wrapper {
    aspect-ratio: 3/4;
    margin: 20px auto 0;
    max-width: 300px;
    position: relative;
}
.cG__photo-wrapper {
    align-items: center;
    aspect-ratio: 3/4;
    background: #000;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.cG__loading-shadow {
    background: rgba(0, 0, 0, 0.8);
    border-radius: 12px;
    bottom: 0;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.cG__shadow {
    background-repeat: no-repeat;
    background-size: contain;
    bottom: 0;
    left: 0;
    opacity: 0.6;
    position: absolute;
    top: 0;
    width: 100%;
}
.cG__oval-wrapper {
    align-items: center;
    aspect-ratio: 24/30;
    display: flex;
    justify-content: center;
    position: absolute;
    transform: translateY(-6.9%);
    width: 80%;
    z-index: 1;
}
.cG__face {
    display: block;
    height: 100%;
    width: 100%;
}
.cG__video {
    border-radius: 12px;
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    transition: opacity 0.6s;
    width: 100%;
}
.cG__video--flip {
    transform: scaleX(-1);
}
.cG__video--hidden {
    visibility: hidden;
}
.cG__video::-webkit-media-controls-start-playback-button {
    appearance: none;
    display: none !important;
}
.cG__loader-shaker {
    color: #67ed27;
    font-weight: 500;
    height: 0;
    margin: 0 auto;
    overflow: hidden;
    text-align: center;
    transition: height 0.3s;
    white-space: nowrap;
    width: 160px;
}
.cG__scanner-wrapper {
    bottom: 17%;
    clip-path: ellipse(50% 50%at 50% 50%);
    left: 10%;
    position: absolute;
    right: 10%;
    top: 7%;
    z-index: 2;
}
.cG__scanner {
    animation: scanner 2s infinite alternate;
    background: #67ed27;
    box-shadow: 0 0 9.33333px 1.86667px #67ed27;
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.cG__placeholder {
    bottom: 50%;
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    left: 50%;
    line-height: 20px;
    position: absolute;
    text-align: center;
    transform: translate(-50%, 10%);
    width: 130px;
    z-index: 1;
}
.cG__text-arrow {
    position: absolute;
    right: 55px;
    top: -45px;
}
.cG__scanner-dots {
    background: url(/assets/common/images/face-verification/face-dots.svg) no-repeat center;
    background-size: contain;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.cG__scanner-lines {
    background: url(/assets/common/images/face-verification/face-lines.svg) no-repeat center;
    background-size: contain;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.cG__example,
.cG__example-btn {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    position: absolute;
    top: 0;
}
.cG__example-btn {
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.8);
    height: 36px;
    padding: 0;
    right: 0;
    width: 36px;
    z-index: 1;
}
.cG__example-btn:hover {
    color: #fff;
}
.cG__example {
    aspect-ratio: 3/4;
    background-repeat: no-repeat;
    background-size: contain;
    border-radius: 12px;
    height: 100%;
    left: 0;
    opacity: 0;
    overflow: hidden;
    transform: scale(0);
    transform-origin: right top;
    transition: transform 0.3s, opacity 0.3s;
    width: 100%;
    z-index: 2;
}
.cG__example--opened {
    opacity: 1;
    transform: scale(1);
}
.cG__example-text {
    bottom: 8px;
    color: #fff;
    font-size: 14px;
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}
.cG__example-expand {
    align-items: center;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background: rgba(5, 5, 6, 0.4);
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 32px;
    justify-content: center;
    position: absolute;
    right: 8px;
    top: 8px;
    transition: background 0.3s;
    width: 32px;
}
.cG__photo-btn,
.cG__photo-controls {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    width: 100%;
}
.cG__photo-btn {
    background: 0 0;
    border: 2px solid #fff;
    border-radius: 50%;
    color: #fff;
    height: 48px;
    width: 48px;
}
.cG__photo-btn :disabled {
    opacity: 0.6;
    pointer-events: none;
}
.cG__photo-btn:hover > .icon-photo-3 {
    transform: scale(0.8);
}
.cG__photo-btn > .icon-photo-3 {
    transition: transform 0.3s;
}
.cG__tooltip {
    min-width: 320px;
}
.cG__tooltip-content {
    padding: 20px;
}
.cG__settings-btn,
.cG__swap-btn {
    align-items: center;
    background: #343437;
    border: 0;
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 32px;
    justify-content: center;
    position: absolute;
    width: 32px;
}
.cG__settings-btn {
    cursor: pointer;
    left: 20px;
}
.cG__settings-btn:hover {
    background: #424248;
}
.cG__swap-btn {
    padding: 0;
    right: 20px;
}
.cG__footer {
    align-items: flex-end;
    display: flex;
    height: 80px;
    padding: 20px;
    position: relative;
}
.cG__footer--submit {
    animation: opacity-fade-show-modal-strict 0.3s;
    justify-content: space-between;
}
.cG__footer--border::before {
    background: rgba(255, 255, 255, 0.05);
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.cG__nose,
.cG__nose-text {
    aspect-ratio: 1;
    height: 10%;
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    z-index: 1;
}
.cG__nose {
    background: url(/assets/common/images/face-verification/nose.svg) no-repeat;
    background-size: contain;
    border-radius: 50%;
}
.cG__nose--border::before {
    background: url(/assets/common/images/face-verification/donut.webp) no-repeat;
    background-size: cover;
    bottom: -100%;
    content: "";
    left: -100%;
    opacity: 0.4;
    position: absolute;
    right: -100%;
    top: -100%;
}
.cG__nose-text {
    display: flex;
    font-size: 14px;
    justify-content: center;
    left: 50%;
    right: 0;
    text-align: center;
    top: 30%;
}
.cG__close {
    align-items: center;
    background: 0 0;
    border: 0;
    color: #707071;
    cursor: pointer;
    display: none;
    height: 32px;
    justify-content: center;
    padding: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 32px;
}
.cG__close:hover,
.cG__faq:hover {
    color: #fff;
}
.cG__checkbox {
    display: flex;
    margin: 24px 0 0;
}
.cG__info {
    background: #232325;
    border-radius: 12px;
    color: #a0a0a1;
    display: flex;
    font-size: 14px;
    gap: 8px;
    line-height: 20px;
    margin: 20px 0 10px;
    padding: 10px 16px;
    text-align: left;
}
.cG__faq {
    color: #cfcfd0;
    display: flex;
    left: 4px;
    padding: 4px;
    position: absolute;
    top: 4px;
    z-index: 1;
}
.cG__attache-file {
    align-items: center;
    bottom: 4%;
    display: flex;
    flex-direction: column;
    gap: 5px;
    left: 0;
    opacity: 1;
    position: absolute;
    width: 100%;
    z-index: 2;
}
.cG__attache-file-button {
    background: 0 0;
    border: 0;
    color: #f59e0b;
    cursor: pointer;
    font-size: 14px;
    font-weight: 700;
    padding: 0;
}
@media (max-width: 639px), (max-height: 420px) {
    .cG__close {
        display: flex;
    }
}
@media (max-width: 479px) {
    .cG__checkbox {
        justify-content: center;
    }
    .cG__content-agreement {
        padding: 20px 50px;
    }
}
.cK__content {
    max-width: 100%;
    width: 1200px;
}
.upload-cover-video-modal.modal-ds-body {
    width: 400px;
}
.upload-cover-video-modal.modal-ds-body .modal-ds-content {
    padding: 14px 16px;
}
.upload-cover-video-modal .modal-content {
    background: #232325;
    padding: 10px;
    width: 600px;
}
.upload-cover-video-modal__filename {
    padding-bottom: 20px;
}
.upload-cover-video-modal__row {
    display: flex;
}
.upload-cover-video-modal__icon {
    align-items: center;
    background-color: rgba(255, 255, 255, 0.2);
    display: flex;
    height: 95px;
    justify-content: center;
    margin-right: 20px;
    width: 25%;
}
.upload-cover-video-modal__progress {
    width: 100%;
}
.upload-cover-video-modal__actions {
    border-top: 1px solid rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    margin: 10px -10px 0;
    padding: 10px 10px 0;
}
.upload-cover-video-modal__actions .btn {
    margin: 0;
}
.loader-ds {
    animation: loader-ds 1.4s linear infinite;
}
.loader-ds-default-color {
    color: #fff;
}
.loader-ds-circle {
    animation: loader-ds-circle 1.4s ease-in-out infinite;
    stroke-dasharray: 80px, 200px;
    stroke-dashoffset: 0;
}
.checkbox-ds {
    display: flex;
}
.checkbox-ds__box {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    position: relative;
    transition: border 0.3s;
}
.checkbox-ds__box--size--normal {
    border-radius: 6px;
    height: 24px;
    width: 24px;
}
.checkbox-ds__box--size--normal.checkbox-ds__box--theme--radio,
.checkbox-ds__box--size--small.checkbox-ds__box--theme--radio {
    border-radius: 50%;
}
.checkbox-ds__box--size--small {
    border-radius: 4px;
    height: 18px;
    width: 18px;
}
.checkbox-ds__box--theme--primary {
    border: 2px solid #707071;
    color: #fff;
}
.checkbox-ds__box--theme--white {
    border: 2px solid #fff;
    color: #000;
}
.checkbox-ds__box--theme--radio {
    border: 2px solid #707071;
}
.checkbox-ds__box--theme--radio:after {
    border-radius: 50%;
    content: "";
    display: none;
    height: 12px;
    width: 12px;
}
.checkbox-ds__box--checked.checkbox-ds__box--theme--primary {
    background: #d97706;
    border-color: #d97706;
}
.checkbox-ds__box--checked.checkbox-ds__box--theme--white {
    background: #fff;
}
.checkbox-ds__box--checked.checkbox-ds__box--theme--radio {
    border-color: #d97706;
}
.checkbox-ds__box--checked.checkbox-ds__box--theme--radio:after {
    background: #d97706;
    display: block;
}
.checkbox-ds__input,
input.checkbox,
input.radio {
    height: 0;
    opacity: 0;
    position: absolute;
    width: 0;
}
.checkbox-ds__icon {
    display: block;
    height: 14px;
    width: 14px;
}
.checkbox-ds__content {
    display: inline-block;
}
.checkbox-ds__content--size--normal {
    margin: 2px 0 0 6px;
}
.checkbox-ds__content--size--small {
    margin: 0 0 0 6px;
}
.input-wrapper,
.input-wrapper__text-wrapper {
    position: relative;
}
.input-wrapper .input-wrapper__password-button {
    cursor: pointer;
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}
.input-wrapper .input-wrapper__password-button .icon {
    fill: #808085;
}
.input {
    width: 100%;
}
.input.input--prefixed.input--prefixed {
    padding-left: calc(16px + 1em);
}
.input__prefix {
    font-size: 0.75rem;
    left: 12px;
    line-height: 100%;
    opacity: 0.4;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
.input__error {
    color: #fd3a5b;
    display: block;
    font-size: 13px;
    margin: 4px 0 0;
}
.input__multy-suggest {
    cursor: default;
    display: flex;
    text-align: left;
    width: 100%;
}
.input__multy-suggest-link {
    cursor: pointer;
    padding: 4px 8px;
}
.input.text-x-large {
    height: 44px;
}
input.checkbox,
input.radio {
    display: block;
}
input.checkbox + label,
input.radio + label {
    background-position: center left;
    background-repeat: no-repeat;
    cursor: pointer;
    display: inline-block;
    height: 18px;
    line-height: 18px;
    margin: 4px 0 3px;
    max-width: 100%;
    opacity: 0.9;
    overflow: hidden;
    padding-left: 24px;
    padding-top: 0;
    text-align: left;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
    width: auto;
    -webkit-user-select: none;
    user-select: none;
    font-size: 0.875rem;
}
input.checkbox:checked + label,
input.checkbox:focus + label,
input.checkbox:hover + label,
input.radio:checked + label,
input.radio:focus + label,
input.radio:hover + label {
    opacity: 1;
}
.checkbox + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='null' fill='%23fff' d='M8.55 8.55h82.9v82.9H8.55V8.55zM1 99h98V1H1v98z'/%3E%3C/svg%3E");
    background-size: 16px;
    color: #fff;
}
.checkbox:checked + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d60908'%3E%3Cpath d='M9.55 9.65H90.5V90.6H9.55V9.65zM2.2 97.97h95.67V2.27H2.2v95.7z'/%3E%3Cpath d='M42.66 59.6L27.93 44.96l-5.17 5.17 19.9 19.9L77.3 35.4l-5.17-5.18'/%3E%3C/g%3E%3C/svg%3E");
    color: #d97706;
}
.checkbox.white:checked + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff'%3E%3Cpath d='M9.55 9.65H90.5V90.6H9.55V9.65zM2.2 97.97h95.67V2.27H2.2v95.7z'/%3E%3Cpath d='M42.66 59.6L27.93 44.96l-5.17 5.17 19.9 19.9L77.3 35.4l-5.17-5.18'/%3E%3C/g%3E%3C/svg%3E");
    color: #fff;
}
.radio + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/svg%3E");
    background-size: 16px;
    color: #fff;
}
.radio:checked + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23d60908'%3E%3Cpath d='M70.82 50.03c0 11.47-9.32 20.8-20.8 20.8s-20.78-9.33-20.78-20.8 9.32-20.8 20.8-20.8 20.78 9.33 20.78 20.8'/%3E%3Cpath d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/g%3E%3C/svg%3E");
    color: #d97706;
}
.radio.white:checked + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff'%3E%3Cpath d='M70.82 50.03c0 11.47-9.32 20.8-20.8 20.8s-20.78-9.33-20.78-20.8 9.32-20.8 20.8-20.8 20.78 9.33 20.78 20.8'/%3E%3Cpath d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/g%3E%3C/svg%3E");
    color: #fff;
}
.radio.theme-primary + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23fff' d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/svg%3E");
    background-size: 20px;
}
.radio.theme-primary:checked + label {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='100' height='100' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%2334b353'%3E%3Cpath d='M70.82 50.03c0 11.47-9.32 20.8-20.8 20.8s-20.78-9.33-20.78-20.8 9.32-20.8 20.8-20.8 20.78 9.33 20.78 20.8'/%3E%3Cpath d='M50.03 86.9c-20.4 0-36.87-16.57-36.87-36.87s16.47-36.87 36.87-36.87S86.9 29.63 86.9 50.03 70.43 86.9 50.03 86.9zm0-85.9C22.97 1 1 22.97 1 50.03s21.97 49.03 49.03 49.03S99.06 77.1 99.06 50.03 77.1 1 50.03 1z'/%3E%3C/g%3E%3C/svg%3E");
}
.checkbox-small + label,
.radio-small + label {
    background-size: 13px;
    height: 15px;
    line-height: 15px;
    padding-left: 20px;
    font-size: 0.75rem;
}
.checkbox-large + label {
    background-size: 18px;
}
.checkbox-large + label,
.radio-large + label {
    height: 20px;
    line-height: 20px;
    padding-left: 30px;
    font-size: 1rem;
}
.checkbox-x-large + label {
    background-size: 26px !important;
    min-height: 26px;
    padding-left: 42px;
    font-size: 1rem;
    line-height: 1.625rem;
}
.radio-large + label {
    background-size: 18px;
}
.input.multiple:disabled,
input.checkbox:disabled + label,
input.radio:disabled + label,
input:disabled {
    cursor: default;
    opacity: 0.33;
}
input.input {
    border-radius: 12px;
    padding: 10px;
}
input.input,
textarea.textarea {
    background-color: #111113;
    border: 2px solid transparent;
    color: rgba(255, 255, 255, 0.8);
    display: inline-block;
    height: 40px;
    line-height: 20px;
    transition: color ease 0.25s, background ease 0.25s, background-color ease 0.25s;
    font-size: 0.75rem;
}
input.input::placeholder,
textarea.textarea::placeholder {
    color: rgba(223, 223, 223, 0.6);
}
input.input:hover:not(input.input:focus, textarea.textarea:focus):not(input.input.error, textarea.textarea.error),
textarea.textarea:hover:not(input.input:focus, textarea.textarea:focus):not(input.input.error, textarea.textarea.error) {
    border-color: rgba(255, 255, 255, 0.2);
}
input.input:focus,
textarea.textarea:focus {
    background-color: #050506;
    border-color: #f59e0b;
}
input.input.error,
textarea.textarea.error {
    border: 1px solid #fd3a5b;
    color: #fd3a5b;
}
input.input.error:hover,
textarea.textarea.error:hover {
    border: 1px solid #d5444e;
    color: #d5444e;
}
input.input.error:active,
input.input.error:focus,
textarea.textarea.error:active,
textarea.textarea.error:focus {
    border: 1px solid #d5444e;
    color: #d5444e;
}
input.input.date-small,
input.input.email-small,
input.input.number-small,
input.input.password-small,
input.input.search-small,
input.input.text-small {
    border-radius: 15px;
    height: 30px;
    font-size: 0.813rem;
    line-height: 0.938rem;
}
input.input.date-medium,
input.input.email-medium,
input.input.number-medium,
input.input.password-medium,
input.input.search-medium,
input.input.text-medium {
    border-radius: 12px;
    height: 32px;
    padding: 0 16px;
    font-size: 0.875rem;
    line-height: 1.063rem;
}
input[type="email"].input.theme-light,
input[type="number"].input.theme-light,
input[type="password"].input.theme-light,
input[type="tel"].input.theme-light,
input[type="text"].input.theme-light {
    background-color: rgba(255, 255, 255, 0.15);
    border: 2px solid transparent;
    box-shadow: none;
}
input[type="email"].input.theme-light:active,
input[type="email"].input.theme-light:focus,
input[type="number"].input.theme-light:active,
input[type="number"].input.theme-light:focus,
input[type="password"].input.theme-light:active,
input[type="password"].input.theme-light:focus,
input[type="tel"].input.theme-light:active,
input[type="tel"].input.theme-light:focus,
input[type="text"].input.theme-light:active,
input[type="text"].input.theme-light:focus {
    background-color: rgba(255, 255, 255, 0.15);
    border: 2px solid #f59e0b;
}
.multiple.input,
textarea.textarea {
    border-radius: 12px;
    padding: 10px;
}
label {
    display: inline-block;
    margin-bottom: 0;
    text-align: right;
}
input.block {
    width: 100%;
}
.multiple.input {
    background-color: #111113;
    border: 1px solid transparent;
    color: rgba(255, 255, 255, 0.8);
    cursor: text;
    display: flex;
    flex-wrap: wrap;
    line-height: 20px;
    min-height: 30px;
    padding: 2px 10px;
    font-size: 0.75rem;
}
.multiple.input input {
    background: 0 0;
    border: transparent;
    color: rgba(255, 255, 255, 0.8);
    flex-grow: 1;
    height: 25px;
    margin: 5px;
}
.multiple.input .multiple-item {
    align-items: center;
    background-color: #464646;
    border-radius: 20px;
    color: #fff;
    display: flex;
    font-weight: 500;
    height: 25px;
    justify-content: space-between;
    line-height: 25px;
    margin: 5px;
    padding: 0 5px 0 10px;
    vertical-align: top;
}
.multiple.input .multiple-item .multiple-item-remove {
    cursor: pointer;
    fill: #6e6e6e;
    margin-left: 10px;
}
.multiple.input .multiple-item .multiple-item-remove:focus .icon,
.multiple.input .multiple-item .multiple-item-remove:hover .icon {
    fill: #d72c37;
}
.multiple.input .multiple-item.error {
    background-color: #603838;
}
.select {
    line-height: normal;
    position: relative;
}
.select .native-select {
    -webkit-appearance: none;
    appearance: none;
    background-color: transparent;
    border: 0;
    color: transparent;
    height: 100%;
    left: 0;
    opacity: 0.01;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.select,
.select.disabled {
    transition: all 120msms ease-in-out 0s;
}
.select.disabled {
    opacity: 0.33;
}
/* <select> nativo dentro do componente .select: o visual vem de .select-control. */
.select > select.select-control {
    -webkit-appearance: none;
    appearance: none;
    color: #fff;
    font: inherit;
    font-size: 16px;
    height: 40px;
    padding-left: 10px;
}
.select > select.select-control:focus-visible {
    border-color: #ef7d00;
}
.select > select.select-control option {
    background: #1c1c1f;
    color: #fff;
}
.select > select.select-control ~ .select-arrow-zone {
    pointer-events: none;
}
.select.disabled > .select-control:hover {
    box-shadow: none;
}
.select.disabled > .select-arrow-zone {
    cursor: default;
    pointer-events: none;
}
.select-control {
    background-clip: padding-box !important;
    background-color: #111113;
    border: 1px solid transparent;
    border-radius: 12px;
    box-shadow: none;
    color: #fff;
    cursor: default;
    display: flex;
    height: 40px;
    outline: 0;
    overflow: hidden;
    padding-right: 35px;
    position: relative;
    transition-duration: 120ms;
    transition-property: border, border-color, box-shadow;
    transition-timing-function: ease-in-out;
    width: 100%;
}
.select-control:hover {
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}
.select.is-searchable.is-focused:not(.is-open) > .select-control,
.select.is-searchable.is-open > .select-control {
    cursor: text;
}
.select.is-open > .select-control {
    background: #111113;
    border-color: transparent;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.select.is-open > .select-control > .select-arrow-zone > .icon {
    transform: rotate(180deg);
}
.select.is-focused > .select-control {
    background: #050506;
    border-color: #f59e0b;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 5px #5f5f61;
}
.select-value {
    align-items: center;
    display: flex;
    margin-bottom: 2px;
    margin-top: 2px;
}
.select .select-placeholder,
.select:not(.is-multiple) > .select-control .select-value {
    bottom: 0;
    color: rgba(223, 223, 223, 0.6);
    left: 0;
    line-height: 38px;
    max-width: 100%;
    overflow: hidden;
    padding-left: 10px;
    padding-right: 10px;
    position: absolute;
    right: 0;
    text-overflow: ellipsis;
    top: 0;
    white-space: nowrap;
}
.select.has-value.is-pseudo-focused:not(.is-multiple) > .select-control > .select-value .select-value-label,
.select.has-value:not(.is-multiple):not(.is-focused) > .select-control > .select-value .select-value-label {
    color: #fff;
}
.select.has-value.is-pseudo-focused:not(.is-multiple) > .select-control > .select-value a.select-value-label,
.select.has-value:not(.is-multiple):not(.is-focused) > .select-control > .select-value a.select-value-label {
    cursor: pointer;
    text-decoration: none;
}
.select.has-value.is-pseudo-focused:not(.is-multiple) > .select-control > .select-value a.select-value-label:hover,
.select.has-value:not(.is-multiple):not(.is-focused) > .select-control > .select-value a.select-value-label:hover {
    color: #f59e0b;
    text-decoration: underline;
}
.select.has-value.is-pseudo-focused .select-input {
    opacity: 0;
}
.select-control:not(.select.is-searchable) > .select-input {
    outline: 0;
}
.select-loading,
.select-loading-zone {
    position: relative;
    vertical-align: middle;
    width: 16px;
}
.select-loading-zone {
    cursor: pointer;
    display: table-cell;
    text-align: center;
}
.select-loading {
    animation: select-animation-spin 400ms infinite linear;
    border: 2px solid transparent;
    border-radius: 50%;
    border-right-color: #fff;
    box-sizing: border-box;
    display: inline-block;
    height: 16px;
}
.select-arrow-zone,
.select-clear-zone {
    cursor: pointer;
    position: absolute;
    right: 10px;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
}
.select-clear-zone {
    animation: select-animation-fadeIn 200ms;
    padding: 5px;
}
.select-clear-zone > .icon {
    color: rgba(255, 255, 255, 0.75);
    display: block;
    margin: 0;
    transition: all 120msms ease-in-out 0s;
}
.select-clear-zone:hover,
.title-ds a {
    color: #fff;
}
.select-clear-zone ~ .select-arrow-zone {
    right: 30px;
}
.select-arrow-zone {
    color: #a0a0a1;
    padding-right: 5px;
}
.select-arrow-zone .icon {
    display: block;
    height: 6px;
    margin: 0;
    width: 6px;
    transition: all 120msms ease-in-out 0s;
}
.select .select-arrow-zone:hover > .icon,
.select.is-open .icon {
    fill: #fff;
}
.select-input {
    -webkit-appearance: none;
    appearance: none;
    background: 0 0;
    border: 0;
    box-shadow: none;
    color: #fff;
    cursor: default;
    display: inline-block;
    font-family: inherit;
    font-size: inherit;
    height: 38px;
    margin: 0;
    outline: 0;
    padding: 0 20px;
    vertical-align: middle;
}
.select-input.is-focused {
    cursor: text;
}
.select-menu-outer {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    background-color: #1d1d1d;
    border: 1px solid #f59e0b;
    border-top-color: #5a2d88;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 5px #5f5f61;
    box-sizing: border-box;
    margin-top: -1px;
    max-height: 220px;
    overflow: hidden;
    position: absolute;
    top: 100%;
    width: 100%;
    z-index: 501;
}
.select-option {
    box-sizing: border-box;
    color: #fff;
    cursor: pointer;
    display: block;
    height: 40px;
    line-height: 20px;
    padding: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.select-option:last-child {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
.select-option.is-focused {
    background-color: #050506;
    color: #fff;
}
.select-no-result,
.select-option.disabled {
    color: #fff;
    cursor: default;
}
.select-no-result {
    box-sizing: border-box;
    display: block;
    padding: 10px;
}
.select-menu .scroll-bar-container {
    max-height: 218px;
}
.is-multiple.is-for-native-controls .select-value {
    padding-right: 5px;
}
.is-multiple .select-control .select-arrow-zone,
.is-multiple.is-for-native-controls .select-value-icon {
    display: none;
}
.is-multiple .select-control {
    align-items: center;
    display: flex;
    flex-flow: row wrap;
    height: auto;
}
.is-multiple .select-input {
    padding-left: 10px;
    vertical-align: middle;
}
.is-multiple.has-value .select-input {
    padding-left: 10px;
}
.is-multiple .select-value {
    background-color: #464646;
    border-radius: 19px;
    color: #fff;
    display: inline-block;
    flex-shrink: 1;
    font-size: 0.85714rem;
    font-weight: 500;
    margin-left: 10px;
    min-height: 25px;
    padding: 5px 20px 5px 5px;
    position: relative;
    vertical-align: top;
}
.is-multiple .select-value-icon,
.is-multiple .select-value-label {
    display: inline-block;
    vertical-align: middle;
}
.is-multiple .select-value-label {
    border-bottom-right-radius: 19px;
    border-top-right-radius: 19px;
    cursor: default;
    padding: 0 10px;
}
.is-multiple a.select-value-label {
    color: #fff;
    cursor: pointer;
    text-decoration: none;
}
.is-multiple .select-value-icon {
    cursor: pointer;
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
}
.is-multiple .select-value-icon .icon {
    fill: #6e6e6e;
    margin: 0;
    pointer-events: none;
}
.is-multiple .select-value-icon:focus .icon,
.is-multiple .select-value-icon:hover .icon {
    fill: #d72c37;
}
.is-multiple.disabled {
    opacity: 0.33;
}
.is-multiple.disabled .select-value-icon {
    cursor: not-allowed;
}
.select.error .select-control {
    border: 1px solid #fd3a5b;
}
.select.error .select-control .select-input {
    color: #fd3a5b;
}
.select.error .select-menu-outer {
    border: 1px solid #fd3a5b;
    border-top-color: #872637;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(253, 58, 91, 0.75);
}
.select.error.is-focused .select-control {
    color: #d5444e;
}
.select.error.is-focused .select-control,
.select.error.is-focused .select-menu-outer,
.select.error:hover .select-control {
    border: 1px solid #d5444e;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 6px rgba(213, 68, 78, 0.75);
}
.select.error.is-focused .select-menu-outer {
    border-top-color: #732b31;
}
.select.error:hover .select-control {
    color: #d5444e;
}
.select.select-small {
    font-size: 0.75rem;
}
.select.select-small .select-control {
    border-radius: 15px;
}
.select.select-small .select-placeholder,
.select.select-small:not(.is-multiple) > .select-control .select-value {
    line-height: 30px;
}
.select.select-small .select-input {
    height: 30px;
}
.select.select-small.is-open > .select-control {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}
.select.select-small .select-loading-zone {
    width: 14px;
}
.select.select-small .select-loading {
    border: 1px solid transparent;
    height: 14px;
    width: 14px;
}
.select.select-small .select-option {
    height: 30px;
    line-height: 10px;
}
.select.select-small .select-value {
    margin-top: 2px;
}
.select.select-small:not(.is-multiple) .select-control {
    height: 32px;
}
.select.select-small.is-multiple .select-value {
    height: 26px;
    margin-left: 3px;
}
.de {
    background: rgba(0, 0, 0, 0.9);
    bottom: 0;
    left: 0;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 211;
}
.de__root-showing {
    overflow: initial;
}
.de__big-logo {
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 11px;
}
.de__content {
    bottom: 64px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 64px;
    width: 100%;
}
.de__list {
    align-items: center;
    bottom: 0;
    column-gap: 40px;
    display: flex;
    left: 0;
    position: absolute;
    top: 0;
}
.de__close {
    color: #707071;
    cursor: pointer;
    padding: 4px;
    position: absolute;
    right: 18px;
    top: 12px;
}
.de__close:hover {
    color: #cfcfd0;
}
.de__content-mobile {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.messenger-chats {
    align-items: flex-end;
    bottom: 0;
    display: flex;
    height: 0;
    overflow: visible;
    position: fixed;
    right: 20px;
    z-index: 104;
}
@media (max-width: 639px) {
    .messenger-chats {
        left: 0;
        right: 0;
        z-index: 202;
    }
}
.feed-my-club__header {
    align-items: center;
    display: flex;
    height: 40px;
    position: absolute;
    right: 0;
    top: 14px;
    z-index: 5;
}
.feed__post-label {
    left: 16px;
    pointer-events: none;
    position: absolute;
    top: 16px;
    z-index: 3;
}
@media screen and (max-width: 767px) {
    .feed__post-label {
        left: 14px;
        top: 14px;
    }
}
.empty-feed-placeholder {
    font-size: 30px;
    margin: 20px 0;
    text-align: center;
}
.empty-feed-placeholder .icon {
    height: 100px;
    margin: 0 auto 40px;
    width: 100px;
}
@media screen and (max-width: 639px) {
    .feed-post .text-post,
    .feed-post .r {
        border-radius: 0;
    }
    .feed-post .feed-content {
        margin: 0-16px;
        padding: 0 0 20px;
    }
    .feed-post .tile-content-info {
        padding: 0 14px;
    }
    .feed-post .text-post .text {
        padding: 0 16px;
    }
    .feed-my-club__header {
        right: 10px;
        top: 4px;
    }
}
.landing-benefits {
    display: flex;
    justify-content: space-between;
    margin-bottom: 156px;
    margin-top: 19px;
}
@media screen and (max-width: 1023px) {
    .landing-benefits {
        flex-wrap: wrap;
        margin-bottom: 116px;
    }
}
@media screen and (max-width: 639px) {
    .landing-benefits {
        flex-direction: column;
        justify-content: flex-start;
        margin-top: 82px;
    }
}
.landing-benefit {
    width: 25%;
}
.landing-benefit__icon-wrapper {
    border: 3px solid rgb(241 16 16 / 20%);
    border-radius: 24px;
    display: inline-block;
    padding: 18px;
}
.landing-benefit__icon-wrapper .icon {
    height: 32px;
    width: 32px;
}
.landing-benefit__title {
    font-weight: 700;
    margin-top: 24px;
    font-size: 1.375rem;
    line-height: 1.65rem;
}
.landing-benefit__subtitle {
    margin-top: 24px;
    opacity: 0.8;
    font-size: 1rem;
    line-height: 1.5rem;
}
@media screen and (max-width: 1023px) {
    .landing-benefit {
        width: 34%;
    }
    .landing-benefit:last-child {
        margin-top: 64px;
    }
}
@media screen and (max-width: 639px) {
    .landing-benefit {
        width: 100%;
        text-align: center;
    }
    .landing-benefit:last-child {
        margin-top: 0;
    }
    .landing-benefit:not(:last-child) {
        margin-bottom: 36px;
    }
}
.landing-abilities__title {
    font-size: 3rem;
    line-height: 3.25rem;
    font-weight: 700;
    margin: 0 0 24px;
}
.landing-abilities__clubs-wrapper .landing-ability__description {
    flex: 2;
}
.landing-abilities__clubs-wrapper .landing-ability__content {
    flex: 3;
}
.landing-abilities__referrals-wrapper {
    margin: 100px 0 0;
}
.landing-abilities__referrals-wrapper .landing-ability__description {
    flex: 2;
    position: relative;
}
.landing-abilities__referrals-wrapper .landing-ability__content {
    flex: 2;
}
.landing-abilities__unlock .landing-ability__content {
    align-items: center;
    display: flex;
    height: 371px;
    margin-right: 50px;
    position: relative;
}
@media screen and (max-width: 639px) {
    .landing-abilities__unlock {
        margin-left: unset;
        width: unset;
    }
}
.landing-abilities__with-margin {
    margin-bottom: 250px;
}
.landing-abilities__height-limited {
    max-height: 650px;
}
.landing-abilities__subtitle {
    color: #cfcfd0;
    padding: 0 24px;
    text-align: center;
    font-size: 1rem;
    line-height: 1.75rem;
}
.landing-abilities__screen {
    background: url(/assets/common/images/promo/screen.webp) center/contain no-repeat;
    border-radius: 6%;
    box-shadow: 1px 1px 68px rgb(87 13 13 / 60%);
    position: absolute;
    right: 0;
    width: 563px;
}
.landing-abilities__screen::after {
    content: "";
    display: block;
    padding-top: 67.8%;
    width: 100%;
}
.landing-abilities__screen-wrapper {
    background-color: #000;
    border-radius: 27px;
    box-shadow: 0 3.0794827938px 110.0915222168px 0 rgba(163, 73, 252, 0.4);
    padding: 14px 11px;
    position: relative;
}
.landing-abilities__screen-wrapper::after {
    background: linear-gradient(180deg, #f59e0b 0, #270548 100%);
    border-radius: 30px;
    bottom: -3px;
    content: "";
    left: -3px;
    position: absolute;
    right: -3px;
    top: -3px;
    z-index: -1;
}
.landing-abilities__chat .landing-ability__description {
    max-width: 472px;
}
.landing-abilities__clubs {
    flex: 1;
    height: 510px;
    position: relative;
}
.landing-abilities__clubs-club {
    border: 3px solid #f59e0b;
    box-shadow: 0 0 119.787px rgba(163, 73, 252, 0.4);
    overflow: hidden;
    position: absolute;
}
.landing-abilities__clubs-club::after {
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform 0.6s;
    width: 100%;
}
.landing-abilities__clubs-club:hover::after {
    transform: scale(1.3);
}
.landing-abilities__clubs-club-1 {
    border-radius: 63.6632px;
    height: 192.66px;
    left: 0;
    top: 69%;
    transform: rotate(-10.44deg);
    width: 192.66px;
}
.landing-abilities__clubs-club-1::after {
    background: url(/assets/common/images/promo/avatar3.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-2 {
    border-radius: 52.7734px;
    height: 159.16px;
    left: 21.5%;
    top: 13.5%;
    transform: rotate(16.89deg);
    width: 159.16px;
}
.landing-abilities__clubs-club-2::after {
    background: url(/assets/common/images/promo/avatar4.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-3 {
    border-radius: 28.4809px;
    height: 84px;
    left: 55%;
    top: 11%;
    transform: rotate(4deg);
    width: 84px;
}
.landing-abilities__clubs-club-3::after {
    background: url(/assets/common/images/promo/avatar5.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-4 {
    border-radius: 42.7213px;
    height: 125.65px;
    left: 53%;
    top: 41%;
    transform: rotate(-11.68deg);
    width: 125.65px;
}
.landing-abilities__clubs-club-4::after {
    background: url(/assets/common/images/promo/avatar6.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-5 {
    border-radius: 29.3186px;
    height: 83.77px;
    left: 31%;
    top: 56%;
    transform: rotate(10.93deg);
    width: 83.77px;
}
.landing-abilities__clubs-club-5::after {
    background: url(/assets/common/images/promo/avatar7.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-6 {
    border-radius: 36.02px;
    height: 100.52px;
    left: 76%;
    top: 72%;
    transform: rotate(-6.72deg);
    width: 100.52px;
}
.landing-abilities__clubs-club-6::after {
    background: url(/assets/common/images/promo/avatar8.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-7 {
    border-radius: 34.3446px;
    height: 100.52px;
    left: 45%;
    top: 87%;
    transform: rotate(11.56deg);
    width: 100.52px;
}
.landing-abilities__clubs-club-7::after {
    background: url(/assets/common/images/promo/avatar9.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-8 {
    border-radius: 28.4809px;
    bottom: -150px;
    height: 84px;
    left: 170px;
    transform: rotate(-13deg);
    width: 84px;
}
.landing-abilities__clubs-club-8::after {
    background: url(/assets/common/images/promo/avatar5.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-9 {
    border-radius: 39px;
    height: 120px;
    left: 95%;
    top: 83.5%;
    transform: rotate(16.89deg);
    width: 120px;
}
.landing-abilities__clubs-club-9::after {
    background: url(/assets/common/images/promo/avatar4.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-10 {
    border-radius: 24px;
    height: 72px;
    left: 38%;
    top: 46%;
    transform: rotate(-11.68deg);
    width: 72px;
}
.landing-abilities__clubs-club-10::after {
    background: url(/assets/common/images/promo/avatar6.webp) center/cover no-repeat;
}
.landing-abilities__clubs-club-11 {
    border-radius: 29.3186px;
    height: 95px;
    left: 70%;
    top: 55%;
    transform: rotate(-17.07deg);
    width: 95px;
}
.landing-abilities__clubs-club-11::after {
    background: url(/assets/common/images/promo/avatar7.webp) center/cover no-repeat;
}
.landing-abilities__clubs-dollar {
    left: 63%;
    position: absolute;
    top: 19%;
}
.landing-abilities__clubs-dollar .smile {
    height: 120px;
    margin: 0;
    width: 120px;
}
.landing-abilities__clubs-club-placeholder {
    background: #f59e0b;
    position: absolute;
}
.landing-abilities__clubs-club-placeholder-1 {
    border-radius: 7.53906px;
    height: 20.1px;
    left: 18%;
    opacity: 0.6;
    top: 49.5%;
    transform: rotate(-18.46deg);
    width: 20.1px;
}
.landing-abilities__clubs-club-placeholder-2 {
    border-radius: 5.86371px;
    height: 16.75px;
    left: 33.3%;
    opacity: 0.2;
    top: 79%;
    transform: rotate(-18.46deg);
    width: 16.75px;
}
.landing-abilities__clubs-club-placeholder-3 {
    border-radius: 5.86371px;
    height: 18.43px;
    left: 47.4%;
    opacity: 0.3;
    top: 67.2%;
    transform: rotate(-2.71deg);
    width: 18.43px;
}
.landing-abilities__clubs-club-placeholder-4 {
    border-radius: 9.21441px;
    height: 26.81px;
    left: 69%;
    opacity: 0.5;
    top: 89.7%;
    transform: rotate(6.11deg);
    width: 26.81px;
}
.landing-abilities__clubs-club-placeholder-5 {
    border-radius: 13.4028px;
    height: 40.21px;
    left: 71.3%;
    opacity: 0.3;
    top: 34%;
    transform: rotate(-18.46deg);
    width: 40.21px;
}
.landing-abilities__clubs-club-placeholder-6 {
    border-radius: 7.53906px;
    height: 18.43px;
    left: 78.5%;
    opacity: 0.5;
    top: 55.5%;
    transform: rotate(-18.46deg);
    width: 18.43px;
}
/* .landing-abilities__mobile-screen removido: o mockup do celular virou HTML/CSS
   (.lp-phone em css/landing.css). A imagem mobile.png era um print do script
   original — logo BellooRed, UI em ingles, preco em USD e fotos de terceiros. */
@media screen and (max-width: 767px) {
    .landing-abilities__earn .landing-ability__content,
    .landing-abilities__earn .landing-ability__description {
        width: 50%;
    }
    .landing-abilities__with-margin {
        margin-bottom: 180px;
    }
}
@media screen and (max-width: 1023px) {
    .landing-abilities__clubs-wrapper .landing-ability__content {
        margin: 0 auto;
        width: 60%;
    }
    .landing-abilities__clubs {
        height: unset;
        margin-top: 40px;
        min-height: 350px;
        min-width: 500px;
        position: relative;
    }
    .landing-abilities__clubs .landing-ability__description {
        flex: 2;
    }
    .landing-abilities__clubs .landing-ability__content {
        flex: 3;
    }
    .landing-abilities__clubs-club {
        border: 2.1px solid #f59e0b;
        position: absolute;
    }
    .landing-abilities__clubs-club-1 {
        border-radius: 40.67px;
        height: 123.1px;
        top: 63%;
        width: 123.1px;
    }
    .landing-abilities__clubs-club-2 {
        border-radius: 33.71px;
        height: 101.69px;
        left: 21%;
        width: 101.69px;
    }
    .landing-abilities__clubs-club-3 {
        border-radius: 18.19px;
        height: 53.52px;
        left: 53.5%;
        top: 0;
        width: 53.52px;
    }
    .landing-abilities__clubs-club-4 {
        border-radius: 27.29px;
        height: 80.28px;
        left: 51.7%;
        top: 31%;
        width: 80.28px;
    }
    .landing-abilities__clubs-club-5 {
        border-radius: 18.73px;
        height: 53.52px;
        left: 30%;
        top: 47%;
        width: 53.52px;
    }
    .landing-abilities__clubs-club-6 {
        border-radius: 23px;
        height: 64.23px;
        left: 67.3%;
        top: 65.2%;
        width: 64.23px;
    }
    .landing-abilities__clubs-club-7 {
        border-radius: 22px;
        height: 64.23px;
        left: 44%;
        top: 75.5%;
        width: 64.23px;
    }
}
@media screen and (max-width: 767px) {
    .landing-abilities__clubs-wrapper .landing-ability__content,
    .landing-abilities__earn .landing-ability__content,
    .landing-abilities__earn .landing-ability__description {
        width: 100%;
    }
    .landing-abilities__force-up-move {
        margin-top: -25vw;
    }
    .landing-abilities__height-limited {
        max-height: unset;
    }
    .landing-abilities__with-margin {
        margin-bottom: 100px;
    }
    .landing-abilities__title {
        font-size: 2rem;
        line-height: 2.438rem;
        margin: 0 0 20px;
    }
    .landing-abilities__subtitle {
        font-size: 1rem;
        line-height: 1.625rem;
        color: #a0a0a1;
        margin-bottom: 64px;
        padding: 0;
    }
    .landing-abilities__screen {
        margin-top: 62px;
        max-width: 100%;
        position: relative;
        width: 100%;
    }
    .landing-abilities__referrals-wrapper {
        margin: 140px 0 0;
    }
    .landing-abilities__referrals-wrapper .landing-abilities__clubs-club,
    .landing-abilities__referrals-wrapper .landing-ability__content {
        display: none;
    }
}
@media screen and (max-width: 639px) {
    .landing-abilities__with-margin {
        margin-bottom: 60px;
    }
}
.no-webp .landing-abilities__screen {
    background-image: url(/assets/common/images/promo/screen.png);
}
.no-webp .landing-abilities__clubs-club-1 {
    background-image: url(/assets/common/images/promo/avatar3.png);
}
.no-webp .landing-abilities__clubs-club-2 {
    background-image: url(/assets/common/images/promo/avatar4.png);
}
.no-webp .landing-abilities__clubs-club-3 {
    background-image: url(/assets/common/images/promo/avatar5.png);
}
.no-webp .landing-abilities__clubs-club-4 {
    background-image: url(/assets/common/images/promo/avatar6.png);
}
.no-webp .landing-abilities__clubs-club-5 {
    background-image: url(/assets/common/images/promo/avatar7.png);
}
.no-webp .landing-abilities__clubs-club-6 {
    background-image: url(/assets/common/images/promo/avatar8.png);
}
.no-webp .landing-abilities__clubs-club-7 {
    background-image: url(/assets/common/images/promo/avatar9.png);
}
.no-webp .landing-abilities__clubs-club-8 {
    background-image: url(/assets/common/images/promo/avatar5.png);
}
.no-webp .landing-abilities__clubs-club-9 {
    background-image: url(/assets/common/images/promo/avatar4.png);
}
.no-webp .landing-abilities__clubs-club-10 {
    background-image: url(/assets/common/images/promo/avatar6.png);
}
.become-part {
    align-items: center;
    background-color: rgba(255, 255, 255, 0.08);
    border-radius: 22px;
    display: flex;
    justify-content: space-between;
    margin: 80px 0 95px;
    padding: 24px 40px;
    width: 100%;
}
.become-part__input {
    background: 0 0;
    border: 0;
    box-shadow: none;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    outline: 0;
    padding: 0;
}
.become-part__title {
    font-size: 1.75rem;
    font-weight: 500;
    line-height: 2.137rem;
}
.become-part__form {
    display: flex;
    height: 56px;
}
.become-part__form .btn {
    background: #d97706;
    border-radius: 16px;
    padding: 17px 33.5px;
    font-size: 1.125rem;
    line-height: 1.375rem;
}
.become-part__input-composite {
    align-items: center;
    background-color: rgba(255, 255, 255, 0.15);
    border-radius: 16px;
    display: flex;
    font-weight: 500;
    margin-right: 20px;
    padding: 18px 22px;
    font-size: 1.375rem;
    line-height: 1.25rem;
}
.become-part__input-composite .input-wrapper input,
.become-part__input-composite .input-wrapper input:focus {
    background: 0 0;
    border: 0;
    box-shadow: none;
    font-weight: 500;
    padding: 0;
    font-size: 1.375rem;
    line-height: 1.25rem;
}
@media screen and (max-width: 1023px) {
    .become-part {
        flex-direction: column;
        margin: 64px 0 132px;
        max-width: 458px;
        padding: 16px;
    }
    .become-part__title {
        font-size: 1.75rem;
        line-height: 2.137rem;
    }
    .become-part__input-composite {
        font-size: 1rem;
        line-height: 1.25rem;
        margin-right: 0;
    }
    .become-part__input-composite .input-wrapper input,
    .become-part__input-composite .input-wrapper input:focus {
        font-size: 1rem;
        line-height: 1.25rem;
        height: auto;
    }
    .become-part__form {
        flex-direction: column;
        height: auto;
        margin-top: 20px;
        width: 100%;
    }
    .become-part__form .btn {
        margin-top: 20px;
    }
}
@media screen and (max-width: 639px) {
    .become-part {
        margin: 60px 0 100px;
    }
}
.tooltip {
    display: table;
    font-size: 11px;
    line-height: 1.2rem;
    padding: 5px;
    position: fixed;
    text-align: left;
    user-select: auto;
    white-space: normal;
    z-index: 599;
}
.tooltip--not-clickable {
    pointer-events: none;
}
.tooltip--pure {
    border-radius: 0;
    padding: 0;
}
.tooltip-inner {
    background: #fff;
    border-color: #fff;
    border-radius: 6px;
    box-shadow: 0 0 4px rgba(255, 255, 255, 0.2);
    color: #000;
    display: inline-block;
    font-weight: 500;
    padding: 6px 10px;
    position: relative;
    text-shadow: none;
    text-transform: none;
}
.tooltip-inner--pure {
    background: 0 0;
    border: 0;
    box-shadow: none;
    padding: 0;
}
.tooltip-inner--arrow::before {
    border-color: transparent;
    border-style: solid;
    content: "";
    height: 0;
    position: absolute;
    width: 0;
}
.tooltip-title {
    text-align: center;
    font-size: 0.875rem;
}
.tooltip-close {
    color: #fff;
    cursor: pointer;
    margin: 0;
    opacity: 0.5;
    padding: 6px 8px;
    position: absolute;
    right: 0;
    top: 0;
}
.tooltip-close .icon {
    height: 14px;
    margin: 0;
    width: 14px;
}
.tooltip-close:hover {
    opacity: 8;
}
.tooltip.one-line {
    display: inline-block;
    line-break: auto;
    white-space: nowrap;
}
.tooltip.one-line > .tooltip-inner {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: top;
}
.tooltip.one-line:hover {
    white-space: normal;
    width: 250px !important;
    z-index: 102;
}
.tooltip::before {
    box-sizing: border-box;
}
.tooltip.bottom > .tooltip-inner::before {
    border-bottom-color: inherit;
    border-width: 0 5px 5px;
    bottom: 100%;
    left: calc(50% - 5px);
}
.tooltip.left > .tooltip-inner::before {
    border-left-color: inherit;
    border-width: 5px 0 5px 5px;
    margin-top: -5px;
    right: -5px;
    top: 50%;
}
.tooltip.right > .tooltip-inner::before {
    border-right-color: inherit;
    border-width: 5px 5px 5px 0;
    margin-top: -5px;
    right: 100%;
    top: 50%;
}
.tooltip.top > .tooltip-inner::before {
    border-top-color: inherit;
    border-width: 5px 5px 0;
    left: calc(50% - 5px);
    top: 100%;
}
.tooltip.bottom-left > .tooltip-inner::before {
    border-bottom-color: inherit;
    border-width: 0 5px 5px;
    margin-top: 2px;
    right: 5px;
    top: 0;
}
.tooltip.bottom-right > .tooltip-inner::before {
    border-bottom-color: inherit;
    border-width: 0 5px 5px;
    left: 5px;
    margin-top: 2px;
    top: 0;
}
.tooltip.top-left > .tooltip-inner::before {
    border-top-color: inherit;
    border-width: 5px 5px 0;
    bottom: 0;
    margin-bottom: 2px;
    right: 5px;
}
.tooltip.top-right > .tooltip-inner::before {
    border-top-color: inherit;
    border-width: 5px 5px 0;
    bottom: 0;
    left: 5px;
    margin-bottom: 2px;
}
.tooltip.error.left > .tooltip-inner::before {
    border-left-color: #ef7d00;
}
.tooltip.error.right > .tooltip-inner::before {
    border-right-color: #ef7d00;
}
.tooltip.error.top > .tooltip-inner::before {
    border-top-color: #ef7d00;
}
.tooltip.error.bottom > .tooltip-inner::before {
    border-bottom-color: #ef7d00;
}
.tooltip.error .tooltip-inner {
    background-color: #ef7d00;
    color: #000;
}
.tooltip.error .tooltip-inner a,
.tooltip.error .tooltip-inner a:active,
.tooltip.error .tooltip-inner a:visited {
    color: #000;
    text-decoration: underline;
}
.tooltip-animated {
    opacity: 0;
    pointer-events: none;
    transition: opacity 500ms;
}
.tooltip-animated-exit-done {
    opacity: 0;
}
.tooltip-animated-enter-done {
    opacity: 1;
}
.calculator {
    margin-top: 40px;
}
.calculator__prefix {
    display: inline-block;
    font-size: 28px;
    font-style: normal;
    font-weight: 300;
    line-height: 45px;
    margin: 0 0 100px 15%;
    padding: 0 1.8em 0 0;
    position: relative;
}
.calculator__prefix-text {
    font-family: Rubik;
    transform: rotate(-6deg) translate(-10px, 32px);
}
.calculator__prefix-diamond {
    background: url(/assets/common/images/promo/diamond.webp) center/contain no-repeat;
    height: 48px;
    position: absolute;
    right: 0;
    top: 0;
    width: 48px;
}
.calculator__prefix-arrow {
    background: url(/assets/common/images/promo/arrow-1.svg) center/contain no-repeat;
    height: 50px;
    left: 6.4em;
    margin: 1.5em 0 0;
    position: absolute;
    top: 100%;
    width: 50px;
}
.calculator__postfix {
    border: 1px dashed #f59e0b;
    border-radius: 17px;
    font-size: 16px;
    line-height: 140%;
    margin: 9px auto;
    max-width: 100%;
    padding: 18px 16px 16px;
}
.calculator__postfix--first {
    margin-bottom: 130px;
    transform: rotate(-6.07deg);
    width: 354px;
}
.calculator__postfix--second {
    margin-bottom: 120px;
    transform: rotate(6.07deg);
    width: 300px;
}
.calculator__postfix-text {
    color: #bbb;
}
.calculator__postfix-text--second {
    align-items: center;
    display: flex;
}
.calculator__postfix-text-left {
    font-size: 38px;
    font-weight: 500;
    line-height: 22px;
    margin: 0 8px 0 0;
}
.calculator__postfix-arrow {
    background: url(/assets/common/images/promo/arrow-2.svg) center/contain no-repeat;
    height: 62px;
    position: absolute;
    top: 137%;
    transform: rotate(26.07deg);
    width: 52px;
}
.calculator__postfix-arrow--first {
    left: 50%;
    position: absolute;
    top: 137%;
    transform: rotate(-37.93deg) scaleX(-1);
}
.calculator__postfix-arrow--second {
    left: 40%;
    position: absolute;
    top: 137%;
    transform: rotate(33.07deg);
}
.calculator__postfix-smile {
    left: 50%;
    margin: 0 0 0-20px;
    position: absolute;
    top: -26px;
}
.calculator__postfix-smile .smile {
    height: 45px;
    margin: 0;
    width: 45px;
}
.calculator__postfix-footer {
    bottom: -162px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 44px;
    font-weight: 700;
    left: 189px;
    line-height: 54px;
    position: absolute;
    transform: rotate(-5.93deg);
}
.calculator__title {
    font-size: 2.75rem;
    line-height: 3.125rem;
    font-weight: 700;
    margin: 0 0 20px;
    text-align: center;
}
.calculator__subtitle {
    color: #cfcfd0;
    font-weight: 500;
    line-height: 160%;
    margin-bottom: 59px;
    text-align: center;
    font-size: 1rem;
}
.calculator__amount {
    font-size: 90px;
    font-weight: 700;
    line-height: 98px;
    text-align: center;
}
.calculator__sliders {
    display: flex;
    justify-content: space-between;
    margin-top: 86px;
    padding: 0 40px;
}
.calculator__sliders-slider-wrapper {
    width: 45%;
}
.calculator__sliders-slider-wrapper-title {
    font-weight: 700;
    margin-top: 42px;
    text-align: center;
    font-size: 1.625rem;
    line-height: 1.5rem;
}
.calculator__sliders-slider-wrapper-subtitle {
    font-size: 1rem;
    line-height: 1.375rem;
    margin-top: 10px;
    opacity: 0.5;
    text-align: center;
}
.calculator__sliders-slider {
    align-items: center;
    display: flex;
    width: 100%;
}
.calculator__sliders-slider-thumb {
    background-color: #fff;
    border: 10px solid #d97706;
    border-radius: 20px;
    box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.07), 0 0 15px 0 rgba(0, 0, 0, 0.05);
    box-sizing: content-box;
    height: 12px;
    width: 12px;
}
.calculator__sliders-slider-subs-track,
.calculator__sliders-slider-track {
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 3px;
    height: 6px;
    position: relative;
}
.calculator__sliders-slider-subs-track-0 {
    background-color: #f59e0b;
}
.calculator__sliders-slider-mark {
    background-color: #fff;
    border: 3px solid #0b0313;
    border-radius: 6px;
    bottom: calc(50% - 6px);
    box-sizing: content-box;
    height: 6px;
    margin: 0 8px;
    width: 6px;
}
@media screen and (max-width: 1023px) {
    .calculator__sliders {
        flex-direction: column;
        justify-content: flex-start;
    }
    .calculator__sliders-slider-wrapper {
        width: 100%;
    }
    .calculator__sliders-slider-wrapper:not(:last-child) {
        margin-bottom: 55px;
    }
    .calculator__postfix {
        margin: 72px auto 110px;
    }
    .calculator__postfix-arrow {
        left: 24%;
        top: 112%;
        transform: rotate(34.07deg);
    }
    .calculator__postfix-footer {
        left: 130px;
    }
}
@media screen and (max-width: 639px) {
    .calculator {
        text-align: center;
    }
    .calculator__title {
        font-size: 2rem;
        line-height: 2.2rem;
    }
    .calculator__subtitle {
        font-size: 1rem;
        line-height: 1.6rem;
        margin-bottom: 40px;
    }
    .calculator__amount {
        font-size: 2.5rem;
        line-height: 2.625rem;
    }
    .calculator__prefix {
        font-size: 18px;
        line-height: 29px;
        margin: 0 auto 100px;
    }
    .calculator__prefix-diamond {
        height: 34px;
        top: 10px;
        width: 34px;
    }
    .calculator__postfix-footer {
        bottom: -115px;
        font-size: 32px;
        left: 120px;
    }
    .calculator__sliders {
        flex-direction: column;
        justify-content: flex-start;
        margin-top: 40px;
    }
    .calculator__sliders-slider-wrapper {
        width: 100%;
    }
    .calculator__sliders-slider-wrapper:not(:last-child) {
        margin-bottom: 35px;
    }
}
.login-messages {
    display: flex;
    flex-direction: column;
    margin-right: 40px;
}
@media screen and (max-width: 1023px) {
    .login-messages {
        margin-right: 20px;
    }
}
@media screen and (max-width: 639px) {
    .login-messages {
        margin: 0 auto 40px;
    }
}
.login-message-wrapper:not(:last-child) {
    margin-bottom: 15px;
}
@media screen and (max-width: 639px) {
    .login-message-wrapper:not(:last-child) {
        margin-bottom: 9.32px;
    }
}
.login-message {
    align-items: center;
    background: #100202;
    border-radius: 30px;
    box-shadow: 0 0 200px rgb(173 28 28 / 60%);
    display: inline-flex;
    padding: 20px;
    position: relative;
}
.login-message__dynamic {
    min-width: 424px;
    padding-right: 0;
}
.login-message__small {
    padding: 29.5px 53px;
}
.login-message__small-margin {
    margin-left: 1.4vw;
}
.login-message__medium-margin {
    margin-left: 90px;
}
.login-message__huge-margin {
    margin-left: 350px;
}
.login-message__avatar {
    border-radius: 22px;
    height: 64px;
    margin-right: 20px;
    width: 64px;
}
.login-message__first-avatar {
    background: url(/assets/common/images/promo/avatar1.webp) center/cover no-repeat;
}
.login-message__second-avatar {
    background: url(/assets/common/images/promo/avatar2.webp) center/cover no-repeat;
}
.login-message__text {
    font-size: 1.75rem;
    line-height: 1.925rem;
    align-items: center;
    display: flex;
    font-weight: 700;
    text-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.login-message__inline-emoji {
    background-repeat: no-repeat;
    background-size: contain;
    display: block;
    height: 44px;
    margin-left: 12px;
    width: 44px;
}
.login-message__absolute-emoji {
    height: 66px;
    position: absolute;
    right: 33.46px;
    top: -33.46px;
    width: 66px;
}
@media screen and (max-width: 1279px) {
    .login-message__huge-margin,
    .login-message__medium-margin,
    .login-message__small-margin {
        margin-left: 0;
    }
    .login-message__text {
        font-size: 1.163rem;
        line-height: 1.279rem;
    }
    .login-message__dynamic {
        min-width: 320px;
    }
    .login-message__avatar {
        border-radius: 14.96px;
        height: 42.51px;
        margin-right: 13.28px;
        width: 42.51px;
    }
    .login-message__absolute-emoji {
        height: 44px;
        right: 13.46px;
        top: -22.46px;
        width: 44px;
    }
    .login-message__inline-emoji {
        height: 28.23px;
        margin-left: 7.97px;
        width: 28.23px;
    }
}
@media screen and (max-width: 639px) {
    .login-message__huge-margin,
    .login-message__medium-margin,
    .login-message__small-margin {
        margin-left: 0;
    }
    .login-message__text {
        font-size: 1.088rem;
        line-height: 1.197rem;
    }
    .login-message__dynamic {
        min-width: 300px;
    }
    .login-message__avatar {
        border-radius: 13.6px;
        height: 40px;
        margin-right: 12.43px;
        width: 40px;
    }
    .login-message__absolute-emoji {
        height: 42px;
        right: 13.46px;
        top: -22.46px;
        width: 42px;
    }
    .login-message__inline-emoji {
        height: 26px;
        margin-left: 7.46px;
        width: 26px;
    }
}
.user-status-icon {
    align-items: center;
    background: #050506;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    pointer-events: none;
}
.user-status-icon::after {
    background-color: #9fe20d;
    border-radius: 50%;
    content: "";
    display: block;
    height: 50%;
    width: 50%;
}
.text-s10-w700-ls0_5-upper {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.5px;
    line-height: normal;
    text-transform: uppercase;
}
.text-s10-w500 {
    font-size: 10px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s11-w400,
.text-s11-w500,
.text-s11-w700-ls0_5-upper {
    font-size: 11px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s11-w500,
.text-s11-w700-ls0_5-upper {
    font-weight: 500;
}
.text-s11-w700-ls0_5-upper {
    font-weight: 700;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.text-s12-w400 {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s12-w500,
.text-s12-w700,
.text-s12-w700-ls0_6-upper {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
}
.text-s12-w700,
.text-s12-w700-ls0_6-upper {
    font-weight: 700;
}
.text-s12-w700-ls0_6-upper {
    letter-spacing: 0.6px;
    text-transform: uppercase;
}
.text-s13-w400 {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s13-w400-lh18,
.text-s13-w700,
.text-s13-w700-lh1_4 {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 18px;
}
.text-s13-w700,
.text-s13-w700-lh1_4 {
    font-weight: 700;
    line-height: normal;
}
.text-s13-w700-lh1_4 {
    line-height: 1.4;
}
.text-s14-w400,
.text-s14-w400-lh1_3,
.text-s14-w400-lh20 {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s14-w400-lh1_3,
.text-s14-w400-lh20 {
    line-height: 1.3;
}
.text-s14-w400-lh20 {
    line-height: 20px;
}
.text-s14-w500,
.text-s14-w700,
.text-s15-w500,
.text-s15-w500-lh20 {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
}
.text-s14-w700,
.text-s15-w500,
.text-s15-w500-lh20 {
    font-weight: 700;
}
.text-s15-w500,
.text-s15-w500-lh20 {
    font-size: 15px;
    font-weight: 500;
}
.text-s15-w500-lh20 {
    line-height: 20px;
}
.text-s15-w400,
.text-s15-w400-ls0_5,
.text-s15-w400-ls1 {
    font-size: 15px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s15-w400-ls0_5,
.text-s15-w400-ls1 {
    letter-spacing: 0.5px;
}
.text-s15-w400-ls1 {
    letter-spacing: 1px;
}
.text-s15-w700,
.text-s16-w400,
.text-s16-w500 {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal;
}
.text-s16-w400,
.text-s16-w500 {
    font-size: 16px;
    font-weight: 400;
}
.text-s16-w500 {
    font-weight: 500;
}
.text-s16-w500-lh24,
.text-s16-w700,
.text-s17-w500-lh1_5 {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: 24px;
}
.text-s16-w700,
.text-s17-w500-lh1_5 {
    font-weight: 700;
    line-height: normal;
}
.text-s17-w500-lh1_5 {
    font-size: 17px;
    font-weight: 500;
    line-height: 1.5;
}
.text-s18-w400,
.text-s18-w600 {
    font-size: 18px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s18-w600 {
    font-weight: 600;
}
.text-s20-w500-lh1_5,
.text-s20-w700-lh24 {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: 1.5;
}
.text-s20-w700-lh24 {
    font-weight: 700;
    line-height: 24px;
}
.text-s22-w700,
.text-s24-w400,
.text-s24-w700 {
    font-size: 24px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.text-s22-w700,
.text-s24-w700 {
    font-weight: 700;
}
.text-s22-w700 {
    font-size: 22px;
}
.text-s26-w500,
.text-s28-w600,
.text-s30-w500 {
    font-size: 26px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
}
.text-s28-w600,
.text-s30-w500 {
    font-size: 28px;
    font-weight: 600;
}
.text-s30-w500 {
    font-size: 30px;
    font-weight: 500;
}
.text-s32-w600,
.text-s40-w600,
.text-s44-w500,
.text-title-l0 {
    font-size: 32px;
    font-weight: 600;
    letter-spacing: normal;
    line-height: normal;
}
.text-s40-w600,
.text-s44-w500,
.text-title-l0 {
    font-size: 40px;
}
.text-s44-w500,
.text-title-l0 {
    font-size: 44px;
    font-weight: 500;
}
.text-title-l0 {
    font-size: 30px;
}
@media screen and (max-width: 639px) {
    .text-title-l0 {
        font-size: 26px;
        font-weight: 500;
        letter-spacing: normal;
        line-height: normal;
    }
}
.text-title-l1 {
    font-size: 34px;
    font-weight: 600;
    letter-spacing: normal;
    line-height: normal;
}
@media screen and (max-width: 639px) {
    .text-title-l1 {
        font-size: 20px;
        font-weight: 500;
        letter-spacing: normal;
        line-height: 1.5;
    }
}
.text-title-l2 {
    font-size: 24px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
}
@media screen and (max-width: 639px) {
    .text-title-l2 {
        font-size: 18px;
        font-weight: 500;
        letter-spacing: normal;
        line-height: normal;
    }
}
.title-ds {
    align-items: flex-end;
    color: #fff;
    display: flex;
    justify-content: space-between;
    margin: 0;
}
.title-ds.with-icon {
    align-items: center;
    justify-content: flex-start;
}
.title-ds.with-icon .icon {
    color: #fff;
    fill: #fff;
    height: 43px;
    margin-right: 22px;
    width: 43px;
}
@media screen and (max-width: 639px) {
    .title-ds.with-icon .icon {
        height: 32px;
        margin-right: 12px;
        width: 32px;
    }
}
.transfer-logos {
    align-items: center;
    display: flex;
}
.transfer-logos__logo-st {
    height: 36px;
    width: 186px;
}
.transfer-logos__fans {
    font-weight: 500;
}
.transfer-logos__fans--size--small {
    font-size: 20px;
}
.transfer-logos__fans--size--medium {
    font-size: 29px;
}
.transfer-logos__logo-arrow {
    display: block;
    margin: 0 12px 0 20px;
    opacity: 0.6;
}
.transfer-logos > .site-logo--size--large {
    margin: 0 0 0 8px;
    max-width: none;
}
.signup-form {
    display: flex;
    flex-direction: column;
    width: 100%;
}
.signup-form__field {
    margin-bottom: 16px;
}
.signup-form__input.input {
    background: rgba(255, 255, 255, 0.15);
    transition: all ease 0.25s;
    width: 100%;
}
.signup-form__submit-button {
    width: 100%;
}
.signup-form__terms-warning {
    align-self: center;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 32px;
    font-size: 0.688rem;
    line-height: 1rem;
}
.signup-form__terms-warning .link {
    color: rgba(255, 255, 255, 0.4);
    text-decoration-line: underline;
    transition: all ease 0.25s;
}
.signup-form__terms-warning .link:hover {
    color: rgba(255, 255, 255, 0.6);
}
.signup-form__login-suggestion {
    align-self: center;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 32px;
    transition: all ease 0.25s;
    font-size: 0.813rem;
}
.signup-form__login-suggestion .link {
    color: #f59e0b;
}
.login-form .login-form__signup-description .link:hover,
.signup-form__login-suggestion .link:hover {
    color: #d97706;
}
.referral-program-benefits__title {
    color: #707071;
    font-size: 14px;
    font-weight: 400;
    line-height: 17px;
    margin-bottom: 12px;
}
.referral-program-benefits__benefit {
    align-items: start;
    color: #fff;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 12px;
    justify-content: start;
    margin-bottom: 12px;
}
.referral-program-benefits__bullet {
    background: #d97706;
    border-radius: 8px;
    color: #fff;
    display: grid;
    font-size: 12px;
    font-weight: 700;
    height: 24px;
    place-items: center;
    width: 24px;
}
.referral-program-benefits__benefit-text {
    font-weight: 400;
    margin-top: 4px;
    max-width: 260px;
}
.login-form {
    display: flex;
    flex-direction: column;
    max-width: 100%;
    width: 320px;
}
.login-form .login-form__field {
    margin-bottom: 16px;
}
.login-form .login-form__input.input {
    background: rgba(255, 255, 255, 0.1);
    transition: all ease 0.25s;
    width: 100%;
}
.login-form .login-form__submit-button {
    width: 100%;
}
.login-form .login-form__forgot-password-link {
    align-self: center;
    color: rgba(255, 255, 255, 0.4);
    margin-bottom: 32px;
    text-decoration-line: underline;
    transition: all ease 0.25s;
    font-size: 0.813rem;
}
.login-form .login-form__forgot-password-link:hover,
.personal-notifications-modal-panel .header-notifications-action a {
    color: rgba(255, 255, 255, 0.8);
}
.login-form .login-form__signup-description {
    align-self: center;
    color: rgba(255, 255, 255, 0.4);
    margin-top: 32px;
    transition: all ease 0.25s;
    font-size: 0.813rem;
}
.login-form .login-form__signup-description .link {
    color: #f59e0b;
}
.user-fan-club-subscription-list {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(1, 1fr);
}
@media screen and (min-width: 640px) {
    .user-fan-club-subscription-list {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media screen and (min-width: 1024px) {
    .user-fan-club-subscription-list {
        gap: 20px;
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (min-width: 1366px) {
    .user-fan-club-subscription-list {
        grid-template-columns: repeat(4, 1fr);
    }
}
.smile {
    border: 0;
    display: inline-block;
    margin: 0 4px;
}
.smile--size--small {
    height: 20px;
    margin: 0 4px;
    width: 20px;
}
.smile--size--medium {
    height: 32px;
    margin: 0 10px;
    width: 32px;
}
.smile--size--big-x {
    height: 80px;
    margin: 0 4px;
    width: 80px;
}
.active-smile {
    display: inline-block;
    line-height: 16px;
    padding: 5px;
}
.active-smile:hover > .smile {
    filter: contrast(150%);
    transform: scale(1.2);
}
.active-smile > .smile {
    margin: 0;
    transition: transform 0.2s ease, filter 0.2s;
}
.document-safe-upload-success {
    background: #2f2f2f;
    border-radius: 6px;
    display: grid;
    font-weight: 500;
    grid-gap: 20px;
    justify-items: center;
    max-width: 350px;
    padding: 30px;
    text-align: center;
    -webkit-user-select: none;
    user-select: none;
}
.document-safe-upload-success .icon {
    color: #34b353;
    height: 48px;
    margin: 0;
    width: 48px;
}
.document-safe-upload-success__title {
    font-size: 1.063rem;
    color: #fff;
    font-weight: 500;
    margin: 0;
}
.document-safe-upload-success__description {
    font-size: 0.813rem;
    color: rgba(255, 255, 255, 0.6);
    margin: 0;
}
.document-safe-upload-success .btn {
    margin: 10px 0 0;
    width: 105px;
}
.comments-gallery,
.comments-gallery__wrapper {
    display: flex;
    flex-direction: column;
    max-height: 100%;
}
.comments-gallery__wrapper {
    background: #1b1b1d;
    bottom: 0;
    left: 0;
    position: absolute;
    width: 100%;
}

.comments-gallery__wrapper {
    background: #1b1b1d;
    bottom: 0;
    left: 0;
    position: absolute;
    width: 100%;
}

.liveMobileMain{
    
}
.liveMobileMain .comments-gallery__wrapper{
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.45) 0, transparent 100%);
}

.liveMobileMain .comments-gallery__wrapper{
    top: 65px!important;
    bottom: auto;
}

.liveMobileMain .media-gallery__aside-panel--mobile{
    height: 100vh!important;
}

.comments-gallery__recaptcha-wrapper {
    margin: 0 13px 0 16px;
    position: relative;
    z-index: 2;
}
.comments-gallery__replying-to {
    align-items: center;
    background: #343437;
    bottom: 100%;
    color: #a0a0a1;
    display: flex;
    font-size: 13px;
    justify-content: space-between;
    line-height: 18px;
    margin: 0 0 6px;
    min-height: 30px;
    padding: 4px 16px 4px 12px;
    position: absolute;
    width: 100%;
    word-break: break-word;
    z-index: 2;
}
.comments-gallery__content {
    flex-grow: 1;
    padding: 0 0 20px;
}
.comments-gallery__close {
    cursor: pointer;
    margin: 14px auto 0;
    opacity: 0.2;
    text-align: center;
    -webkit-user-select: none;
    user-select: none;
}
.comments-gallery__count {
    border-bottom: 2px solid rgba(255, 255, 255, 0.03);
    border-top: 2px solid rgba(255, 255, 255, 0.03);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    height: 44px;
    line-height: 20px;
    padding: 10px 16px;
}
.comments-gallery__header {
    margin: 2px 16px;
    position: relative;
}
.comments-gallery__header .displayname__name {
    font-weight: 400;
}
.comments-gallery__header-menu {
    height: 32px;
    position: absolute;
    right: 0;
    top: 14px;
    width: 32px;
}
.comments-gallery__header-menu .icon-three-dots {
    color: #707071;
    transform: rotate(90deg);
}
.comments-gallery__text {
    margin: 0 0 14px;
    max-height: 4.5vh;
    overflow-x: hidden;
    overflow-y: auto;
    white-space: pre-wrap;
    word-break: break-word;
}
.comments-gallery__text--hidden {
    filter: blur(3px);
}
.comments-gallery__load-more.btn {
    align-items: center;
    background: #232325;
    border: 0;
    border-radius: 5px;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 30px;
    justify-content: center;
    margin: 15px 0;
    padding: 0;
    width: 100%;
}
.comments-gallery__load-more.btn:hover {
    background: #343437;
    color: #fff;
}
.comments-gallery__empty {
    align-items: center;
    color: #a0a0a1;
    display: flex;
    flex-direction: column;
    font-size: 13px;
    gap: 22px;
    line-height: 18px;
}
.comments-gallery__comments {
    margin: 0 16px;
}
.comments-gallery__comments--empty {
    align-items: center;
    display: flex;
    justify-content: center;
    min-height: 100%;
    padding: 16px 0 0;
}
.comments-gallery__footer {
    display: block;
    position: relative;
}
.comments-gallery .chat-controls::before {

}
@media screen and (max-width: 639px) {
    .comments-gallery__recaptcha-wrapper {
        min-height: 84px;
    }
    .comments-gallery__recaptcha-wrapper:empty {
        min-height: auto;
    }
}
.bread-crumbs {
    align-items: center;
    display: flex;
    font-size: 32px;
    font-weight: 700;
}
.bread-crumbs__icon {
    height: 44px;
    margin: 0 30px 0 0;
    min-width: 44px;
    width: 44px;
}
.bread-crumbs__item {
    align-items: center;
    display: flex;
    text-decoration: none;
}
.bread-crumbs__item--grow {
    flex: 1;
    max-width: 100%;
}
.bread-crumbs__item .avatar {
    height: 40px;
    margin: 0 8px 0 0;
    width: 40px;
}
.bread-crumbs__right {
    margin: 0 0 0 auto;
}
.bread-crumbs__splitter {
    color: #fff;
    display: block;
    margin: 0 8px;
}
@media screen and (max-width: 639px) {
    .bread-crumbs {
        font-size: 20px;
        margin: 0 10px;
    }
    .bread-crumbs__icon {
        height: 32px;
        margin-right: 12px;
        min-width: 32px;
        width: 32px;
    }
    .settings-navbar{
        margin: 0 10px;
    }
}
.bread-crumbs-back {
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    height: 33px;
    justify-content: center;
    margin: 0 16px 0 4px;
    min-width: 33px;
    text-decoration: none;
}
.bread-crumbs-back__icon {
    color: #a0a0a1;
    height: 16px;
    width: 16px;
}
.tile-button {
    align-items: center;
    border-radius: 11px;
    cursor: pointer;
    display: flex;
    font-size: 13px;
    justify-content: center;
    margin: 0;
    padding: 0 8px;
    position: relative;
    transition: background 0.25s;
    -webkit-user-select: none;
    user-select: none;
}
.tile-button--disabled {
    background: #343437;
    pointer-events: none;
}
.tile-button--color--apply {
    background: #d97706;
    color: #fff;
}
.tile-button--color--apply:hover {
    background: #d97706;
    color: #fff;
}
.tile-button--color--pale {
    background: #232325;
    color: #a0a0a1;
}
.tile-button--color--pale:hover {
    background: #424248;
    color: #fff;
}
.tile-button--color--dark {
    background: #111113;
    color: #fff;
}
.tile-button--color--dark:hover {
    background: #232325;
}
.tile-button--color--regular {
    background: #343437;
    color: #fff;
}
.tile-button--color--regular:hover {
    background: #424248;
}
.tile-button--color--white {
    background: #424248;
    color: #fff;
}
.tile-button--color--transparent {
    background: rgba(5, 5, 6, 0.6);
    color: #fff;
}
.tile-button--color--transparent:hover {
    background: #343437;
}
.tile-button--color--goal {
    background: linear-gradient(263.02deg, #21b062 0, #9cb93d 100%);
    color: #fff;
    transition: none;
}
.tile-button--color--goal:hover {
    background: #21b062;
}
.tile-button--size--small {
    border-radius: 11px;
    height: 36px;
}
.tile-button--size--regular {
    border-radius: 12px;
    height: 40px;
    min-width: 40px;
    padding: 0 12px;
}
.tile-button__icon {
    margin: 0;
}
.tile-button__icon--size--regular,
.tile-button__icon--size--small {
    height: 20px;
    width: 20px;
}
.tile-button__icon--size--large {
    height: 32px;
    width: 32px;
}
.tile-button__count,
.tile-button__text {
    margin: 0 0 0 6px;
}
.tile-button__tooltip {
    margin-top: -5px;
}
.mobile-sticker-back-header {
    align-items: center;
    background: #000;
    display: flex;
    height: 64px;
    width: 100%;
}
.mobile-sticker-back-header::after {
    background: rgba(255, 255, 255, 0.05);
    bottom: 0;
    content: "";
    height: 2px;
    left: 16px;
    pointer-events: none;
    position: absolute;
    right: 16px;
}
.mobile-sticker-back-header__right {
    margin: 0 0 0 auto;
}
.mobile-sticker-back-header .avatar {
    height: 40px;
    margin: 0 12px 0 0;
    width: 40px;
}
.ch {
    box-sizing: content-box;
    color: #fff;
    display: grid;
    font-weight: 500;
    grid-gap: 20px;
    justify-items: center;
    max-width: 400px;
    padding: 30px;
    text-align: center;
}
.ch__upload-icon {
    fill: rgba(255, 255, 255, 0.6);
    height: 48px;
    width: 40px;
}
.ch__title {
    font-size: 1.25rem;
    font-weight: 500;
}
.ch__description {
    font-size: 0.813rem;
    color: rgba(255, 255, 255, 0.8);
}
.ch__divider {
    background-color: rgba(255, 255, 255, 0.2);
    height: 1px;
    width: 100%;
}
.ch__declaimer {
    align-items: center;
    display: grid;
    grid-auto-flow: column;
    grid-gap: 10px;
}
.ch__declaimer-icon {
    fill: rgba(255, 255, 255, 0.4);
    height: 16px;
    width: 12px;
}
.ch__declaimer-text {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.6);
}
.personal-notifications-modal-panel {
    align-items: center;
    align-self: stretch;
    position: relative;
    display: flex;
    flex-direction: row;
}
.personal-notifications-modal-panel__counter {
    color: rgba(255, 255, 255, 0.6);
    font-size: 13px;
    margin: 0 2px 0 0;
}
.personal-notifications-modal-panel-footer {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    bottom: 0;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    font-size: 13px;
    justify-content: space-between;
    padding: 10px 20px;
}
@media screen and (min-width: 640px) {
    .personal-notifications-modal-panel-footer.empty-on-desktop {
        display: none;
    }
}
.personal-notifications-modal-panel-footer-action {
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
}
.personal-notifications-modal-panel-footer-action.disabled {
    opacity: 0.6;
    pointer-events: none;
}
.personal-notifications-modal-panel-footer-action:hover {
    color: #fff;
}
.personal-notifications-modal-panel-footer-action .icon-chart {
    position: relative;
    top: -1px;
}
.personal-notifications-modal-panel-footer-left,
.personal-notifications-modal-panel-footer-right {
    align-items: center;
    display: flex;
}
.personal-notifications-modal-panel-footer-item {
    align-items: center;
    display: flex;
    margin: 0 0 0 8px;
}
.personal-notifications-modal-panel-empty {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
    opacity: 0.6;
    padding: 0 30px;
    text-align: center;
}
.personal-notifications-modal-panel-empty .icon {
    color: #fff;
    fill: #fff;
    height: 66px;
    margin: 0 0 12px;
    width: 66px;
}
.personal-notifications-modal-panel-empty-title {
    font-size: 20px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: 1.5;
    color: #fff;
    margin: 0 0 14px;
}
.personal-notifications-modal-panel-empty-description {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 18px;
    color: rgba(255, 255, 255, 0.6);
    margin: 0 auto;
    max-width: 80%;
}
.media-gallery__root > body,
.personal-notifications-modal-panel .content {
    overflow: hidden;
}
.personal-notifications-modal-panel .header-notifications-subscription {
    border-top: 1px solid #545558;
    position: relative;
    font-size: 0.75rem;
    line-height: 1rem;
}
.personal-notifications-modal-panel .header-notifications-subscription-content {
    background-color: #3e3f42;
    justify-content: space-between;
    opacity: 1;
    padding: 12px 18px;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    display: flex;
    flex-direction: row;
    transition: opacity 200ms "ease-in-out" 500ms;
}
.personal-notifications-modal-panel .header-notifications-subscription-content:nth-of-type(2) {
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.personal-notifications-modal-panel .header-notifications-subscription-content.header-notifications-subscription-content-exit {
    opacity: 0;
}
.personal-notifications-modal-panel .header-notifications-title {
    opacity: 0.6;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.personal-notifications-modal-panel .header-notifications-tooltip {
    display: inline-block;
    padding-left: 5px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
.personal-notifications-modal-panel .header-notifications-tooltip .icon {
    height: 14px;
    margin: 0;
    opacity: 0.6;
    width: 14px;
}
.personal-notifications-modal-panel .header-notifications-tooltip:hover .icon {
    opacity: 1;
}
.personal-notifications-modal-panel .header-notifications-action {
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
.personal-notifications-modal-panel .dropdown-link {
    align-items: center;
    align-self: stretch;
    color: rgba(255, 255, 255, 0.6);
    display: block;
    justify-content: center;
    max-width: 72px;
    position: relative;
    text-decoration: none;
    transition: color 120ms 120ms;
    width: 56px;
    display: flex;
    flex-direction: row;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.personal-notifications-modal-panel .dropdown-link .icon {
    height: 24px;
    width: 24px;
}
.personal-notifications-modal-panel .dropdown-link .icon-notifications {
    height: 16px;
    margin: 0;
    width: 16px;
}
.dropdown-link.has-unread-notifications:after {
    background-color: #e12947;
    border: 2px solid #111113;
    border-radius: 10px;
    content: "";
    height: 12px;
    position: absolute;
    right: 14px;
    top: 14px;
    width: 12px;
}
.personal-notifications-modal-panel .dropdown-link.has-new-notifications .icon-notifications {
    animation: ring 2s ease 1;
}
.personal-notifications-modal-panel .dropdown-link.has-scheduled-posts::after,
.personal-notifications-modal-panel .dropdown-link.has-unread-messages::after {
    background-color: #e12947;
    border: 2px solid #111113;
    border-radius: 10px;
    content: "";
    height: 12px;
    position: absolute;
    right: 13px;
    top: 13px;
    width: 12px;
}
.personal-notifications-modal-panel .dropdown-link.disabled {
    pointer-events: none;
}
@media screen and (max-width: 479px) {
    .personal-notifications-modal-panel {
        flex-grow: 0;
        flex-shrink: 0;
        position: static;
    }
    .personal-notifications-modal-panel .header-dropdown-content-wrapper {
        left: 0;
        right: 0;
    }
    .personal-notifications-modal-panel-controls-online {
        display: none;
    }
    .personal-notifications-modal-panel .dropdown-link {
        padding: 14px;
        width: unset;
    }
}
.personal-notifications-modal-panel-tabs {
    align-items: center;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 20px;
    justify-content: start;
    max-width: min(264px, 65%);
}
.personal-notifications-modal-panel-tabs-item {
    cursor: pointer;
    font-size: 20px;
    font-weight: 700;
    opacity: 0.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.personal-notifications-modal-panel-tabs-item.active {
    opacity: 1;
    pointer-events: none;
}
@media screen and (max-width: 639px) {
    .personal-notifications-modal-panel-tabs-item {
        font-size: 16px;
    }
}
.personal-notifications-modal-panel .personal-notification-body .avatar {
    border: 0;
    flex-shrink: 0;
    height: 44px;
    margin: 0 12px 0 0;
    width: 44px;
}
.personal-notifications-modal-panel .personal-notification-body .avatar .online {
    background: #232325;
    height: 12px;
    left: -3px;
    top: -3px;
    width: 12px;
}
.personal-notifications-modal-panel-content h3 {
    font-size: 16px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal;
    color: #fff;
    margin: 20px;
}
.personal-notifications-modal-panel-header-text {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 1.5;
    background: #343437;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.6);
    margin: 10px 20px 20px;
    padding: 10px 12px;
}
.personal-notifications-modal-panel .personal-notification {
    padding: 10px 30px 10px 20px;
}
.personal-notifications-modal-panel__mass-message-button-wrapper {
    display: flex;
    margin-bottom: 16px;
    padding: 0 20px;
}
@media screen and (max-width: 639px) {
    .personal-notifications-modal-panel__mass-message-button-wrapper {
        padding: 0 12px;
    }
}
.personal-notifications-modal-panel__mass-message-button {
    align-items: center;
    display: flex;
    flex: 1;
    gap: 10px;
}
.chats-filter {
    margin: 0 8px;
    padding-bottom: 12px;
}
.header-dropdown-content-item {
    position: relative;
}
.header-dropdown-content-item:not(:last-child) {
    border-bottom: none;
}
.request-menu-notification-icon {
    color: #a0a0a1;
    margin-right: 8px;
    position: relative;
}
.request-menu-notification-icon.has-unresolved-requests:after {
    background-color: #e12947;
    border: 2px solid #111113;
    border-radius: 50%;
    content: "";
    height: 8px;
    position: absolute;
    right: -4px;
    top: -2px;
    width: 8px;
}
.request-menu-notification-icon.active:after {
    border-color: #343437;
}
.profile-cover-wrapper {
    margin-bottom: 64px;
}
@media screen and (max-width: 767px) {
    .profile-cover-wrapper {
        margin-bottom: 32px;
    }
}

.bs--opened {
    max-height: none
}

.bs__text {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0
}

.bs__shadow-text {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    visibility: hidden
}

@media screen and (max-width:1023px) {
    .bs {
        width: 100%
    }
}
.bs--reposition {
    -webkit-user-select: none;
    user-select: none;
}
.bs__video-parent {
    position: absolute;
    right: 0;
    top: 0;
    transform-origin: left top;
    width: 100%;
}
.bs__avatar-flag {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    display: flex;
    height: 34px;
    justify-content: center;
    position: absolute;
    right: -4px;
    top: 0;
    width: 34px;
}
.bs__st-link {
    align-items: center;
    display: inline-flex;
}
.bs__st-link-content {
    margin-bottom: 2px;
    overflow: hidden;
    position: relative;
}
@media screen and (max-width: 360px) {
    .bs__st-link-content:after {
        background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);
        content: "";
        display: block;
        height: 20px;
        position: absolute;
        right: 0;
        top: 0;
        width: 24px;
    }
}
.bs__live {
    align-items: center;
    background: #ef7d00;
    border-radius: 6px;
    color: #fff;
    column-gap: 4px;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 20px;
    margin: 0 0 0 8px;
    padding: 0 8px 0 4px;
    white-space: nowrap;
}
.bs__live:hover {
    background: #ef7d00;
}
.bs__media {
    max-height: 100%;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: min(1144px, 100%);
}
.bs__media-background-cover {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.bs__media-background-cover--blured {
    filter: blur(20px);
}
.bs__media--no-cover::before {
    background: linear-gradient(180deg, rgba(5, 5, 6, 0) 0, #050506 100%), radial-gradient(50% 200%at 50% 50%, #4a2b08 0, rgba(74, 43, 8, 0) 100%), linear-gradient(0deg, #050506, #050506),
        linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0) 0, #050506 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.bs__media--shadow::after {
    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0) 0, #050506 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.bs__media-aspect-ratio {
    display: block;
    visibility: hidden;
    width: 100%;
}
.bs__media-cover-image {
    left: 0;
    position: absolute;
    top: 0;
    transform-origin: left top;
    width: 100%;
}
.bs__mobile-top-button {
    position: absolute;
    right: 15px;
    top: 70px;
    z-index: 4;
}
.bs__reposition-controls {
    bottom: 95px;
    position: absolute;
    right: 83px;
    z-index: 5;
}
.bs__reposition-controls--mobile {
    display: none;
}
.bs__info {
    margin: 0 auto;
    max-width: 1280px;
    padding: 64px 83px 0;
    position: relative;
    width: 100%;
    z-index: 3;
}
@media screen and (max-width: 1023px) {
    .bs__info {
        padding: 80px 15px 0;
    }
}
.bs__stories {
    margin: 0 auto;
    max-width: 100vw;
    padding: 0 16px;
    position: relative;
    width: 642px;
}
.bs__name-wrapper {
    margin-top: 16px;
}
.bs__name-wrapper .displayname__name {
    word-break: break-word;
}
.bs__username {
    color: #fff;
    opacity: 0.6;
}
.bs__avatar-wrapper {
    position: relative;
    width: 124px;
    z-index: 4;
}
.bs__profile-counters {
    color: rgba(255, 255, 255, 0.8);
    font-weight: 400;
    margin-top: 20px;
    opacity: 0.8;
    font-size: 1rem;
}
.bs__content-counters-wrapper {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 72px;
    justify-content: space-between;
    margin-top: 40px;
    padding: 7px 16px;
    position: relative;
    width: 100%;
    z-index: 5;
}
.bs__content-counters-wrapper::before {
    backdrop-filter: blur(34px);
    background: rgba(255, 255, 255, 0.08);
    border-radius: 20px;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}
.bs__actions {
    display: flex;
    position: relative;
    width: 100%;
}
.bs .dropdown-content {
    padding: 4px 0;
}
.bs__tabs.tabs-ds {
    border-color: 1px solid rgba(255, 255, 255, 0.08);
    justify-content: center;
    margin: 44px 0 0;
    white-space: nowrap;
    width: 100%;
    z-index: 1;
}
.bs__tabs.tabs-ds::after,
.bs__tabs.tabs-ds::before {
    background: rgba(255, 255, 255, 0.08);
    content: "";
    height: 1px;
    pointer-events: none;
    position: absolute;
    top: 100%;
    width: 1200px;
}
.bs__tabs.tabs-ds::before {
    box-sizing: border-box;
    right: 100%;
}
.bs__tabs.tabs-ds::after {
    left: 100%;
}
.bs__content-counters-wrapper--mobile {
    align-items: center;
    backdrop-filter: blur(10px);
    background: rgba(0, 0, 0, 0.2);
    border-radius: 20px;
    display: flex;
    padding: 14px 16px;
    position: absolute;
    right: 80px;
    top: 60px;
    z-index: 1;
}
@media screen and (max-width: 1023px) {
    .bs__content-counters-wrapper--mobile {
        right: 15px;
    }
}
@media (max-width: 1079px) {
    .bs__media--shadow::after {
        background: linear-gradient(0deg, #050506 0, rgba(5, 5, 6, 0.9) 24%, rgba(5, 5, 6, 0.75) 40%, rgba(5, 5, 6, 0.5) 60%, rgba(5, 5, 6, 0) 100%);
    }
    .bs__avatar-wrapper {
        width: 80px;
    }
    .bs__avatar-wrapper .avatar {
        height: 80px;
        min-width: 80px;
        width: 80px;
    }
    .bs__name-wrapper {
        align-items: flex-start;
        flex-direction: column;
    }
    .bs__username {
        margin-left: 0;
    }
    .bs .displayname.displayname--big .displayname__name {
        font-size: 1.75rem;
    }
    .bs__profile-counters {
        font-size: 0.875rem;
    }
    .bs__content-counters-wrapper {
        height: auto;
        margin-top: 16px;
        padding: 0;
    }
    .bs__content-counters-wrapper::before {
        display: none;
    }
    .bs .bs__tabs {
        margin-top: 32px;
    }
    .bs__reposition-controls {
        display: none;
        position: relative;
    }
    .bs__reposition-controls--mobile {
        display: block;
    }
}
.bs__onboarding-badge {
    left: 90px;
    position: absolute;
    top: -10px;
}
.bs .tab-interactive-active-ds .white-color-text-2 {
    color: #a0a0a1;
}
.bs .tabs-ds {
    column-gap: 48px;
}
.bs .tab-ds {
    margin: 0;
}
@media screen and (max-width: 1023px) {
    .bs__onboarding-badge {
        left: 54px;
        top: -4px;
    }
}
@media screen and (max-width: 639px) {
    .bs .tabs-ds {
        column-gap: 32px;
    }
}
@media screen and (max-width: 320px) {
    .bs .tabs-ds {
        column-gap: 24px;
    }
}
.media-processing {
    align-items: center;
    display: flex;
    flex-direction: column;
    left: 50%;
    position: absolute;
    top: 200px;
    transform: translateX(-50%);
    z-index: 5;
}
@media screen and (max-width: 1023px) {
    .media-processing {
        top: 32%;
    }
}
.media-processing .loader-text {
    color: #fff;
    margin-top: 10px;
    max-width: 210px;
    opacity: 0.6;
    text-align: center;
}
.video-player,
.video-player__play {
    display: flex;
    justify-content: center;
    overflow: hidden;
}
.video-player {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    height: 100%;
    position: relative;
    width: 100%;
}
.video-player__play {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    height: 96px;
    left: 50%;
    outline: 0;
    padding: 0;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: background 0.3s, opacity 0.3s;
    width: 96px;
    z-index: 4;
}
.video-player__play--hidden {
    opacity: 0;
    pointer-events: none;
}
.video-player__play--animation-show-hide {
    animation: video-player-animation-play-desktop 0.6s;
}
.video-player__main-control-icon {
    height: 56px;
    opacity: 0.8;
    width: 56px;
}
.video-player__children {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 4;
}
.video-player__video {
    background-color: transparent;
    display: block;
    flex: 1;
    max-height: 100%;
    max-width: 100%;
    position: relative;
    object-fit: cover;
}
.video-player__video--hidden {
    pointer-events: none;
    visibility: hidden;
}
.video-player__controls {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.72) 0, transparent 100%);
    bottom: 0;
    left: 0;
    padding: 40px 10px 16px;
    position: absolute;
    right: 0;
    transition: opacity 0.3s;
    user-select: none;
    z-index: 4;
}
.video-player__controls--hidden {
    opacity: 0;
    pointer-events: none;
}
.video-player__controls-progress {
    cursor: pointer;
    height: 12px;
    position: absolute;
    width: 100%;
    bottom: -9px;
    z-index: 5;
    left: 0;
}
.video-player__controls-progress::before {
    background: rgba(248, 248, 248, 0.4);
    border-radius: 2px;
    content: "";
    cursor: pointer;
    height: 4px;
    left: 0;
    position: absolute;
    width: 100%;
}
.video-player__controls-progress::after {
    content: "";
    height: 35px;
    left: 0;
    position: absolute;
    top: -15px;
    width: 100%;
}
.video-player__controls-progress:hover > .video-player__controls-progress-button {
    pointer-events: auto;
    transform: scale(1);
}
.video-player__controls-progress-line {
    background: #fa0103;
    border-radius: 2px;
    cursor: pointer;
    height: 4px;
    position: relative;
}
.video-player__controls-progress-button {
    background: #fff;
    border: 0;
    border-radius: 50%;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.25);
    cursor: pointer;
    display: block;
    height: 12px;
    padding: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform: scale(0);
    transition: transform 0.15s;
    width: 12px;
    z-index: 2;
}
.video-player__controls-progress-button--active {
    pointer-events: auto;
    transform: scale(1);
}
.video-player__controls-actions {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    justify-content: space-between;
    margin: 12px 4px 0;
}
.video-player__controls-actions-block {
    align-items: center;
    display: flex;
}
.video-player__pause {
    cursor: pointer;
    margin: 0 14px 0 0;
}
.video-player__pause > svg {
    display: block;
    height: 17px;
    width: 17px;
}
.video-player__right-control {
    margin: 0-2px 0 24px;
    padding: 2px;
}
.video-player__right-control:first-child {
    margin-left: 0;
}
.video-player__mute {
    cursor: pointer;
}
.video-player__mute > svg {
    display: block;
    height: 16px;
    transform: scale(1.3);
    width: 18px;
}
.video-player__fullscreen {
    cursor: pointer;
    display: flex;
}
.video-player__controls-actions-block {
    color: #fff;
}
.video-player__timer {
    white-space: nowrap;
}
.video-player--mobile .video-player__controls-progress-button {
    pointer-events: auto;
    transform: scale(1);
}
.video-player--mobile .video-player__play {
    height: 64px;
    width: 64px;
}
.video-player--mobile .video-player__main-control-icon {
    height: 36px;
    width: 36px;
}
.video-player--desktop .video-player__play {
    background: rgba(0, 0, 0, 0.6);
}
.video-player--desktop .video-player__fullscreen,
.video-player--desktop .video-player__mute,
.video-player--desktop .video-player__pause {
    transition: opacity 0.3s;
}
.video-player--desktop .video-player__fullscreen:hover,
.video-player--desktop .video-player__mute:hover,
.video-player--desktop .video-player__pause:hover {
    opacity: 0.5    ;
}
.ci {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 8px;
    justify-content: flex-start;
}
.ci__icon {
    margin-right: 4px;
}
.n__extra {
    animation: opacity-fade-show 0.5s;
}
.n__extra--hide {
    display: none;
}
.n__more {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 4px;
}
.n__shadow-text {
    display: block;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
}
.n__icon--rotate {
    transform: rotate(180deg);
}
.tab-ds,
.tabs-ds {
    align-items: center;
    display: flex;
}
.tabs-ds {
    border-bottom: 1px solid rgba(255, 255, 255, 0.13);
    margin: 0;
    position: relative;
}
.tab-ds {
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.6);
    justify-content: center;
    list-style-type: none;
    margin: 0 28px;
    outline: 0;
    overflow: visible;
    -webkit-user-select: none;
    user-select: none;
}
.tab-ds:first-child {
    margin-left: 0;
}
.tab-ds:last-child {
    margin-right: 0;
}
.tab-ds:hover {
    color: rgba(255, 255, 255, 0.8);
}
@media (max-width: 639px) {
    .tab-ds--adaptive {
        flex: 1;
        margin: 0;
    }
}
.tab-interactive-ds {
    align-items: center;
    display: flex;
    position: relative;
}
.tab-interactive-medium-ds,
.tab-interactive-small-ds {
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.tab-interactive-small-ds {
    font-size: 13px;
    margin-right: 30px;
    padding: 9px 0;
}
.tab-interactive-medium-ds {
    font-size: 15px;
    height: 50px;
    padding: 0 0 12px;
}
.tab-interactive-active-ds {
    color: #fff;
}
.tab-interactive-active-ds:active,
.tab-interactive-active-ds:focus,
.tab-interactive-active-ds:hover {
    color: #fff;
}
.tab-interactive-active-ds::after {
    background: var(--primary-border);
    border-radius: 3px;
    bottom: -1px;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%;
}
.tab-link-ds {
    flex: 1;
    justify-content: center;
}
.tab-link-ds,
.tab-link-ds:active,
.tab-link-ds:hover {
    text-decoration: none;
}
.tab-link-ds:focus {
    text-decoration: inherit;
}
.not-found-wrapper {
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: column;
}
.not-found-wrapper .not-approved-model,
.not-found-wrapper .not-found-error {
    justify-content: space-around;
    margin: 100px 0;
    max-width: 900px;
    width: 100%;
    display: flex;
    flex-direction: column;
}
.not-found-wrapper .description-wrapper,
.not-found-wrapper .icon-wrapper,
.not-found-wrapper .text-wrapper {
    justify-content: center;
    flex: 1;
    flex-basis: 50%;
    flex-grow: 1;
    flex-shrink: 0;
}
.not-found-wrapper .icon-wrapper,
.not-found-wrapper .text-wrapper {
    display: flex;
    flex-direction: row;
}
.not-found-wrapper .text-wrapper {
    color: #fff;
    font-weight: 700;
    font-size: 4.5rem;
    line-height: 5.438rem;
    letter-spacing: 0.27rem;
}
.not-found-wrapper .description-wrapper {
    align-items: center;
    margin-left: 10px;
    margin-top: 16px;
    display: flex;
    flex-direction: column;
}
.not-found-wrapper .description {
    color: rgba(255, 255, 255, 0.8);
    font-weight: 500;
    margin-bottom: 32px;
    max-width: 100%;
    font-size: 1.5rem;
    line-height: 1.813rem;
}
.not-found-wrapper .icon-blocked {
    fill: #f8f8f8;
    height: 160px;
    width: 160px;
}
@media screen and (max-width: 1023px) {
    .not-found-wrapper .not-found-error .description-wrapper {
        flex: 1;
        flex-basis: 40%;
        flex-grow: 1;
        flex-shrink: 0;
    }
    .not-found-wrapper .not-found-error .description {
        font-size: 1.25rem;
        line-height: 1.625rem;
    }
}
@media screen and (max-width: 639px) {
    .not-found-wrapper .not-approved-model,
    .not-found-wrapper .not-found-error {
        align-items: center;
        margin: 60px 0;
    }
    .not-found-wrapper .not-approved-model .icon-blocked,
    .not-found-wrapper .not-found-error .icon-blocked {
        height: 120px;
        width: 120px;
    }
    .not-found-wrapper .not-approved-model .description-wrapper,
    .not-found-wrapper .not-found-error .description-wrapper {
        align-items: center;
        margin-left: 0;
        margin-top: 50px;
    }
    .not-found-wrapper .not-approved-model .description,
    .not-found-wrapper .not-found-error .description {
        text-align: center;
        font-size: 1.125rem;
        line-height: 1.375rem;
    }
}
.user-tags-list-gallery,
.user-tags-list-gallery__wrapper {
    display: flex;
    flex-direction: column;
    max-height: 100%;
}
.user-tags-list-gallery__wrapper {
    background: #1b1b1d;
    bottom: 0;
    left: 0;
    position: absolute;
    width: 100%;
}
.user-tags-list-gallery__close {
    cursor: pointer;
    margin: 14px auto 0;
    opacity: 0.2;
    -webkit-user-select: none;
    user-select: none;
}
.modal-ds-overlay {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    padding: 20px;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 500;
}
.modal-ds-overlay__background {
    animation: opacity-fade-show 0.5s;
    background: rgba(0, 0, 0, 0.8);
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1;
}
.modal-ds-overlay__background--hide {
    animation: opacity-fade-hide 0.5s;
    opacity: 0;
}
.modal-ds-overlay--fullscreen-mobile .modal-ds-body {
    background-color: #1b1b1d;
    bottom: 0;
    height: auto;
    left: 0 !important;
    margin-top: 0 !important;
    max-width: 100vw;
    min-height: auto;
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    transform: none !important;
    width: 100%;
}
.modal-ds-overlay--fullscreen-mobile .modal-ds-body--black {
    background: #000;
}
.modal-ds-overlay--fullscreen-mobile .modal-ds-body .modal-ds-footer {
    background: 0 0 !important;
}
.modal-ds-overlay--fullscreen-mobile .modal-ds-content {
    background: 0 0;
    display: flex;
    height: 100%;
}
.modal-ds-overlay .modal-ds-close-icon-in-header {
    margin-left: auto;
}
@media screen and (max-width: 767px) {
    .modal-ds-overlay {
        padding-left: 14px;
        padding-right: 14px;
    }
}
.modal-ds-body {
    align-items: stretch;
    animation: opacity-fade-show-modal 0.5s ease;
    color: #fff;
    cursor: initial;
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    justify-content: flex-start;
    margin: 0 auto;
    max-height: 100%;
}
.modal-ds-body--disabled {
    opacity: 0.3;
    pointer-events: none;
}
.modal-ds-body--size--small {
    max-width: min(100vw - 32px, 460px);
}
.modal-ds-body--size--regular {
    max-width: calc(100vw - 32px);
    width: 500px;
}
.modal-ds-body--size--goal,
.modal-ds-body--size--wide {
    max-width: calc(100vw - 20px);
}
.modal-ds-body--size--goal {
    width: 328px;
}
.modal-ds-body--background--dark {
    background: #1b1b1d;
}
.modal-ds-body--background--none {
    background: 0 0;
}
.modal-ds-body--hide {
    animation: opacity-fade-hide-modal 0.5s ease;
    opacity: 0;
}
.modal-ds-close-icon:hover {
    color: #f8f8f8;
}
.modal-ds-header {
    align-items: center;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    overflow: hidden;
    padding: 5px;
}
.modal-ds-close-icon-disabled {
    opacity: 0;
}
.modal-ds-content {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    position: relative;
    width: 100%;
}
.modal-ds-content--vertical-center {
    justify-content: center;
}
.modal-ds-content--spaced {
    padding: 24px;
}
.modal-ds-content--background--dark {
    background: #1b1b1d;
}
.modal-ds-content--background--regular {
    background: #232325;
}
.modal-ds-content--radius--small {
    border-radius: 12px;
}
.modal-ds-content--radius--middle {
    border-radius: 16px;
}
.modal-ds-content--radius--big {
    border-radius: 22px;
}
.modal-body {
    flex-basis: content;
}
.modal-body--padding--regular {
    padding: 24px;
}
.modal-ds-close-icon {
    color: rgba(248, 248, 248, 0.4);
}
.modal-ds-close-icon-top-right {
    position: absolute;
    right: 4px;
    top: 4px;
}
.modal-ds-footer {
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    bottom: 0;
    left: 0;
    min-height: 74px;
    overflow: hidden;
    position: absolute;
    width: 100%;
    z-index: 1;
}
.modal-ds-footer--background--dark {
    background: rgba(27, 27, 29, 0.7);
}
.modal-ds-footer-placeholder {
    height: 74px;
}
.y {
    position: relative;
    width: 100%;
}
@media only screen and (max-width: 639px) {
    .y {
        display: flex;
        flex: 1;
        flex-direction: column;
        height: 100%;
    }
}
.y__header {
    margin: -20px -20px 20px;
}
.y .info {
    font-size: 13px;
    margin-bottom: 20px;
    margin-top: 10px;
    opacity: 0.6;
}
.y .photo-cut-frame-wrapper {
    display: none;
}
.y .photo-cut-source-container {
    min-height: 250px;
    padding: 0 30px;
    position: relative;
    width: 100%;
}
@media only screen and (max-width: 640px) {
    .y .photo-cut-source-container {
        flex: 1;
    }
}
.y .photo-cut-source-container .photo-cut-canvas-video {
    border-radius: 12px;
    display: block;
    margin: 0 auto;
    max-width: 100%;
}
@media only screen and (max-width: 640px) {
    .y .photo-cut-source-container .photo-cut-canvas-video {
        height: 100%;
        object-fit: cover;
    }
}
.y__devices-control {
    margin-bottom: 8px;
}
.y__camera-placeholder {
    align-items: center;
    display: flex;
    flex-direction: column;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.y__camera-blocked-error {
    align-items: center;
    background: #000;
    display: flex;
    flex-direction: column;
    height: 250px;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1;
}
.y__camera-blocked-error-icon {
    color: #fff;
    fill: currentColor;
    height: 40px;
    width: 40px;
}
.y__placeholder-text {
    line-height: 18px;
    margin-top: 16px;
    text-align: center;
}
.y__video-devices-select {
    margin-bottom: 10px;
    margin-top: -10px;
    max-width: 351px;
    width: 100%;
}
.create-content-menu {
    background: #232325;
    border-radius: 16px;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    color: #cfcfd0;
    overflow: hidden;
    text-align: left;
    white-space: nowrap;
}
.create-content-menu__item {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: 15px;
    font-weight: 400;
    line-height: 18px;
    min-height: 56px;
    padding: 4px 20px;
}
.create-content-menu__item--disabled {
    color: #707071;
    pointer-events: none;
}
.create-content-menu__item:hover {
    background: #343437;
}
.create-content-menu__icon {
    margin: 0 20px 0 0;
}
.create-content-menu__icon--style--teaser {
    color: #fccf49;
}
.create-content-menu__description {
    color: #707071;
    font-size: 12px;
}
.bg {
    height: 56px;
}
.bg__header-top {
    align-items: stretch;
    display: flex;
    height: 56px;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: var(--pwa-notification-height);
    z-index: 11;
}
.bg__header-top--theme--purple {
    background: #290e3f;
}
.bg__header-top--theme--purple .btn-outline-pale {
    background: #290e3f;
    border-color: #5f5f61;
    transition: border-color 200ms linear;
}
.bg__header-top--theme--purple .btn-outline-pale:focus {
    border-color: #5f5f61;
}
.bg__header-top--theme--purple .btn-outline-pale:active,
.bg__header-top--theme--purple .btn-outline-pale:hover {
    background: #290e3f;
    border-color: #a0a0a1;
}
.bg__header-top--theme--dark {
    background: #111113;
}
.bg__nav-left {
    align-items: center;
    display: flex;
    flex: 1;
    justify-items: flex-start;
}
@media screen and (max-width: 479px) {
    .bg__nav-left {
        flex: 1 1 50%;
    }
}
.bg__nav-center {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
    margin: 0 8px;
}
@media screen and (max-width: 767px) {
    .bg__nav-center {
        justify-content: flex-end;
    }
}
.bg__nav-right {
    align-items: stretch;
    display: flex;
    justify-content: flex-end;
}
@media screen and (min-width: 640px) {
    .bg__nav-right {
        flex: 1;
    }
}
.bg__login-buttons {
    align-items: center;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 12px;
    justify-content: flex-end;
    margin: 0 20px;
    min-width: 90px;
    transition: opacity 250ms;
}
.bg__navigation {
    align-items: center;
    display: flex;
    justify-items: flex-start;
    margin-left: 18px;
}
.bg__logo-wrapper {
    align-items: center;
    display: flex;
    justify-content: flex-start;
}
@media screen and (max-width: 479px) {
    .bg__logo-wrapper {
        flex: 1;
    }
}
.bg__link {
    align-items: center;
    color: #a0a0a1;
    cursor: pointer;
    display: inline-flex;
    font-size: 15px;
    height: 56px;
    margin: 0 16px;
    position: relative;
    white-space: nowrap;
}
.bg__link--theme--purple {
    color: #d4cfd9;
}
.bg__link:hover {
    color: #fff;
}
.bg__link--split {
    margin-left: 32px;
}
.bg__link--split::after {
    background: rgba(255, 255, 255, 0.1);
    bottom: 12px;
    content: "";
    left: -24px;
    position: absolute;
    top: 12px;
    width: 1px;
}
.bg__link.active::before {
    background: var(--primary-border);
    bottom: 0;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%;
}
.bo {
    align-items: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 50%;
    display: flex;
    height: 56px;
    justify-content: center;
    min-width: 56px;
    position: relative;
    transition: 0.3s color;
    width: 56px;
}
.bo::before {
    border: 4px solid currentColor;
    border-radius: 50%;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: 0.3s color;
    z-index: 1;
}
.bo--style--uploading {
    color: #f59e0b;
}
.bo--style--uploading::before {
    color: #442068;
}
.bo--style--done {
    color: #21b062;
}
.bo--style--create-failed,
.bo--style--uploading-failed {
    color: #ef7d00;
    cursor: pointer;
}
.bo--style--create-failed::before,
.bo--style--uploading-failed::before {
    color: #570e22;
}
.bo__shadow {
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.bo__circle {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}
.bo__status {
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    position: absolute;
}
.bo__count {
    align-items: center;
    background: currentColor;
    border-radius: 8px;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    height: 16px;
    justify-content: center;
    min-width: 16px;
    padding: 0 4px;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}
.empty-page-content {
    color: #a0a0a1;
    max-width: 420px;
    text-align: center;
}
.empty-page-content--big {
    margin: 30px auto 120px;
}
.empty-page-content--small {
    margin: 30px auto;
}
.empty-page-content__title {
    margin: 0 0 10px;
}
.empty-page-content__title--big {
    font-size: 24px;
    font-weight: 500;
}
.empty-page-content__description {
    max-width: 360px;
}
.empty-page-content__description--big {
    margin: 20px auto 0;
}
.empty-page-content__description--small {
    margin: 0 auto;
}
.empty-page-content__icon {
    color: #707071;
}
.empty-page-content__icon,
.empty-page-content__icon--big {
    height: 74px;
    margin: 0 auto 30px;
    width: 74px;
}
.empty-page-content__icon--small {
    height: 32px;
    margin: 0 auto 12px;
    width: 32px;
}
.notification-texts-referral {
    align-items: center;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    justify-content: center;
    line-height: 20px;
    min-height: 52px;
    padding: 6px 20px;
}
.notification-texts-referral__left {
    margin: 0 10px 0 0;
}
.notification-texts-referral__left .smile {
    height: 24px;
    width: 24px;
}
.notification-texts-referral__right {
    margin: 0 0 0 8px;
}
.notification-texts-referral__right .smile {
    height: 32px;
    width: 32px;
}
.header-notification .notification-texts-referral {
    padding: 0;
    text-align: left;
}
.bf {
    --search-width: 340px;
    padding: 0 0 0 8px;
}
.bf--type--compact-phone {
    cursor: pointer;
}
.bf--type--compact {
    cursor: pointer;
    position: relative;
}
.bf--theme--purple .bf__wrapper {
    background: #3f2753;
}
@media screen and (max-width: 479px) {
    .bf--theme--purple .bf__wrapper {
        box-shadow: 0 2px 0#d97706;
    }
    .br__stories {
        padding-left: 10px!important;
    }   
    .bp--style--pinned{
        margin-top: 15px!important;
    } 
}
.bf--theme--purple .bf__wrapper--focused,
.bf--theme--purple .bf__wrapper:hover {
    border-color: #3f2753;
}
.bf--theme--purple .island-block {
    background: #290e3f;
}
.bf--theme--purple .username-inline-card:hover {
    background: #3f2753;
}
.bf--theme--purple .header-search-result__button {
    background: rgba(255, 255, 255, 0.1);
}
.bf--theme--purple .header-search-result__button:hover {
    background: rgba(255, 255, 255, 0.2);
}
.bf--landing .bf__wrapper {
    z-index: 11;
}
.bf__wrapper {
    background: #232325;
    border: 2px solid transparent;
    border-radius: 12px;
    color: #fff;
    height: 36px;
    position: relative;
    transition: border-color 0.3s;
}
.bf__wrapper:hover {
    border-color: #343437;
}
.bf__wrapper--focused {
    background: #343437;
}
.bf__wrapper--type--compact-phone {
    border: 0;
    border-radius: 0;
    height: 44px;
    left: 0;
    position: absolute;
    top: 56px;
    width: 100vw;
}
.bf__wrapper--type--compact {
    margin: 20px 0 0;
    max-width: 100vw;
    position: absolute;
    right: 0;
    top: 100%;
    width: var(--search-width);
}
.bf__wrapper--type--big-laptop {
    width: 220px;
}
.bf__wrapper--type--big-desktop {
    width: 340px;
}
.bf__label {
    align-items: center;
    color: inherit;
    display: flex;
    height: 100%;
    padding: 0 12px;
    position: relative;
    width: 100%;
}
.bf__input {
    background: 0 0;
    border: 0;
    border-radius: 0;
    color: inherit;
    flex: 1;
    font-size: 13px;
    margin: 0 0 0 8px;
    padding: 0;
}
.bf__input::-webkit-search-cancel-button {
    display: none;
}
.bf__icon {
    color: #a0a0a1;
    height: 20px;
    min-width: 20px;
    width: 20px;
}
.bf__icon-compact {
    color: #a0a0a1;
    height: 24px;
    width: 24px;
}
.bf__reset {
    align-items: center;
    border-radius: 4px;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 20px;
    justify-content: center;
    position: absolute;
    right: 10px;
    width: 20px;
}
.bf__reset:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
}
.bJ__header {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin: 48px 0 32px;
}
@media screen and (max-width: 767px) {
    .bJ__header {
        align-items: stretch;
        flex-direction: column;
    }
}
.bJ__tabs-container {
    min-width: 240px;
}
.bJ__tabs-container .pill-page-tabs {
    margin: 0;
}

#modelsResult {
    grid-template-columns: repeat(6, 1fr);
}

.liveModels{
  grid-template-columns: repeat(8, 1fr)!important;  
}


.discoverPosts{
  grid-template-columns: repeat(7, 1fr)!important;  
}

.discoverPosts.bl{ 
    padding: 1px;
    grid-gap: 1px!important;
}

.discoverPosts .bL__item{
    height: 190px!important;
}

.discoverPosts .bL__item .a{
    border-radius: 1px!important;
}

.discoverPosts .bL__item .a .a__bottom-shadow{
    background: linear-gradient(180deg, transparent 0, rgb(0 0 0 / 51%) 100%);
    border-bottom-left-radius: 1px;
    border-bottom-right-radius: 1px;
}

.discoverPosts .a__bottom-avatar{
    position: absolute;
    bottom: 5px;
}

.discoverModels{
 
}
.discoverModels .a{
    height: 320px!important;
}
.discoverModels .a .avatar{
    --avatar-size: 40px;
}
.discoverReels{
 
} 
.discoverReels .bL__item{
    height: 210px!important;
}
#reelsResult {
    grid-template-columns: repeat(8, 1fr);
}
.reelsPage{
    display: flex;
}
.reelsLeft{
    flex-basis: 100%;
    display: inline-block;
    height: 100vh;
    overflow: auto;
}
.reelsRight{
    flex-basis: 45%;
    display: inline-block;
    height: 100vh;
}

@media (max-width: 640px) {
    .bJ__header {
        margin: 20px 0;
        padding-left: 10px;
        padding-right: 10px;
    }
    #modelsResult {
        grid-template-columns: repeat(2, 1fr);
        padding: 1px;
        grid-gap: 1px!important;
    }
    #reelsResult {
        grid-template-columns: repeat(4, 1fr);
    }    
    .discoverReels .bL__item{
        height: 160px!important;
    }    
    .liveModels{
      grid-template-columns: repeat(3, 1fr)!important; 
      padding: 1px!important; 
    }
    .liveModels .a__controls {
        display: none;
    }  

    .discoverPosts{
      grid-template-columns: repeat(3, 1fr)!important;  
    }

    .discoverPosts .bL__item{
        height: 160px!important;
    }

    .discoverPosts  .displayname__name{
        font-size: 12px !important;
    }

    .discoverModels .a{
        height: 280px!important;
        border-radius: 0!important;
    }
    .discoverModels .a .avatar{
        --avatar-size: 36px;
    }   
    .g {
        padding: 5px;
        height: 310px!important;
    } 
    .a__bottom-shadow{
        border-radius: 0!important;
    }
    .a--squad{
        border-radius: 0!important;
    }
    .user-status-icon {
        top:-8%!important;
        left: -5%!important;
        width: 30%!important;
        height: 30%!important;
        background: none!important;
    }      
}

@media (min-width: 768px) and (max-width: 1024px){ 
    #modelsResult {
        grid-template-columns: repeat(4, 1fr);
        padding: 1px;
        grid-gap: 1px!important;
    }  
    .liveModels{
      grid-template-columns: repeat(4, 1fr)!important; 
      padding: 1px!important; 
    }
    .a__bottom-shadow{
        border-radius: 0!important;
    }
    .a--squad{
        border-radius: 0!important;
    }   
    .discoverModels .a{
        height: 280px!important;
        border-radius: 0!important;
    }    
    .liveModels .a__controls {
        display: none;
    }  

    .discoverPosts{
      grid-template-columns: repeat(4, 1fr)!important;  
    }

    .discoverPosts .bL__item{
        height: 200px!important;
    }

    .a{
        border-radius: 1px!important;
    } 
    .user-status-icon {
        top:-8%!important;
        left: -5%!important;
        width: 30%!important;
        height: 30%!important;
        background: none!important;
    }        
}

.settings-content {
    position: relative;
}
.settings-content__sub-title {
    color: #a0a0a1;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    margin: 16px 0;
}
.settings-wrapper {
    display: flex;
}
.settings-left,
.settings-right {
    flex-basis: 50%;
    min-width: 0;
}
.settings-right {
    padding-left: 20px;
}
.settings-form__actions {
    border-top: 2px solid rgba(255, 255, 255, 0.05);
    display: flex;
    justify-content: flex-end;
    padding-top: 20px;
}
.settings-form__actions .btn-large {
    margin: 0 0 0 16px;
}
.settings-form.settings-form-privacy .select {
    width: 100%;
}
.settings-field {
    margin-bottom: 20px;
}
@media screen and (max-width: 480px) {
    .settings-field {
        justify-content: space-between;
    }
}
.settings-field__tooltip {
    margin-left: 8px;
}
@media screen and (max-width: 480px) {
    .settings-field {
        flex-wrap: wrap;
    }
}
.settings-label {
    color: rgba(255, 255, 255, 0.9);
    display: block;
    font-weight: 700;
    font-size: 0.813rem;
}
.settings-hint,
.settings-label .input-optional {
    color: rgba(255, 255, 255, 0.6);
}
.settings-hint {
    font-size: 0.688rem;
}
.settings-label {
    margin-bottom: 6px;
}
.settings-input {
    margin-bottom: 10px;
}
.settings-input .input-wrapper {
    width: 100%;
}
.settings-input,
.settings-label {
    align-items: center;
    padding-bottom: 0;
    text-align: left;
    display: flex;
    flex-direction: row;
}
.settings-input:last-child,
.settings-label:last-child {
    padding-bottom: 0;
}
.settings-input {
    position: relative;
}
@media screen and (max-width: 480px) {
    .settings-input.settings-input-switcher {
        flex: 0;
    }
}
@media screen and (max-width: 1023px) {
    .settings-wrapper {
        flex-direction: column;
    }
    .settings-left {
        flex-basis: auto;
    }
    .settings-right {
        flex-basis: auto;
        padding: 20px 0 0;
    }
}
.settings-navbar {
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    margin-bottom: 40px;
}
.settings-navbar__tabs.tabs-ds {
    border: 0;
    white-space: nowrap;
}
.settings-navbar__alert-badge {
    left: 100%;
    margin: 0 0 0 2px;
    position: absolute;
    top: 4px;
}
.media-gallery {
    bottom: 0;
    left: 0;
    position: fixed;
    top: 0;
    width: 100vw;
    z-index: 211;
    background: rgb(5 5 6 / 70%);
}
.media-gallery__root {
    min-height: 100vh;
    overflow: hidden;
}
.media-gallery--desktop .media-gallery__content-wrapper {
    transition: right 0.2s;

}
.media-gallery--desktop .media-gallery__thumb {
    overflow: hidden;
}

.streamingWrapper .fluid_video_wrapper video {
    border-radius: 16px;
}
.media-gallery--desktop{
    max-width: 1460px;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 100vh;
}
.media-gallery--desktop .media-gallery__content {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    bottom: 84px;
    left: 0px;
    right: 0px;
    top: 0px;
    border-radius: 16px;
    max-width: 1200px;

}
.media-gallery--desktop .media-gallery__aside-panel {
    bottom: 18px;
    right: 66px;
    top: 24px;
    width: 300px;
}
.media-gallery--desktop.media-gallery--aside .media-gallery__content-wrapper {
    right: 374px;
}
.media-gallery--desktop .media-gallery__info {
    align-items: center;
    bottom: 21px;
    display: flex;
    font-size: 13px;
    height: 36px;
    left: 40px;
}
.media-gallery--desktop .media-gallery__close {
    opacity: 0.5;
    right: 95px;
    top: 44px;
}
.media-gallery--desktop .media-gallery__controls-panel {
    bottom: 20px;
    right: 20px;
}
.media-gallery--desktop .media-gallery__info-sub-title {
    display: none;
}
.media-gallery__bottom-shadow {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.72) 0, transparent 100%);
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity 0.3s;
    width: 100%;
    z-index: 1;
}
.media-gallery--mobile-portrait .media-gallery__info {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.72) 0, transparent 100%);
    box-sizing: border-box;
    display: flex;
    font-size: 16px;
    height: 175px;
    justify-content: center;
    left: 0;
    padding: 34px 0 0;
    top: 0;
    width: 100%;
}
.media-gallery--mobile-portrait .media-gallery__close {
    opacity: 0.6;
    right: 26px;
    top: 32px;
}
.media-gallery--mobile-portrait .media-gallery__content {
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
}
.media-gallery--mobile-portrait .media-gallery__controls-panel {
    bottom: 24px;
    left: 10px;
    right: 10px;
}
.media-gallery--mobile-portrait .media-gallery__bottom-shadow {
    height: 175px;
}
.media-gallery--mobile-portrait .media-gallery__info-icon {
    display: none;
}
.media-gallery--mobile-portrait .media-gallery__info-title {
    bottom: 80px;
    left: 16px;
    position: fixed;
}
.media-gallery--mobile-portrait .video-player__controls {
    padding-bottom: 74px;
}
.media-gallery--mobile-landscape .media-gallery__content {
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
}
.media-gallery--mobile-landscape .media-gallery__info-title {
    bottom: 24px;
    left: 16px;
    position: fixed;
}
.media-gallery--mobile-landscape .media-gallery__counter {
    opacity: 0.8;
}
.media-gallery--mobile-landscape .media-gallery__info-icon {
    display: none;
}
.media-gallery--mobile-landscape .media-gallery__info {
    font-size: 16px;
    left: 16px;
    top: 24px;
}
.media-gallery--mobile-landscape .media-gallery__bottom-shadow {
    height: 100px;
}
.media-gallery--mobile-landscape .media-gallery__close {
    opacity: 0.6;
    right: 22px;
    top: 24px;
}
.media-gallery--mobile-landscape .media-gallery__controls-panel {
    bottom: 10px;
    right: 10px;
    top: 10px;
}
.media-gallery__content-wrapper {
    left: 50px;
    position: absolute;
    background: #000;
    bottom: 18px;
    right: 66px;
    top: 24px;
    border-radius: 16px;
}
.media-gallery__content {
    position: absolute;
}
.media-gallery__aside-panel {
    position: absolute;
    z-index: 3;
}
.media-gallery__aside-panel--mobile {
    bottom: 0px;
    left: 0;
    right: 0;
    height: 200px;
}
.media-gallery__aside-panel-expand {
    color: #fff;
    cursor: pointer;
    margin: 0 16px 0 0;
    opacity: 0.4;
    position: absolute;
    right: 100%;
    top: 0;
    transition: opacity 0.3s;
}
.media-gallery__aside-panel-expand:hover,
.media-gallery__thumb:hover {
    opacity: 1;
}
.media-gallery__image-desktop,
.media-gallery__play {
    align-items: center;
    display: flex;
    justify-content: center;
}
.media-gallery__play {
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    height: 20px;
    width: 20px;
}
.media-gallery__image-desktop {
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.media-gallery__controls-panel {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    position: absolute;
    transition: opacity 0.3s;
    z-index: 3;
}
.media-gallery__image-thumbs {
    bottom: 22px;
    height: 36px;
    left: 50%;
    max-width: calc(100% - 200px);
    overflow: hidden;
    position: absolute;
    transform: translateX(-50%);
}
.media-gallery__image-thumbs::after,
.media-gallery__image-thumbs::before {
    background: linear-gradient(270deg, transparent 0, rgba(0, 0, 0, 0.7) 52.29%, #000 100%);
    bottom: 0;
    content: "";
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 36px;
    z-index: 2;
}
.media-gallery__image-thumbs::after {
    left: 0;
}
.media-gallery__image-thumbs::before {
    right: 0;
    transform: rotate(180deg);
}
.media-gallery__image-thumbs--left-edge::after,
.media-gallery__image-thumbs--right-edge::before {
    opacity: 0;
}
.media-gallery__info-sub-title {
    font-size: 12px;
    font-weight: 700;
    margin: 4px 0 0;
    opacity: 0.8;
}
.media-gallery__image-thumbs-scroll {
    display: flex;
    height: 80px;
    overflow-x: auto;
    overflow-y: hidden;
}
.media-gallery__thumb {
    align-items: center;
    background: no-repeat center;
    background-size: cover;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex: 1;
    height: 36px;
    justify-content: center;
    margin: 0 4px;
    min-width: 36px;
    opacity: 0.4;
    pointer-events: none;
    position: relative;
    transition: opacity 0.3s;
}
.media-gallery__thumb--clickable {
    pointer-events: auto;
}
.media-gallery__arrow:hover,
.media-gallery__close:hover,
.media-gallery__thumb--active {
    opacity: 1;
}
.media-gallery__arrow {
    align-items: center;
    bottom: 70px;
    color: #fff;
    display: flex;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 120px;
}
.media-gallery__arrow--active {
    cursor: pointer;
    opacity: 0.6;
    pointer-events: auto;
}
.media-gallery__arrow--left {
    left: 0;
}
.media-gallery__arrow--right {
    right: 0;
}
.media-gallery__info {
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 36px;
    position: absolute;
    transition: opacity 0.3s;
    z-index: 3;
}
.media-gallery__info-icon {
    align-items: center;
    display: flex;
    height: 32px;
    justify-content: center;
    margin: 0 10px 0 0;
    width: 32px;
}
.media-gallery__counter {
    color: #fff;
    white-space: pre;
}
.media-gallery__counter-text {
    color: #fff;
}
.media-gallery__close {
    color: #fff;
    cursor: pointer;
    position: absolute;
    transition: opacity 0.3s;
    z-index: 5;
}
.media-gallery__close,
.media-gallery__close > svg {
    height: 18px;
    width: 18px;
}
.media-gallery__image-swiper {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.media-gallery__image-swiper .image-swiper__arrow {
    display: none;
}
.media-gallery--no-controls .media-gallery__bottom-shadow,
.media-gallery--no-controls .media-gallery__close,
.media-gallery--no-controls .media-gallery__controls-panel,
.media-gallery--no-controls .media-gallery__info {
    opacity: 0;
    pointer-events: none;
}
.cB {
    background-color: #1b1b1d;
    border-radius: 8px;
    max-width: 100%;
    padding: 20px 30px;
    width: 680px;
}
.cB .controls {
    display: flex;
    gap: 16px;
    justify-content: flex-end;
}
.username-input-wrapper .username-input-wrapper-input {
    position: relative;
}
.username-input-wrapper .username-input-wrapper-input .input {
    padding-right: 40px;
}
.username-input-wrapper .username-input-wrapper-input > .icon {
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
}
.username-input-wrapper .username-input-wrapper-input > .icon.icon-check-1 {
    color: #629a54;
}
.username-input-wrapper .username-input-wrapper-input > .icon.icon-close-5 {
    fill: #d54d3e;
}
@media screen and (max-width: 1023px) {
    .one-time-tooltip {
        display: block;
    }
}
.progress-bar {
    position: relative;
    display: flex;
    flex-direction: column;
}
.progress-bar__range {
    justify-content: space-between;
    margin-bottom: 5px;
    display: flex;
    flex-direction: row;
}
.progress-bar__progress-range-item {
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.625rem;
    line-height: 0.75rem;
}
.progress-bar__progress-wrapper {
    overflow: hidden;
    position: relative;
    display: flex;
    flex-direction: row;
}
.progress-bar__bubble {
    align-items: center;
    background: #21b062;
    border-radius: 16px;
    display: flex;
    font-size: 11px;
    font-weight: 500;
    height: 16px;
    padding: 0 6px;
    pointer-events: none;
    position: absolute;
    text-shadow: 0 0 1px rgba(0, 0, 0, 0.6);
    top: -5px;
    transform: translateX(-50%);
}
.progress-bar__progress {
    transition: flex 0.2s linear;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1;
}
.progress-bar__text-wrapper {
    align-items: center;
    color: rgba(255, 255, 255, 0.7);
    justify-content: center;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    display: flex;
    flex-direction: row;
    font-size: 0.75rem;
}
.progress-bar.completed {
    background-color: #4b6b46;
    border-color: #83a266;
    padding: 0;
    transition: all 0.2s ease-in-out 0s;
}
.progress-bar.completed .progress-bar__progress {
    background: #4b6b46;
}
.progress-bar.completed .progress-bar__text-wrapper {
    align-items: center;
    color: #fff;
    display: flex;
    flex-direction: row;
}
.progress-bar.type-striped .progress-bar__progress-wrapper {
    background-color: rgba(24, 24, 24, 0.5);
    border: 1px solid rgba(255, 255, 255, 0.2);
    height: 30px;
    padding: 2px;
}
.progress-bar.type-striped .progress-bar__progress {
    background: #424242 linear-gradient(135deg, rgba(0, 0, 0, 0.15) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, 0.15) 50%, rgba(0, 0, 0, 0.15) 75%, transparent 75%, transparent);
    background-size: 1rem 1rem;
}
.progress-bar.type-line .progress-bar__progress-wrapper {
    border-radius: 4px;
    height: 6px;
    padding: 0;
}
.progress-bar.type-line .progress-bar__progress {
    border-radius: 4px;
}
.progress-bar.color-green .progress-bar__progress-wrapper {
    background: #3b3b3b;
}
.progress-bar.color-green .progress-bar__progress {
    background: #21b062;
}
.progress-bar.color-yellow .progress-bar__progress-wrapper {
    background: #3b3b3b;
}
.progress-bar.color-yellow .progress-bar__progress {
    background: #ffc107;
}
.progress-bar.color-red .progress-bar__progress-wrapper {
    background: #3b3b3b;
}
.progress-bar.color-red .progress-bar__progress {
    background: #ef7d00;
}
.progress-bar.color-white .progress-bar__progress-wrapper {
    background: rgba(255, 255, 255, 0.2);
}
.progress-bar.color-white .progress-bar__progress {
    background: #fff;
}
.progress-bar.color-goal .progress-bar__progress-wrapper {
    background: rgba(255, 255, 255, 0.2);
}
.progress-bar.color-goal .progress-bar__progress {
    background: linear-gradient(263.02deg, #21b062 0, #9cb93d 100%);
}
.progress-bar.color-default .progress-bar__progress-wrapper {
    background: rgba(24, 24, 24, 0.5);
}
.progress-bar.animated .progress-bar__progress {
    animation: moving-stripes 1s linear infinite;
}
.pagination {
    display: flex;
    justify-content: center;
    margin-top: 20px;
    width: 100%;
    -webkit-user-select: none;
    user-select: none;
}
.pagination .page-button {
    font-size: 0.75rem;
}
.pagination .page-button .icon {
    height: 10px;
    width: 10px;
}
.pagination .page-button .icon:first-child {
    margin-right: 6px;
}
.pagination .page-button .icon:last-child {
    margin-left: 6px;
}
.pagination .page-button:hover,
.pagination .page-button:hover .icon {
    transition: all 60ms ease-in-out 0s;
}
.pagination .page-button.active {
    background: #d97706;
    border: 0;
    color: #fff;
}
@media screen and (max-width: 1023px) {
    .pagination .page-button .icon {
        height: 12px;
        width: 12px;
    }
}
@media (max-width: 600px) and (orientation: landscape) {
    .pagination .page-button.page-button-next,
    .pagination .page-button.page-button-prev {
        padding: 0;
    }
}
.scroll-bar-container {
    overflow: auto;
    position: relative;
}
.scroll-bar-container--overflow-x {
    overflow: auto hidden;
}
.scroll-bar-container.always-visible .ps__rail-x,
.scroll-bar-container.always-visible .ps__rail-y {
    opacity: 0.6;
}
.scroll-bar-container__shadow {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition: opacity 0.3s;
    z-index: 2;
}
.scroll-bar-container__shadow--top {
    background: linear-gradient(180deg, #1b1b1d 0, rgba(27, 27, 29, 0) 100%);
    height: 26px;
    left: 0;
    top: 0;
    width: 100%;
}
.scroll-bar-container__shadow--bottom {
    background: linear-gradient(0, #1b1b1d 0%, rgba(27, 27, 29, 0) 100%);
    bottom: 0;
    height: 26px;
    left: 0;
    width: 100%;
}
.scroll-bar-container__shadow--left {
    background: linear-gradient(90deg, #050506 0, rgba(5, 5, 6, 0.9) 22.97%, rgba(5, 5, 6, 0.01) 100%);
    bottom: 0;
    height: auto;
    left: 0;
    top: 0;
    width: 56px;
}
.scroll-bar-container__shadow--right {
    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0.9) 22.97%, rgba(5, 5, 6, 0.01) 100%);
    bottom: 0;
    height: auto;
    right: 0;
    top: 0;
    width: 62px;
}
.scroll-bar-container__arrow:hover,
.scroll-bar-container__shadow--visible {
    opacity: 1;
}
.scroll-bar-container__arrow {
    align-items: center;
    color: #fff;
    cursor: pointer;
    display: flex;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 0.3s;
    z-index: 2;
}
.scroll-bar-container__arrow--left {
    left: 7px;
    transform: translateY(-50%) rotate(180deg);
}
.scroll-bar-container__arrow--right {
    right: 7px;
}
.scroll-bar-container__arrow--visible {
    opacity: 0.7;
    pointer-events: auto;
}
.scroll-bar-container-wrapper {
    position: relative;
}
.media-uploader {
    background-color: #1b1b1d;
    border-radius: 8px;
    max-width: 100%;
}
.media-uploader--size--big {
    padding: 20px 30px;
    width: 680px;
}
.media-uploader__subtitle {
    font-size: 0.813rem;
    line-height: 1.125rem;
    color: #f8f8f8;
    margin-top: 10px;
}
.media-uploader .title {
    font-size: 22px;
    font-weight: 700;
}
@media (max-width: 767px) {
    .media-uploader .title {
        font-size: 20px;
    }
}
.media-uploader .price {
    background-color: #272727;
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    margin: 28px 0 16px;
    padding: 12px 20px;
}
.media-uploader .price-label {
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    opacity: 0.6;
}
.media-uploader .price-value {
    color: #f59e0b;
    font-weight: 700;
}
.media-uploader .price-value .icon {
    fill: currentColor;
}
.media-uploader .free-price {
    color: #fff;
    font-weight: 700;
}
.media-uploader .uploading-form {
    display: none;
}
.media-uploader .camera-icon {
    height: 30px;
    width: 34px;
}
.media-uploader .file-icon {
    fill: currentColor;
    height: 30px;
    width: 34px;
}
.media-uploader .upload-label {
    font-size: 14px;
    font-weight: 700;
    margin-top: 10px;
}
.media-uploader .policy {
    color: #707071;
    font-size: 12px;
    line-height: 15px;
    margin-top: 20px;
    text-align: left;
}
.media-uploader .controls {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}
.media-uploader .controls-with-divider {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    padding-top: 20px;
}
.media-uploader .control-button {
    margin-bottom: 0;
    margin-left: 20px;
}
@media screen and (max-width: 767px) {
    .media-uploader--size--big {
        padding: 10px 14px;
    }
}
.toast-notification {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    position: relative;
    transition: height 0.5s;
    width: 100%;
}
.toast-notification--disabled {
    filter: grayscale(1);
    opacity: 0.5;
}
.toast-notification__content {
    flex: 1;
    padding-right: 8px;
}
.toast-notification__wrapper {
    animation-duration: 0.5s;
    animation-fill-mode: forwards;
    background: #232325;
    border-radius: 12px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.22), 0 19px 38px rgba(0, 0, 0, 0.3);
    color: #fff;
    display: flex;
    padding: 16px 20px;
    position: relative;
    width: 100%;
}
.toast-notification__wrapper--hidden {
    bottom: 0;
    position: absolute;
}
.toast-notification__wrapper--show-animate {
    animation-name: toast-animation-show;
}
.toast-notification__wrapper--hide-animate {
    animation-name: toast-animation-hide;
}
.toast-notification__wrapper--hide-animate .toast-notification__close {
    display: none;
}
.toast-notification__icon-wrapper {
    min-width: 40px;
    width: 40px;
}
.toast-notification__icon--size--small {
    height: 20px;
    width: 20px;
}
.toast-notification__icon--size--medium {
    height: 24px;
    width: 24px;
}
.toast-notification__icon--accent {
    color: #f59e0b;
}
.toast-notification__icon.icon-message {
    color: rgba(255, 255, 255, 0.8);
}
.toast-notification__icon.icon-check-round-fill {
    color: #21b062;
}
.toast-notification__icon.icon-wrong-triangle-fill {
    color: #ffc107;
}
.toast-notification__icon.icon-blocked-fill {
    color: #ef7d00;
}
.toast-notification__title {
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
}
.toast-notification__description {
    color: #a0a0a1;
    font-size: 12px;
    line-height: 16px;
    margin: 8px 0 0;
}
.toast-notification__actions {
    display: flex;
    justify-content: flex-end;
    margin: 16px 0 0;
}
.toast-notification__button {
    margin-left: 16px;
}
.toast-notification__close {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    opacity: 0.4;
    padding: 4px;
    position: absolute;
    right: 10px;
    top: 10px;
    transition: opacity 0.3s;
}
.toast-notification__close:hover {
    opacity: 1;
}
.toast-notification__close-icon {
    height: 11px;
    width: 11px;
}
.cm__content {
    padding: 60px;
}
@media screen and (max-width: 639px) {
    .cm__content {
        padding: 40px 20px 20px;
    }
}
.cm__card {
    background: #232325;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 20px;
}
.cm__card--size--s {
    gap: 14px;
}
.cm__row {
    color: #a0a0a1;
    font-size: 14px;
    font-weight: 400;
    line-height: 140%;
}
.cD {
    max-width: 100%;
    padding: 20px;
}
.cD__icon-container {
    color: #21b062;
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}
.cD__title {
    margin: 0;
    text-align: center;
    white-space: pre-line;
}
.cD__iframe {
    margin-top: 20px;
    position: relative;
}
.cD__loader {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.tip-modal__content {
    padding: 0 20px 12px;
}
.tip-modal__content .textarea {
    margin: 12px 0 0;
    min-height: 80px;
}
.tip-modal__content .radio-pill-controls {
    column-gap: 12px;
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    margin: 0 0 12px;
    row-gap: 12px;
}

.founds-modal__content .radio-pill-controls {
    grid-template-columns: repeat(3, 1fr)!important;
    padding-left: 30px;
    padding-right: 30px;
}
.tip-modal__content .radio-pill-controls .radio-pill-controls__item {
    margin: 0;
    padding: 0;
}
.tip-modal__content .radio-pill-controls .radio-pill-controls__item:last-child {
    padding: 0 24px;
}

.tip-modal__user {
    align-items: center;
    display: flex;
    padding: 20px 20px 32px;
    margin-left: 30px;
}

@media screen and (max-width: 639px) {
    .tip-modal__content .radio-pill-controls {
        grid-template-columns: repeat(3, 1fr);
        padding-left: 0px;
        padding-right: 0px;        
    }
    .tip-modal__user {
        margin-left: 0;
    }    
}

.tip-modal__user .avatar {
    height: 64px;
    width: 64px;
}
.tip-modal__user-meta {
    margin-left: 12px;
}
.tip-modal__user-subtitle {
    color: #707071;
    font-size: 14px;
    font-weight: 500;
    line-height: 17px;
    margin: 0 0 4px;
}
.tip-modal__submit {
    margin: 32px auto 12px;
    width: 280px;
}
.tip-modal__vat {
    color: #707071;
    display: block;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
}
@media screen and (max-width: 639px) {
    .tip-modal__user {
        padding-bottom: 20px;
    }
    .tip-modal__user .avatar {
        height: 40px;
        width: 40px;
    }
    .tip-modal__user .displayname__name {
        font-size: 0.875rem;
        line-height: 1.063rem;
    }
    .tip-modal__user-subtitle {
        font-size: 12px;
        font-weight: 500;
        line-height: 15px;
    }
}
.improve-my-club {
    max-width: 100%;
    padding: 20px;
}
.improve-my-club__icon-container {
    color: #21b062;
    display: flex;
    justify-content: center;
    margin-bottom: 16px;
}
.improve-my-club__title {
    margin: 0;
    text-align: center;
    white-space: pre-line;
}
.improve-my-club__iframe {
    margin-top: 20px;
    position: relative;
}
.improve-my-club__loader {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.trial-subscribe-error-modal__description {
    max-width: 300px;
}
.creator-lists-modal__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin: 0 auto;
    max-width: 100%;
    min-height: 500px;
    overflow-y: auto;
    width: 500px;
}
.creator-lists-modal__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.creator-lists-modal__content {
    flex: 1;
}
.creator-lists-modal__input-wrapper {
    padding: 20px 20px 0;
}
.creator-lists-modal__lists-wrapper {
    height: 304px;
    padding: 0 20px;
}
.creator-lists-modal__list-item {
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    gap: 10px;
    justify-content: space-between;
    padding: 10px 0;
}
.creator-lists-modal__list-item--last {
    border: 0;
}
.creator-lists-modal__list-info {
    max-width: 50%;
}
.creator-lists-modal__list-title {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 5px;
    margin-bottom: 2px;
}
.creator-lists-modal__description,
.creator-lists-modal__name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.creator-lists-modal__description {
    color: #a0a0a1;
}
.creator-lists-modal__right-part {
    align-items: center;
    display: flex;
    gap: 20px;
    justify-content: flex-end;
}
.creator-lists-modal__actions {
    display: grid;
    place-items: center;
    width: 70px;
}
.creator-lists-modal__users-count {
    color: #a0a0a1;
    white-space: nowrap;
}
.on-boarding {
    background: radial-gradient(104.18% 126.71%at 69.22% 14.96%, #481974 0, #060506 100%), #050506;
    max-width: 592px;
    position: relative;
}
.on-boarding::before {
    background: url(/assets/common/components/ui/OnBoarding/mark.svg) no-repeat;
    content: "";
    height: 289px;
    opacity: 0.06;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 228px;
}
.on-boarding__scroll {
    overflow: hidden;
    width: 100%;
}
.on-boarding__content {
    display: grid;
}
.on-boarding__counter {
    font-size: 18px;
    font-weight: 400;
    left: 72px;
    line-height: 22px;
    position: absolute;
    top: 64px;
}
.on-boarding__controls {
    bottom: 44px;
    display: flex;
    left: 72px;
    position: absolute;
}
.on-boarding__control {
    align-items: center;
    background: var(--primary-border);
    border: 0;
    border-radius: 50%;
    color: #000;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 0 0 0 2px;
    transition: opacity 0.3s;
    width: 32px;
}
.on-boarding__control:hover {
    background: #d97706;
}
.on-boarding__control--prev {
    margin: 0 15px 0 0;
    transform: rotate(180deg);
}
.on-boarding__control:disabled {
    background: rgba(177, 56, 255, 0.6);
    pointer-events: none;
}
.on-boarding__show-later {
    bottom: 52px;
    color: #fff;
    cursor: pointer;
    font-size: 11px;
    font-weight: 400;
    line-height: 13px;
    opacity: 0.4;
    position: absolute;
    right: 72px;
    text-transform: uppercase;
}
.on-boarding__show-later--mobile {
    display: inline-block;
    margin: 0 0 32px;
    position: static;
}
.on-boarding__show-later.active,
.on-boarding__show-later:hover {
    opacity: 0.8;
}
.on-boarding__copy-link {
    margin: 26px 0 0;
    max-width: 366px;
}
@media screen and (max-width: 767px) {
    .on-boarding {
        text-align: center;
    }
    .on-boarding__content {
        display: block;
        width: auto !important;
    }
    .on-boarding::before,
    .on-boarding__controls,
    .on-boarding__counter,
    .on-boarding__show-later--desktop {
        display: none;
    }
}
.cE__header {
    align-items: center;
    border-bottom: 2px solid rgba(255, 255, 255, 0.05);
    display: flex;
    gap: 20px;
    justify-content: flex-start;
    padding: 20px;
}
.cE__content {
    padding: 0 20px;
}
.cE__items-list {
    height: 320px;
}
.cE__footer {
    border-top: 2px solid rgba(255, 255, 255, 0.05);
    display: grid;
    min-height: 100px;
    padding: 20px;
    place-items: center;
}
.cE__footer-content {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    justify-content: center;
    max-width: 320px;
}
.cE__my-club-icon {
    color: #f59e0b;
    margin-right: 4px;
    transform: rotate(-30deg);
}
.cV {
    background: #303030;
}
.cV__body,
.cV__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin: 0 auto;
    overflow: hidden;
    width: 100%;
}
.cV__content {
    max-height: 100%;
    padding: 20px;
    position: relative;
}
.cV__thumbs-wrapper {
    flex: 1;
    height: 70px;
    position: relative;
    transition: opacity 0.3s;
}
.cV__thumbs-wrapper--disabled {
    opacity: 0.6;
    pointer-events: none;
}
.cV__thumbs-wrapper .buttons-form-list {
    padding: 8px 0 0;
}
.cV__thumbs {
    bottom: 0;
    column-gap: 12px;
    display: flex;
    height: inherit;
    left: -10px;
    overflow: auto;
    padding: 10px 0 0 10px;
    position: absolute;
    top: 0;
    width: 100%;
}
.cV__thumb-add {
    align-items: center;
    background: #343437;
    border-radius: 8px;
    color: #707071;
    cursor: pointer;
    display: flex;
    height: 60px;
    justify-content: center;
    min-width: 36px;
    position: relative;
    width: 36px;
}
.cV__thumb-add:hover {
    color: #cfcfd0;
}
.cV__mobile-back {
    align-items: center;
    backdrop-filter: blur(4px);
    background: rgba(5, 5, 6, 0.4);
    border: 0;
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 48px;
    justify-content: center;
    left: 12px;
    position: absolute;
    top: 12px;
    width: 48px;
}
.cV__mobile-submit-button.btn {
    border-radius: 60px;
    height: 48px;
    padding: 12px 20px;
}
.cV__tag-creators {
    min-height: 316px;
}
.cV__add-dropdown {
    animation: opacity-fade-top-show 0.3s;
    position: fixed;
    z-index: 500;
}
.cV__move-border {
    border: 1px dashed #fff;
    border-radius: 16px;
    bottom: 11%;
    left: 3%;
    pointer-events: none;
    position: absolute;
    right: 3%;
    top: 11%;
    transition: opacity 0.3s;
}
.cV__move-border--hidden {
    opacity: 0;
}
.cV__error-banner {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 20px;
    bottom: 12px;
    display: flex;
    gap: 18px;
    left: 12px;
    padding: 4px 18px;
    position: absolute;
    right: 12px;
}
@media (min-height: 580px) {
    .cV__body .upload-media__button {
        height: 242px;
    }
}
.cV__bottom-drawer-wrapper {
    bottom: 0;
    display: flex;
    flex-direction: column;
    justify-content: end;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.cV__bottom-drawer {
    animation: move-bottom-right 0.25s;
    background: #1b1b1d;
    height: 50%;
    max-height: 50vh;
    padding: 20px;
}
.cV__body .upload-media__actions {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cV__body .upload-media__button {
    height: 130px;
}
.cJ__action-container {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: flex-end;
}
.cJ__action-container--success {
    justify-content: center;
}
.post-editor-modal .tile-header {
    pointer-events: none;
}
.post-editor-modal__content {
    flex: 1;
    margin: 0 auto;
    overflow: hidden;
    padding: 20px;
    position: relative;
    width: 100%;
}
.post-editor-modal__content--min-height {
    min-height: min(380px, 50vh);
}
.post-editor-modal__content--webcam {
    display: flex;
}
.post-editor-modal__settings-items > .cs:not(:first-child) {
    border-top: 1px solid rgba(255, 255, 255, 0.05);
}
.post-editor-modal__tagged-users-list {
    color: #707071;
    font-size: 14px;
    font-weight: 500;
    max-width: 100%;
    overflow: hidden;
    text-align: end;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: 190px;
}
.post-editor-modal-wrapper .p__button {
    display: none;
}
.post-editor-modal-wrapper .p__content {
    padding-right: 20px;
}
.post-editor-modal-wrapper .modal-content {
    max-width: 100%;
}
.post-editor-modal-wrapper .inner-form-title {
    align-items: center;
    display: flex;
    margin: 0 0 12px;
}
.post-editor-modal-wrapper .form-description {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: 1.3;
    margin-bottom: 20px;
    opacity: 0.6;
}
.post-editor-modal-wrapper .panel-image label {
    color: rgba(255, 255, 255, 0.4);
    font-size: 0.813rem;
}
.post-editor-modal-wrapper .panel-image button {
    margin-right: 0;
}
.post-editor-modal-wrapper .panel-image .icon-close-2 {
    color: rgba(255, 255, 255, 0.6);
    height: 16px;
    margin: 0;
    width: 16px;
}
.post-editor-modal-wrapper--section .footer-actions-container {
    visibility: hidden;
}
.post-editor-modal-wrapper .panel-body textarea {
    min-height: 110px;
}
.post-editor-modal-wrapper--preview {
    align-self: center;
}
.post-editor-modal-wrapper--preview form > :not(.footer-actions-container) {
    display: none;
}
.post-editor-modal-wrapper--webcam-opened .footer-actions-container,
.post-editor-modal-wrapper--webcam-opened .form-description,
.post-editor-modal-wrapper--webcam-opened .panel-body,
.post-editor-modal-wrapper--webcam-opened .panel-field-optional,
.post-editor-modal-wrapper--webcam-opened .panel-image > label,
.post-editor-modal-wrapper--webcam-opened .panel-preview-toggle,
.post-editor-modal-wrapper--webcam-opened .panel-title,
.post-editor-modal-wrapper--webcam-opened > .inner-form-title {
    display: none;
}
.post-editor-modal-wrapper__footer-actions {
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 20px;
    width: 100%;
}
.post-editor-modal-wrapper__footer-actions .modal-footer-bottom {
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
    width: 100%;
}
.post-editor-modal-wrapper__submit-button {
    min-width: 122px;
    transition: opacity 0.3s;
}
.post-editor-modal-wrapper__preview-header {
    display: flex;
    gap: 10px;
}
.post-editor-modal-wrapper__preview-body-wrapper {
    flex: 1;
}
.panel-preview-toggle {
    align-self: center;
    display: inline-flex;
}
.panel-preview-toggle button {
    align-content: center;
    align-items: center;
    background-color: transparent;
    border: 0;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    display: inline-flex;
    outline: 0;
    padding: 0;
    font-size: 0.813rem;
}
.panel-preview-toggle button .icon {
    fill: rgba(255, 255, 255, 0.8);
    height: 18px;
    margin-right: 7px;
    width: 18px;
}
.panel-preview-toggle button:hover .icon {
    fill: #fff;
}
.panel-preview-toggle__title {
    display: inline;
}
@media screen and (max-width: 390px) {
    .panel-preview-toggle__title {
        display: none;
    }
}
.panel-preview-toggle button:hover,
.post-editor-modal-wrapper .scheduled-button-active {
    color: #fff;
}
.panel-preview-toggle button:active {
    transform: translateY(1px);
}
.panel-preview-toggle button[disabled] {
    opacity: 0.33;
    pointer-events: none;
}
.panel-field__counters-info {
    border-radius: 6px;
    font-size: 13px;
    line-height: 18px;
    margin: 12px 0 24px;
    padding-top: 10px;
    text-align: center;
}
.panel-field label {
    color: rgba(255, 255, 255, 0.9);
    display: block;
    margin-bottom: 12px;
    text-align: left;
    font-size: 0.813rem;
}
.panel-field label .input-optional {
    color: rgba(255, 255, 255, 0.6);
}
.panel-field textarea {
    border-radius: 12px;
    height: 60px;
    width: 100%;
}
.panel-field + .panel-field {
    margin-top: 20px;
}
.panel-field.disabled {
    opacity: 0.2;
    pointer-events: none;
}
.panel-field-invalid .input,
.panel-field-invalid .textarea {
    border: 1px solid #fa5365;
}
.teaser-post-settings {
    align-items: start;
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 8px;
    margin-bottom: 24px;
    margin-top: -16px;
}
.teaser-post-settings__title {
    font-size: 13px;
    font-weight: 500;
}
.landing-ability {
    position: relative;
}
.landing-ability__observer {
    pointer-events: none;
    position: absolute;
    top: 40vh;
}
.landing-ability__content-wrapper {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.landing-ability__content-wrapper--is-right .landing-ability__description,
.landing-ability__is-right .landing-ability__description {
    margin-left: 40px;
    margin-right: 0;
}
.landing-ability__description {
    flex: 1;
    margin-right: 40px;
}
.landing-ability__content {
    flex: 1;
    position: relative;
}
.landing-ability__suptitle {
    color: #707071;
    font-size: 24px;
    line-height: 28px;
    margin-bottom: 20px;
}
.landing-ability__title {
    font-size: 2.75rem;
    line-height: 3.125rem;
    font-weight: 700;
    margin: 0 0 20px;
}
.landing-ability__subtitle {
    color: #cfcfd0;
    margin-bottom: 18px;
    font-size: 1rem;
    line-height: 1.75rem;
}
.landing-ability__tell-me-more {
    align-items: center;
    color: #a0a0a1;
    cursor: pointer;
    display: inline-flex;
    text-decoration: none;
    transition: color 0.3s;
    font-size: 1rem;
    line-height: 1.75rem;
}
.landing-ability__tell-me-more:hover {
    color: #fff;
    text-decoration: none;
}
.landing-ability__tell-me-more:hover > .arrow-down-animated {
    background-color: #d97706;
    border-color: rgba(138, 24, 252, 0.3);
}
.landing-ability__tell-me-more:hover > .arrow-down-animated > .arrow-down-animated__content--animated-hover {
    animation: arrow-down-animated-move 0.5s;
}
@media screen and (max-width: 1023px) {
    .landing-ability__title {
        font-size: 1.5rem;
        line-height: 2.375rem;
    }
    .landing-ability__subtitle {
        line-height: 1.6rem;
    }
}
@media screen and (max-width: 767px) {
    .landing-ability__content-wrapper {
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
    }
    .landing-ability__content-wrapper--is-right {
        flex-direction: column-reverse;
    }
    .landing-ability:not(:last-child) {
        margin-bottom: 20px;
    }
    .landing-ability__content {
        width: 100%;
    }
    .landing-ability__suptitle {
        font-size: 1.125rem;
        line-height: 1.75rem;
    }
    .landing-ability__title {
        font-size: 1.375rem;
        line-height: 1.688rem;
        font-weight: 700;
    }
    .landing-ability__content-wrapper--is-right .landing-ability__description,
    .landing-ability__description {
        margin: 0;
        max-width: calc(100vw - 48px);
    }
    .landing-ability__subtitle {
        font-size: 1rem;
        line-height: 1.625rem;
        font-weight: 400;
    }
}
.landing-ability--animated--is-waiting .landing-ability__content,
.landing-ability--animated--is-waiting .landing-ability__description {
    opacity: 0;
}
.landing-ability--animated--type-1 .landing-ability__content {
    animation-duration: 0.5s;
    animation-name: ability-animation-for-left;
}
.landing-ability--animated--type-1 .landing-ability__description,
.landing-ability--animated--type-2 .landing-ability__content {
    animation-duration: 0.5s;
    animation-name: ability-animation-for-right;
}
.landing-ability--animated--type-2 .landing-ability__description {
    animation-duration: 0.5s;
    animation-name: ability-animation-for-left;
}
.range {
    align-items: center;
    display: flex;
    position: relative;
}
.range__virtual-track {
    background: 0 0;
    cursor: pointer;
    height: 32px;
    left: 0;
    margin-top: -13px;
    position: absolute;
    top: 0;
    width: 100%;
}
.range__track {
    background-color: rgba(255, 255, 255, 0.4);
    border-radius: 3px;
    cursor: pointer;
    height: 6px;
    width: 100%;
}
.range__track-active {
    background-color: #f59e0b;
    position: absolute;
}
.range__marks-wrapper {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 100%;
    justify-content: space-around;
    left: 0;
    position: absolute;
    width: 100%;
}
.range__mark {
    background-color: #fff;
    border: 3px solid #0b0313;
    border-radius: 6px;
    bottom: calc(50% - 6px);
    box-sizing: content-box;
    height: 6px;
    margin: 0 8px;
    width: 6px;
}
.range__handle-wrapper {
    align-items: center;
    background-color: #d97706;
    border-radius: 16px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.05), 0 2px 4px rgba(0, 0, 0, 0.07);
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    position: absolute;
    transition: left 0.05s ease;
    width: 32px;
}
.range__handle,
.range__marker {
    background-color: #fff;
    border-radius: 6px;
    height: 12px;
    width: 12px;
}
.range__marker {
    border: 3px solid #303030;
    border-radius: 5px;
    height: 9px;
    width: 9px;
}
@media screen and (max-width: 1023px) {
    .range__handle-wrapper {
        transition: none;
    }
}
.bA {
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}
.bA__svg {
    display: block;
}
.displayname {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    min-width: 0;
}
.displayname__name {
    color: #fff;
    font-weight: 500;
    margin: 0;
    white-space: initial;
    z-index: 1;
}
.displayname__age {
    font-weight: 500;
    white-space: nowrap;
}
.settings-birth-row {
    display: grid;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.3fr) minmax(0, 1fr);
    gap: 10px;
}
.settings-birth-row + .settings-hint {
    margin-top: 10px;
}
.settings-age-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    cursor: pointer;
}
.settings-age-toggle .switcher {
    flex: 0 0 auto;
}
.displayname__name--text-overflow,
.displayname__name-text--accent {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.displayname__name-text--accent {
    background: #f59e0b;
    border-radius: 6px;
    color: #fff;
    display: inline-block;
    padding: 2px 6px;
}
.displayname--size--big > .displayname__name {
    font-size: 3rem;
}
.displayname--size--big .icon {
    height: 32px;
    pointer-events: auto;
    vertical-align: baseline;
    width: 32px;
}
.displayname--size--medium > .displayname__name {
    font-size: 1.125rem;
}
.displayname--size--medium .icon {
    height: 16px;
    pointer-events: auto;
    vertical-align: baseline;
    width: 16px;
}
.displayname--size--medium-ll > .displayname__name {
    font-size: 28px;
}
.displayname--size--medium-ll .icon {
    height: 20px;
    pointer-events: auto;
    vertical-align: baseline;
    width: 20px;
}
.displayname--size--medium-l > .displayname__name {
    font-size: 1.375rem;
}
.displayname--size--medium-l .icon {
    height: 20px;
    pointer-events: auto;
    vertical-align: baseline;
    width: 20px;
}
.displayname--size--small > .displayname__name {
    font-size: 1rem;
}
.displayname--size--small .icon {
    height: 20px;
    pointer-events: auto;
    position: relative;
    top: -5px;
    width: 20px;
    display: inline-flex;
}
.displayname--size--small-x > .displayname__name {
    font-size: 15px;
}
.displayname--size--small-x .icon {
    height: 20px;
    pointer-events: auto;
    position: relative;
    top: -2px;
    width: 20px;
}
.displayname--size--small-xx > .displayname__name {
    font-size: 13px;
    line-height: 120%;
}
.displayname--size--small-xx .icon {
    height: 14px;
    pointer-events: auto;
    position: relative;
    top: -1px;
    width: 14px;
}
.displayname--size--small-xx .displayname__verified--accent .icon {
    top: -6px;
}
.displayname--size--small-xxx > .displayname__name {
    font-size: 12px;
}
.displayname--size--small-xxx .icon {
    height: 12px;
    pointer-events: auto;
    position: relative;
    top: -1px;
    width: 12px;
}
.displayname__official-tooltip {
    backdrop-filter: blur(2px);
    background: rgba(35, 35, 37, 0.9);
    border-radius: 12px;
    max-width: 220px;
    padding: 20px;
    position: relative;
}
.displayname__official-tooltip::before {
    backdrop-filter: blur(2px);
    background: inherit;
    border-bottom-left-radius: 2px;
    clip-path: polygon(0 0, 0 100%, 100% 100%);
    content: "";
    height: 10px;
    left: 50%;
    position: absolute;
    top: 100%;
    transform: translateY(-50%) translateX(-50%) rotate(-45deg);
    width: 10px;
}
.bottom .displayname__official-tooltip::before {
    bottom: 100%;
    top: auto;
    transform: translateY(50%) translateX(-50%) rotate(135deg);
}
.left .displayname__official-tooltip::before {
    left: 100%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%) rotate(-135deg);
}
.right .displayname__official-tooltip::before {
    left: auto;
    right: 100%;
    top: 50%;
    transform: translateY(-50%) translateX(-50%) rotate(45deg);
}
.displayname__official-tooltip-header {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: center;
    margin-bottom: 20px;
    padding-left: 10px;
}
.displayname__official-tooltip-title {
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    line-height: 125%;
}
.displayname__official-tooltip-description {
    color: #a0a0a1;
    font-size: 12px;
    font-weight: 400;
    line-height: 140%;
    text-align: center;
}
.displayname__official-tooltip-icon {
    height: 48px;
    width: 48px;
}
.displayname__short-name {
    display: inline-block;
    max-width: 156px;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: text-bottom;
    white-space: nowrap;
}
.display-full-name {
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.85);
    flex-grow: 1;
    margin: 0;
}
.display-full-name__nickname {
    display: block;
    margin: 2px 0 0;
}
.display-full-name__nickname--text-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.display-full-name .username {
    font-size: 0.938rem;
    margin: -1px 0 3px;
}
.my-collection-content {
    margin: 44px 0 24px;
}
.my-collection-model > a,
.my-collection-model > a:hover {
    color: #fff;
    display: block;
    position: relative;
    text-decoration: none !important;
}
.my-collection-model .head {
    padding-bottom: 10px;
    display: flex;
    flex-direction: row;
}
.my-collection-model .head .avatar {
    height: 40px;
    width: 40px;
}
.my-collection-model .head .left {
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1;
}
.my-collection-model .head .right {
    align-self: center;
    margin-left: 12px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 0;
}
.my-collection-model .head .name {
    color: var(--primary-light);
    margin: 0 0 2px;
    font-size: 0.875rem;
}
.my-collection-model .head .details {
    opacity: 0.5;
    font-size: 0.75rem;
}
.my-collection-model .preview {
    background-position: center;
    background-size: cover;
    border-radius: 18px;
    padding-bottom: 75%;
    position: relative;
}
.my-collection-model .preview.empty {
    background-color: #4f4f4f;
}
.my-collection-model .preview.empty .icon {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    fill: #fff;
    opacity: 0.2;
}
.my-collection-model .preview .details-wrapper {
    background-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.75) 100%);
    bottom: 0;
    left: 0;
    padding: 10px;
    pointer-events: none;
    position: absolute;
    right: 0;
}
.my-collection-model .preview .details {
    color: #fff;
    display: flex;
    flex-direction: row;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.4);
}
.my-collection-model .preview .left {
    line-height: 16px;
    overflow: hidden;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.my-collection-model .preview .right {
    align-self: flex-end;
    line-height: 16px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1;
}
.ff {
    height: 100%;
    position: relative;
}
.f__content-wrapper {
    background: #232325;
    border-radius: 16px;
    height: 100%;
    overflow: hidden;
}
.f__counters {
    color: #a0a0a1;
    font-size: 12px;
    padding: 12px 20px 20px;
}
.f__price {
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    margin: 0 0 4px;
    text-transform: uppercase;
}
.f__nickname {
    display: block;
    margin: 0 0 16px;
}
.f__info {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.6);
    flex-grow: 1;
    margin: 0;
}
.f__info .username {
    font-size: 0.938rem;
    margin: -1px 0 3px;
}
.f__actions {
    display: flex;
    flex-direction: row;
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    justify-content: flex-end;
    margin: 16px 0 0;
    padding: 16px 0 0;
}
.f__actions .icon {
    height: 16px;
    margin: 0 12px 0 0;
    min-width: 16px;
    width: 16px;
}
.f__actions .btn {
    align-items: center;
    display: flex;
    margin: 0 0 0 6px;
}
.f__link {
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    transition: all 0.15s linear;
    font-size: 0.75rem;
}
.f__link:hover {
    color: rgba(255, 255, 255, 0.6);
}
.f__status {
    font-size: 0.75rem;
    margin-bottom: 10px;
}
.f__status.active {
    color: #40d364;
}
.f__status.canceled,
.f__status.inactive {
    color: rgba(255, 255, 255, 0.6);
}
.f__status.suspended {
    color: #fa5365;
}
.f .favorite-button {
    position: absolute;
    right: 20px;
    top: 12px;
}
@media screen and (max-width: 479px) {
    .f {
        flex-flow: column;
    }
}
.ff__content {
    padding: 0 20px 20px;
}
.auth-form {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
}
.auth-form__fading-input {
    max-height: 100px;
}
.auth-form__fading-input:not(:last-child) {
    margin-bottom: 16px;
}
.auth-form__title {
    font-size: 1.375rem;
    line-height: 1.679rem;
    font-weight: 500;
    margin-bottom: 24px;
    text-align: center;
}
.auth-form__social-login {
    column-gap: 12px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
}
.auth-form__social-login .icon {
    margin-right: 10px;
}
.auth-form__divider {
    margin: 24px 0;
    padding: 0 76px;
    text-align: center;
    font-size: 0.75rem;
    line-height: 0.938rem;
}
.auth-form__divider-text {
    opacity: 0.4;
}
.auth-form__hint {
    font-size: 0.688rem;
    line-height: 1rem;
    color: #707071;
    font-weight: 400;
    margin-top: 10px;
    text-align: center;
}
.auth-form__hint a {
    color: #707071;
    text-decoration: underline;
}
.auth-form__hint a:hover {
    color: #cfcfd0;
    text-decoration: none;
}
.auth-form__join {
    margin-top: 16px;
}
.auth-form__form-switcher {
    color: #a0a0a1;
    margin-top: 32px;
    text-align: center;
    font-size: 0.813rem;
    line-height: 1rem;
}
.auth-form__form-switcher .btn {
    border-radius: 0;
    color: #f59e0b;
    vertical-align: baseline;
    font-size: 0.813rem;
    line-height: 1rem;
}
@media screen and (max-width: 639px) {
    .auth-form__title {
        font-size: 1.375rem;
        line-height: 1.679rem;
    } 
}
.auth-form .recaptcha {
    display: flex;
    justify-content: center;
    margin: 20px auto 0;
}
.header-notifications {
    left: 0;
    position: absolute;
    top: 100%;
    width: 100%;
}
.header-notification {
    align-items: center;
    overflow: hidden;
    position: relative;
    text-overflow: ellipsis;
    display: flex;
    flex-direction: row;
}
.header-notification--success {
    background: #21b062;
}
.header-notification--error {
    background: #c5201f;
}
.header-notification--cover-moderation {
    background: #fccf49;
}
.header-notification--cover-moderation .icon {
    margin: 0 12px 0 0;
}
.header-notification--cover-moderation .header-notification-body {
    align-items: center;
    color: #000;
    display: flex;
    font-size: 13px;
    font-weight: 500;
    justify-content: center;
    line-height: 16px;
    padding: 4px 0;
}
.header-notification--recommendation {
    background: #f4f4f4;
}
.header-notification--recommendation .header-notification-body {
    align-items: center;
    color: #2b2b2b;
    justify-content: center;
    display: flex;
    flex-direction: row;
}
.header-notification--recommendation .icon-close-5 {
    cursor: pointer;
    fill: rgba(43, 43, 43, 0.5);
    height: 14px;
    margin-right: 20px;
    pointer-events: auto;
    width: 14px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
.header-notification--recommendation .icon-close-5:hover {
    fill: rgba(43, 43, 43, 0.8);
}
.header-notification--warning {
    background-color: #ffc107;
}
.header-notification--warning a,
.header-notification--warning-light a {
    color: inherit;
}
.header-notification--warning svg,
.header-notification--warning-light svg {
    color: #050506 !important;
}
.header-notification--warning > .header-notification-body {
    color: #050506;
    font-size: 15px;
    padding: 8px 0;
}
.header-notification--warning .icon-close {
    color: #1b1b1d;
}
.header-notification--warning .icon-close:hover {
    color: #050506;
}
.header-notification--warning-light {
    background-color: #755e8d;
}
.header-notification--warning-light > .header-notification-body {
    color: #fff;
    font-size: 15px;
    padding: 8px 0;
}
.header-notification--warning-light .icon-close {
    color: #a0a0a1;
}
.header-notification--push .header-notification-body.white,
.header-notification--warning-light .icon-close:hover {
    color: #fff;
}
.header-notification--push {
    background-color: #59c5e6;
}
.header-notification--push .header-notification-body {
    align-items: center;
    color: #2b2b2b;
    justify-content: center;
    padding: 10px;
    display: flex;
    flex-direction: row;
}
.header-notification--push .header-notification-title {
    align-items: center;
    font-weight: 700;
    justify-content: center;
    line-height: 1.25rem;
    font-size: 0.875rem;
    display: flex;
    flex-direction: row;
}
.header-notification--push .icon-notifications {
    margin-right: 15px;
    margin-top: 2px;
    min-width: 18px;
}
.header-notification--push .close-button {
    cursor: pointer;
}
.header-notification--push .close-button .icon-close-2 {
    fill: rgba(0, 0, 0, 0.3);
}
.header-notification--push .close-button:hover .icon-close-2 {
    fill: rgba(0, 0, 0, 0.5);
}
.header-notification--push .btn {
    margin: 0 0 0 20px;
    padding: 0 30px;
}
@media screen and (max-width: 1023px) {
    .header-notification--push {
        max-height: 175px;
    }
}
@media screen and (max-width: 600px) {
    .header-notification--push {
        max-height: 175px;
    }
}
@media screen and (max-width: 1023px) {
    .header-notification--push .header-notification-body {
        align-items: flex-start;
    }
    .header-notification--push .header-notification-body .icon-notifications {
        margin-top: 2px;
    }
    .header-notification--push .header-notification-title {
        align-items: flex-start;
        text-align: left;
        display: flex;
        flex-direction: column;
    }
    .header-notification--push .btn {
        margin: 10px 0 0;
    }
    .header-notification--push .close-button {
        align-self: flex-start;
        cursor: pointer;
        margin: 10px 10px 0 0;
    }
}
.header-notification--modelPush {
    background-color: #2f87cc;
    cursor: default;
}
.header-notification--modelPush .header-notification-body {
    color: #fff;
    padding: 10px;
    font-size: 0.813rem;
}
.header-notification--modelPush .header-notification-body,
.header-notification--modelPush .header-notification-content {
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: row;
}
.header-notification--modelPush .header-notification-content-icon {
    margin: 0 60px 0 0;
}
.header-notification--modelPush .header-notification-title {
    opacity: 0.8;
    line-height: 1.25rem;
}
.header-notification--modelPush .header-notification-link {
    margin: 0 0 0 16px;
    opacity: 0.5;
    text-decoration: none;
}
.header-notification--modelPush .header-notification-link:active,
.header-notification--modelPush .header-notification-link:focus,
.header-notification--modelPush .header-notification-link:hover {
    opacity: 1;
}
.header-notification--modelPush .btn-white-outline {
    text-decoration: none;
}
.header-notification--modelPush .icon-notifications {
    height: 20px;
    margin-bottom: 3px;
    margin-right: 15px;
    min-width: 18px;
    opacity: 0.7;
}
.header-notification--modelPush .header-notification-controls {
    align-items: center;
    margin: 0 0 0 20px;
    display: flex;
    flex-direction: row;
}
.header-notification--modelPush .header-notification-controls .btn {
    margin: 0;
}
.header-notification--modelPush .close-button {
    cursor: pointer;
}
.header-notification--modelPush .close-button .icon {
    color: #fff;
    height: 10px;
    width: 10px;
}
@media screen and (max-width: 1023px) {
    .header-notification--modelPush {
        max-height: none;
    }
    .header-notification--modelPush .header-notification-body .icon-notifications {
        margin-top: 2px;
    }
    .header-notification--modelPush .header-notification-content {
        align-items: flex-start;
        display: flex;
        flex-direction: column;
    }
    .header-notification--modelPush .header-notification-controls {
        margin: 10px 0 0;
    }
    .header-notification--modelPush .close-button {
        align-self: flex-start;
        cursor: pointer;
        margin: 10px 10px 0 0;
    }
}
@media screen and (max-width: 639px) {
    .header-notification--modelPush .header-notification-title {
        text-align: left;
    }
}
.header-notification--payments-settings {
    max-height: 150px;
}
.header-notification--payments-settings .notification-buttons {
    margin-top: 10px;
}
.header-notification--payments-settings .notification-buttons > .btn {
    margin-bottom: 0;
}
.header-notification a {
    color: #fff;
    text-decoration: underline;
}
.header-notification > .icon-close {
    color: rgba(255, 255, 255, 0.3);
    height: 22px;
    pointer-events: auto;
}
.header-notification > .icon-close:hover {
    fill: rgba(241, 241, 241, 0.5);
}
.header-notification .close-button,
.header-notification > .icon-close {
    cursor: pointer;
    margin-right: 20px;
    width: 22px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
@media screen and (max-width: 1023px) {
    .header-notification {
        max-height: 75px;
        padding: 0 0 0 20px;
    }
    .header-notification--payments-settings {
        max-height: 180px;
    }
}
@media screen and (max-width: 600px) {
    .header-notification {
        max-height: 125px;
        padding: 0 4px 0 20px;
    }
    .header-notification .header-notification-body {
        font-size: 0.875rem;
        text-align: left;
    }
}
.header-notification--color {
    background: #4c88bc;
}
.header-notification-body {
    color: #fff;
    display: inline-block;
    padding: 15px 0;
    text-align: center;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
    font-size: 1rem;
}
.header-notification-report {
    color: #fff;
    text-decoration: underline;
}
.footer-actions-container {
    align-items: center;
    border-top: solid 1px rgba(255, 255, 255, 0.08);
    display: flex;
    flex-wrap: wrap;
    padding: 16px 0;
}
.footer-actions-container--spaced-x {
    padding: 16px 20px max(env(safe-area-inset-bottom), 16px);
}
.footer-actions-container--spaced-top {
    padding: 20px 0 0;
}
.footer-actions-container--position--right {
    justify-content: flex-end;
}
.footer-actions-container--position--space-between {
    justify-content: space-between;
}
.footer-actions-container--position--center {
    justify-content: center;
}
.pill-page-tabs {
    font-size: 14px;
    font-weight: 500;
    overflow: auto;
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
}
.pill-page-tabs--style--short {
    display: flex;
    max-width: 550px;
}
.pill-page-tabs--style--center {
    margin: 0 auto 40px;
    max-width: 508px;
}
.pill-page-tabs--style--primary {
    margin: 0 0 48px;
    width: 100%;
}
.pill-page-tabs .icon {
    height: 18px;
    margin: 0 8px 0 0;
    width: 18px;
}
@media screen and (max-width: 767px) {
    .pill-page-tabs--style--center,
    .pill-page-tabs--style--short {
        margin-bottom: 40px;
    }
    .pill-page-tabs--style--primary {
        margin-bottom: 0;
    }
}
.common-sign-up-grid {
    display: flex;
    position: relative;
}
.common-sign-up-grid__modal {
    background: none;
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2;
}
.common-sign-up-grid__left {
    max-width: 100%;
    padding: 24px 40px;
    position: relative;
    width: 400px;
    z-index: 3;
    background: #050506;
}
.common-sign-up-grid__right-image {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    bottom: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: 500px;
    z-index: 1;
}
.common-sign-up-grid__right-image::after {
    bottom: 45px;
    content: "";
    left: 0;
    position: absolute;
    top: 45px;
    width: 1px;
}
.common-sign-up-grid__right-image::before {
    background: linear-gradient(90deg, #050506 0.5%, rgb(0 0 0 / 52%) 39.94%, transparent 100%)!important;
    bottom: 0;
    content: "";
    height: 100%;
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
}
.common-sign-up-grid__right {
    position: relative;
    width: 500px;
    z-index: 2;
}
.common-sign-up-grid__right--min-fixed {
    min-height: 466px;
}
.common-sign-up-grid__right-content {
    bottom: 0;
    padding: 0 20px 40px 40px;
    position: absolute;
}
@media screen and (max-width: 1023px) {
    .common-sign-up-grid__modal,
    .common-sign-up-grid__right,
    .common-sign-up-grid__right-image {
        display: none;
    }
    .common-sign-up-grid__left {
        padding: 0;
        width: auto;
    }
}
.modal-ds-content .common-sign-up-grid {
    background: #050506;
    max-width: 100%;
    padding: 24px 40px;
    width: 400px;
}
@media screen and (min-width: 1024px) {
    .modal-ds-content .common-sign-up-grid--model-content {
        background: 0 0;
        padding: 0;
        width: 900px;
    }
}
.buttons-form-list {
    display: flex;
    gap: 16px;
    justify-content: flex-end;
}
.bt {
    color: #fff;
    margin: 20px 0 12px;
    max-height: 84px;
    opacity: 0.8;
    overflow: hidden;
    position: relative;
    white-space: pre-line;
    width: 67%;
    word-break: break-word;
    font-size: 0.875rem;
    line-height: 1.063rem;
}
.bt--opened {
    max-height: none;
}
.bt__text {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0;
}
.bt__shadow-text {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    visibility: hidden;
}
@media screen and (max-width: 1023px) {
    .bt {
        width: 100%;
    }
}
.user-media-content {
    
}
.geo-ban-profile-stub {
    margin: 100px auto;
    max-width: calc(100vw - 32px);
    width: 642px;
}
.geo-ban-profile-stub__container {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin-bottom: 132px;
}
.geo-ban-profile-stub__avatar {
    height: 80px;
    margin-bottom: 24px;
    position: relative;
    width: 80px;
}
.geo-ban-profile-stub__block-icon {
    background: #000;
    border-radius: 50%;
    bottom: -5px;
    color: #fff;
    display: grid;
    height: 46px;
    place-items: center;
    position: absolute;
    right: -5px;
    width: 46px;
}
.geo-ban-profile-stub__title {
    font-size: 24px;
    font-weight: 500;
    line-height: 29px;
    margin-bottom: 16px;
}
.H {
    margin-top: 12px;
}
.H__button {
    align-items: center;
    background-color: #343437;
    border-radius: 12px;
    color: #fff;
    column-gap: 10px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    min-height: 60px;
    padding: 6px 10px;
    text-align: center;
    transition: all ease 0.25s;
}
.H__button:hover {
    background-color: #424248;
}
.H__buttons-group {
    align-items: center;
    display: flex;
    gap: 1px;
}
.H__buttons-group .H__button {
    flex: 1;
}
.H__buttons-group .H__button--position--left {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
}
.H__buttons-group .H__button--position--right {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
}
.H__title {
    font-size: 12px;
}
.H__actions {
    display: grid;
    grid-column-gap: 10px;
    grid-template-columns: repeat(2, 1fr);
}
.H__actions--grouped {
    grid-template-columns: 4fr 3fr;
}
.H__actions .icon {
    color: #fff;
    margin: 0;
}
.H__actions--disabled {
    opacity: 0.5;
}
.H__actions--disabled .upload-media__button {
    cursor: not-allowed;
}
.image-swiper:hover > .image-swiper__arrow--active:hover,
.H__actions--disabled .upload-media__button:hover {
    opacity: 1;
}
.H__errors {
    color: #e12947;
    margin-top: 10px;
    font-size: 0.688rem;
    line-height: 0.813rem;
}
.H__error-title {
    margin: 0 0 0 8px;
}
.H__error-title::before {
    content: "•";
    display: inline-block;
    font-size: 28px;
    margin: 0 4px 0 0;
    vertical-align: text-bottom;
}
.user-avatar-editable .dropdown-content::after {
    display: none;
}
.user-avatar-editable .avatar-wrapper:not(.is-loading):hover .avatar-upload {
    display: flex;
}
.user-avatar-editable__dropdown .dropdown-menu-item {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    display: flex;
    margin: 5px 0;
    padding: 8px 15px;
    transition: all ease 0.25s;
    white-space: nowrap;
    width: 100%;
}
.user-avatar-editable__dropdown .dropdown-menu-item .icon {
    color: rgba(255, 255, 255, 0.8);
    fill: rgba(255, 255, 255, 0.8);
    margin: 0 10px 0 0;
}
.user-avatar-editable__dropdown .dropdown-menu-item:hover {
    background: #343437;
    color: #fff;
    fill: #fff;
}
.bv__tooltip hr,
.user-avatar-editable hr {
    background-color: #b9b9b9;
    margin: 10px;
    opacity: 0.6;
}
.bw {
    flex-shrink: 0;
    position: relative;
    width: 100%;
}
.bw--mobile {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.bw__row {
    display: flex;
    gap: 12px;
}
.bw__row > a,
.bw__row > button,
.bw__row > div {
    flex-grow: 1;
    justify-content: center;
    text-align: center;
}
@media (min-width: 479px) {
    .bw__row {
        display: flex;
        gap: 12px;
    }
    .bw__row > a,
    .bw__row > button,
    .bw__row > div {
        flex-basis: 50%;
    }
}
.bw__favorite {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: absolute;
    right: 15px;
    top: 70px;
    z-index: 4;
}
.bw__dropdown {
    color: #fff;
    font-size: 13px;
    min-width: 153px;
}
.bw__dropdown-footer {
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    margin: 12px 0 0;
    padding: 12px 0 0;
}
.bw__dropdown-header {
    align-items: center;
    column-gap: 16px;
    display: flex;
    justify-content: space-between;
}
.bw__edit-request-menu-button {
    align-items: center;
    gap: 12px;
}
.bw__edit-request-menu-button.btn {
    padding: 0 16px;
}
.bw__actions-settings {
    align-items: center;
    display: flex;
}
.bw__actions-settings-icon--padded {
    margin: 0 8px 0 0;
}
.bw__right {
    display: flex;
    gap: 12px;
    margin: 0 0 0 auto;
}
.bw__title {
    align-items: center;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap;
}
.bw__date {
    font-size: 14px;
    margin: 6px 0 0;
    opacity: 0.4;
    white-space: nowrap;
}
.bw__date--warning {
    color: #ef7d00;
    opacity: 1;
}
@media screen and (max-width: 639px) {
    .bw {
        padding: 10px 0;
        width: 100%;
    }
    .bw .action-buttons-container .user-fan-club-status-btn {
        height: 31px;
        justify-content: center;
        margin: 0 0 20px;
        width: 100%;
    }
    .bw .splitter {
        display: none;
    }
}
.bw__icon-wrapper {
    position: relative;
}
.bw__icon-decorator {
    color: #2e1d3e;
    height: 12px;
    position: absolute;
    right: 7px;
    top: -3px;
    width: 12px;
}
.bw .icon-diamond-colored,
.bw .icon-diamond-flat,
.bw .icon-diamond-rotate {
    height: 20px;
    margin: 0 10px 0 0;
    width: 20px;
}
.action-buttons-container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.action-buttons-container .button-dropdown__button {
    white-space: nowrap;
    font-weight: bold;
}
.action-buttons-container .btn {
    display: flex;
    flex-shrink: 0;
}
.action-buttons-container .btn .icon {
    height: 18px;
    width: 18px;
}
.action-buttons-container .menu-button-dots .tile-button {
    background: 0 0;
    height: auto;
    min-width: auto;
    padding: 0;
}
@media screen and (max-width: 479px) {
    .action-buttons-container__right {
        display: flex;
        gap: 12px;
    }
    .action-buttons-container .button-dropdown__button {
        font-size: 13px;
        padding: 0 10px;
    }
    .action-buttons-container .btn {
        font-size: 13px;
        padding: 0 8px;
    }
}
.arrow-down-animated {
    align-items: center;
    background: #f59e0b;
    background-clip: padding-box;
    border: 6px solid rgba(163, 73, 252, 0.2);
    border-radius: 14px;
    color: #fff;
    display: flex;
    height: 36px;
    justify-content: center;
    margin-left: 11px;
    overflow: hidden;
    padding: 4px;
    position: relative;
    transition: background-color 0.3s, border-color 0.3s;
    width: 36px;
}
.arrow-down-animated__content {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 46px;
    justify-content: space-between;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: -26px;
    width: 100%;
}
.arrow-down-animated__content--animated {
    animation-duration: 3s;
    animation-iteration-count: infinite;
    animation-name: arrow-down-animated-move-infinity;
}
.arrow-down-animated:hover {
    background-color: #d97706;
    border-color: rgba(138, 24, 252, 0.3);
}
.arrow-down-animated:hover > .arrow-down-animated__content--animated-hover {
    animation: arrow-down-animated-move 0.5s;
}
.arrow-down-animated .icon {
    height: 16px;
    width: 16px;
}
.icon-alert-decorated {
    align-items: center;
    display: inline-flex;
    justify-content: center;
    position: relative;
}
.icon-alert-decorated__icon,
.site-logo {
    position: relative;
}
.icon-alert-decorated::before {
    background: #000;
    content: "";
    height: 80%;
    position: absolute;
    width: 50%;
}
.site-logo {
    background: url(../../themes/red/logo.jpeg) no-repeat left center;
    background-size: contain;
    margin-left: 18px;
}
.site-logo--size--small {
    height: 23px;
    width: 104px;
}
.site-logo--size--medium {
    height: 34px;
    max-width: 146px;
    width: 146px;
}
.site-logo--size--large {
    height: 70px;
    width: 165px;
}
.site-logo--size--large-x {
    height: 70px;
    width: 205px;
}
.header-dropdown-content-split {
    margin-top: 16px;
    padding-top: 16px !important;
}
.header-dropdown-content-split::before {
    background: rgba(255, 255, 255, 0.1);
    content: "";
    height: 1px;
    left: 18px;
    position: absolute;
    right: 18px;
    top: 0;
}
.header-dropdown-content-split.invisible-mode-switch {
    margin-top: 16px;
    padding-top: 0 !important;
}
.header-dropdown-content-split.invisible-mode-switch::before {
    top: -8px;
}
.header-dropdown-content__icon {
    height: 24px;
    margin-left: 0;
    margin-right: 20px;
    width: 24px;
}
.header-dropdown-content__icon.icon-verified {
    margin: 0;
}
.header-dropdown-content__banner {
    display: flex;
    gap: 12px;
    margin: 18px 0-4px;
    padding: 0 18px;
}
.header-dropdown-content__banner--grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
}
.header-dropdown-content__verify {
    background: #343437;
    border-radius: 10px;
    flex: 1;
    padding: 8px 8px 4px;
    white-space: normal;
}
.header-dropdown-content__verify:hover {
    background: #424248;
}
.header-dropdown-content__verify-content {
    color: #cfcfd0;
    display: flex;
    font-size: 12px;
    gap: 6px;
    justify-content: space-between;
}
.header-dropdown-content__chip-beta {
    height: 24px;
    margin-left: 6px;
}
.account-container {
    line-height: normal;
    max-width: 100%;
    padding: 6px 0 0 10px;
}
.account-container .displayname__name {
    opacity: 0.8;
}
.crop-image {
    overflow: hidden;
    padding: 0 24px;
    -webkit-user-select: none;
    user-select: none;
}
.crop-image--disabled {
    pointer-events: none;
}
.crop-image__content {
    align-items: center;
    display: flex;
    height: 330px;
    justify-content: center;
    position: relative;
}
.crop-image__aspect-ratio {
    visibility: hidden;
    width: 100%;
}
.crop-image__wrapper {
    position: relative;
}
.crop-image__wrapper--type--horizontal {
    width: 100%;
}
.crop-image__wrapper--type--vertical {
    height: 100%;
}
.crop-image__crop-border {
    border: 2px solid #fff;
    bottom: 0;
    box-shadow: 0 0 0 500px rgba(0, 0, 0, 0.6);
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.crop-image__image {
    display: block;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transform-origin: left top;
    width: 100%;
}
.crop-image__image--ghost {
    opacity: 0.4;
    pointer-events: none;
}
.crop-image__button {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 38px;
    justify-content: center;
    position: absolute;
    width: 38px;
    z-index: 2;
}
.crop-image__button:disabled {
    opacity: 0.4;
    pointer-events: none;
}
.crop-image__button:hover {
    background: rgba(0, 0, 0, 0.8);
}
.crop-image__button--type--rotate {
    bottom: 10px;
    left: 10px;
}
.crop-image__button--type--minus {
    bottom: 10px;
    right: 58px;
}
.crop-image__button--type--plus {
    bottom: 10px;
    right: 10px;
}
.crop-image__modal.modal-ds-body {
    max-width: 540px;
}
.crop-image__modal.modal-ds-body .modal-ds-content {
    padding: 0 24px;
}
.crop-image__modal-content,
.form-fields .settings-field > div.settings-value .select,
.form-fields .settings-field > div.settings-value input,
.form-fields .settings-field > div.settings-value textarea {
    width: 100%;
}
.crop-image__modal-wrapper {
    margin: 0-24px;
}
.w {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: center;
    padding-top: 20px;
}
.w__right-controls {
    display: flex;
    flex: 1;
    justify-content: flex-end;
    position: relative;
}
.w__record-button {
    align-items: center;
    background: 0 0;
    border: 2px solid currentColor;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 49px;
    justify-content: center;
    outline: 0;
    padding: 0;
    position: relative;
    width: 49px;
}
.w__left-controls {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: flex-end;
}
.w__reverse-button {
    align-items: center;
    background: #343437;
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    outline: 0;
    transition: transform 150ms ease;
    width: 32px;
}
.w__reverse-button:active {
    transform: scale(0.9);
}

.x__media {
    overflow: hidden;
    padding: 0 30px;
    position: relative;
}
@media only screen and (max-width: 639px) {
    .x__media {
        align-items: center;
        display: flex;
        flex: 1;
    }
}
.x__timer {
    bottom: 10px;
    color: #fff;
    font-size: 12px;
    font-weight: 400;
    left: 50%;
    position: absolute;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
    transform: translateX(-50%);
}
.x__content {
    border-radius: 12px;
    height: auto;
    object-fit: contain;
    width: 100%;
}
@media only screen and (max-width: 639px) {
    .x__content {
        height: 100%;
        object-fit: cover;
    }
}
.x__controls {
    align-items: center;
    animation: controls-appearance 200ms ease;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-top: 20px;
}
.x__button-container {
    align-items: center;
    display: flex;
    flex: 1;
}
.x__button-container--left {
    justify-content: flex-start;
}
.x__button-container--right {
    justify-content: flex-end;
}
.x__play-button {
    align-items: center;
    background: #343437;
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 48px;
    justify-content: center;
    outline: 0;
    padding: 0;
    width: 48px;
}
.modal-form-title {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    justify-content: space-between;
    min-height: 72px;
    padding: 20px;
}
.modal-form-title,
.modal-form-title__back,
.modal-form-title__left {
    align-items: center;
    display: flex;
}
.modal-form-title__back {
    background: #343437;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    height: 24px;
    justify-content: center;
    margin: 0 22px 0 0;
    min-width: 24px;
    padding: 0 2px 0 0;
    width: 24px;
}
.modal-form-title__icon {
    padding: 0 20px 0 0;
}
.image-swiper {
    overflow: hidden;
    position: relative;
    user-select: none;
    width: 100%;
}
.image-swiper::before {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 2;
}
.image-swiper__root,
.image-swiper__root > body {
    overscroll-behavior-x: none;
}
.image-swiper__root--disabled {
    overflow: hidden;
}
.image-swiper__scroll {
    height: 100%;
    outline: 0;
    overflow: hidden;
    pointer-events: none;
    position: relative;
    width: 100%;
}
.image-swiper__scroll-space {
    height: 1px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    visibility: hidden;
}
.image-swiper__item {
    contain: strict;
    pointer-events: all;
    position: absolute;
    top: 0;
    z-index: 1;
}
.image-swiper__item-image {
    border: 0;
    height: 100%;
    object-position: center;
    outline: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
}
.image-swiper__item-image--size--cover {
    object-fit: cover;
}
.image-swiper__item-image--size--contain {
    object-fit: contain;
}
.image-swiper:hover > .image-swiper__arrow--active {
    opacity: 0.6;
}
.image-swiper__children {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.image-swiper__arrow {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
    cursor: pointer;
    display: flex;
    font-weight: 700;
    height: 30px;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 0.3s, left 0.3s, right 0.3s;
    width: 30px;
    z-index: 3;
}
.image-swiper__arrow--left {
    left: 20px;
}
.image-swiper__arrow--left > svg {
    transform: rotate(180deg);
}
.image-swiper__arrow--right {
    right: 20px;
}
.image-swiper__arrow--active {
    pointer-events: auto;
}
.image-swiper__arrow > svg {
    display: block;
    height: inherit;
    pointer-events: none;
    width: inherit;
}
.image-swiper__points {
    align-items: flex-end;
    background: linear-gradient(180deg, rgba(185, 185, 185, 0) 0, rgba(0, 0, 0, 0.35) 100%);
    bottom: 0;
    display: flex;
    height: 100px;
    justify-content: center;
    left: 0;
    padding: 0 0 20px;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 3;
}
.image-swiper__points-item {
    background: #fff;
    border-radius: 50%;
    height: 6px;
    margin: 0 2px;
    opacity: 0.5;
    position: relative;
    transition: opacity 0.6s, transform 0.6s;
    width: 6px;
}
.image-swiper__points-item--active {
    opacity: 1;
    transform: scale(1.2);
}
@media (max-width: 1024px) {
    .image-swiper__arrow {
        display: none;
    }
    .image-swiper__points {
        padding-bottom: 12px;
    }
}
.payout-settings.pending {
    opacity: 0.33;
    pointer-events: none;
}
.payout-settings h3 {
    margin-bottom: 20px !important;
}
.payout-settings .page-block {
    margin-bottom: 20px;
}
.payout-settings .notification-euro-link {
    color: #fff;
    text-decoration: underline;
}
.payout-settings .form-description {
    margin-top: 18px;
}
.payout-settings .form-controls {
    margin-top: 20px;
    text-align: right;
}
.payout-settings .form-controls .btn {
    margin-bottom: 0;
}
.form-fields .settings-field > div.settings-label,
.payout-settings-field-input.input.input {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
}
.form-fields {
    display: table;
    width: 100%;
}
.form-fields .settings-field {
    display: table-row;
}
.form-fields .settings-field > div {
    padding-bottom: 10px;
    vertical-align: middle;
}
.form-fields .settings-field > div.settings-label {
    display: table-cell;
    padding-right: 20px;
    vertical-align: top;
    width: 20%;
    font-size: 12px;
    line-height: 2.5rem;
}
.form-fields .settings-field > div.settings-value {
    display: table-cell;
    width: 100%;
}
.form-fields .settings-field:last-child > div {
    padding-bottom: 0;
}
.cg__description {
    color: #a0a0a1;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 20px;
}
.cg__notices {
    align-items: flex-start;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 20px;
}
.cg__notices > .cd {
    flex: 1;
}
.cg__notices > .cd--opened {
    align-self: stretch;
}
.cg__notice-header {
    align-items: center;
    color: #cfcfd0;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    gap: 12px;
    white-space: nowrap;
}
.cg__notice-content-item {
    color: #a0a0a1;
    font-size: 12px;
    line-height: 150%;
    margin: 0 0 12px;
}
.cg__collapse-button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: #707071;
    cursor: pointer;
    display: flex;
    justify-content: center;
    margin-left: auto;
    outline: 0;
}
.cg__collapse-button-icon {
    transform: rotate(180deg);
    transition: transform 150ms ease-in-out;
}
.cg__collapse-button-icon--opened {
    transform: rotate(0);
}
div.cg__content--collapsed {
    padding: 0;
}
.username-inline-card {
    align-items: center;
    display: inline-grid;
    grid-template-columns: auto minmax(0, 1fr);
    max-width: 100%;
    position: relative;
    text-align: left;
    white-space: nowrap;
}
.username-inline-card--full-width {
    display: grid;
}
.username-inline-card--spaced {
    padding: 8px 16px;
}
.username-inline-card--active,
.username-inline-card--spaced:hover {
    background: #424248;
}
.username-inline-card:hover {
    text-decoration: none;
}
.username-inline-card__avatar-wrapper--space-size--medium {
    margin: 0 12px 0 0;
}
.username-inline-card__avatar-wrapper--space-size--small {
    margin: 0 8px 0 0;
}
.user-tags-gallery {
    align-items: center;
    cursor: pointer;
    display: flex;
    gap: 6px;
    height: 24px;
    justify-content: flex-start;
    margin-top: 6px;
}
.user-tags-gallery:hover .user-tags-gallery__badge {
    background-color: rgba(255, 255, 255, 0.2);
}
.user-tags-gallery__delete-tag-button-wrapper {
    align-items: center;
    display: flex;
    flex-wrap: nowrap;
    gap: 6px;
}
.user-tags-gallery__delete-tag-button {
    background-color: #5f5f67;
    border: 0;
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    display: grid;
    height: 14px;
    padding: 0;
    place-items: center;
    width: 14px;
}
.user-tags-gallery__delete-tag-button:hover {
    background-color: #ef7d00;
    color: #fff;
}
.user-tags-gallery__badge {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 6px;
    color: #cfcfd0;
    font-size: 12px;
    font-weight: 500;
    padding: 4px 8px;
}
.dropdown-wrapper {
    max-width: 440px;
    position: absolute;
    top: calc(100% + 6px);
    z-index: 501;
}
.dropdown-wrapper--mobile {
    max-width: 100%;
    position: relative;
    width: 100%;
}
.dropdown-content {
    border-radius: 12px;
    box-sizing: border-box;
    color: rgba(255, 255, 255, 0.8);
    overflow: hidden;
    text-align: left;
}
.dropdown-content--shadow {
    box-shadow: 0 2px 16px rgba(0, 0, 0, 0.46);
}
.dropdown-content--background--strong {
    background: #1b1b1d;
}
.dropdown-content--background--strong::after {
    border-color: #1b1b1d;
}
.dropdown-content--background--light {
    background: #232325;
}
.dropdown-content--background--light::after {
    border-color: #232325;
}
.dropdown-content--spaced {
    padding: 20px;
}
.menu-button-dots,
.menu-button-dots__menu-button {
    align-items: center;
    display: flex;
    justify-content: center;
}
.menu-button-dots__menu-button {
    background: 0 0;
    border: 0;
    border-radius: 6px;
    color: #fff;
    cursor: pointer;
    filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
    transition: background 0.15s ease-in-out;
}
.menu-button-dots__menu-button--theme--default.menu-button-dots__menu-button--active,
.menu-button-dots__menu-button--theme--default:hover {
    background: rgba(0, 0, 0, 0.6);
}
.menu-button-dots__menu-button--theme--light.menu-button-dots__menu-button--active,
.menu-button-dots__menu-button--theme--light:hover {
    background: #343437;
}
.menu-button-dots__menu-button--theme--light-grey {
    border-radius: 10px;
    color: #a0a0a1;
}
.menu-button-dots__menu-button--theme--light-grey.menu-button-dots__menu-button--active,
.menu-button-dots__menu-button--theme--light-grey:hover {
    background: #343437;
    color: #fff;
}
.menu-button-dots__menu-button--theme--filled {
    background: #343437;
    border-radius: 12px;
    color: #fff;
}
.menu-button-dots__menu-button--theme--filled.menu-button-dots__menu-button--active,
.menu-button-dots__menu-button--theme--filled:hover {
    background: #424248;
}
.menu-button-dots__menu-button--theme--transparent {
    background: 0 0;
    color: #707071;
}
.menu-button-dots__menu-button--theme--transparent.menu-button-dots__menu-button--active,
.menu-button-dots__menu-button--theme--transparent:hover {
    color: #fff;
}
.menu-button-dots__menu-button--size--small {
    height: 24px;
    width: 24px;
}
.menu-button-dots__menu-button--size--normal {
    height: 32px;
    width: 32px;
}
.menu-button-dots__menu-button--size--large {
    height: 40px;
    width: 48px;
}
.menu-button-dots__icon-wrapper--vertical {
    transform: rotate(90deg);
}
.BZ {
    margin: 20px 0;
    text-align: left;
}
.BZ__row {
    display: flex;
    gap: 10px;
    position: relative;
}
.BZ__cell {
    display: flex;
    min-height: 64px;
    min-width: 64px;
    padding: 20px 0 0;
    word-break: break-word;
}
.BZ__cell--first {
    width: 200px;
}
.BZ__cell--type--color-top,
.BZ__cell--type--top {
    align-items: center;
    border-bottom: 1px #29292b solid;
    font-size: 16px;
    font-weight: 600;
    padding: 0;
}
.BZ__cell--type--color-top {
    background: #232325;
    border-radius: 12px 12px 0 0;
    flex: 1;
    justify-content: center;
}
.BZ__cell--type--color-bottom {
    background: #232325;
    border-radius: 0 0 12px 12px;
    flex: 1;
    justify-content: center;
}
.BZ__cell--type--color {
    align-items: center;
    background: #232325;
    flex: 1;
    justify-content: center;
}
.creator-lists__tabs-container {
    margin-bottom: 40px;
    max-width: 540px;
}

.B {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
}
@media screen and (max-width: 1023px) {
    .B--style--album {
        flex-direction: row;
        justify-content: center;
        top: 30%;
        width: 80%;
    }
    .B--style--album .B__label {
        max-width: 98px;
        text-align: left;
    }
}
@media screen and (max-width: 639px) {
    .B--style--album {
        flex-direction: column;
        top: 50%;
        width: 60%;
    }
    .B--style--album .B__label {
        max-width: 120px;
        text-align: center;
        white-space: normal;
    }
}
.B__label {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    max-width: 120px;
    text-align: center;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2), 0 1px 20px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 639px) {
    .B__label {
        font-size: 12px;
    }
}
.B__icon {
    color: #fff;
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));
    height: 32px;
    width: 32px;
}
@media screen and (max-width: 1023px) {
    .B__icon {
        height: 24px;
        width: 24px;
    }
}
.B__avatar {
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.2));
}
.B__avatar.avatar {
    height: 48px;
    width: 48px;
}
@media screen and (max-width: 639px) {
    .B__avatar.avatar {
        height: 36px;
        width: 36px;
    }
}
.B__avatar--adaptive.avatar {
    height: 64px;
    width: 64px;
}
@media (max-width: 639px) {
    .B__avatar--adaptive.avatar {
        height: 48px;
        width: 48px;
    }
}
@media (max-width: 479px) {
    .B__avatar--adaptive.avatar {
        height: 36px;
        width: 36px;
    }
}

@media screen and (max-width: 639px) {
    .creator-lists__tabs-container {
        margin-bottom: 24px;
    }
}
.creator-lists__add-users-icon {
    height: 14px;
    margin-right: 10px;
    width: 14px;
}
.creator-lists__sort .creator-lists__sort-item--ghost {
    border: 2px dashed #343437;
    border-radius: 16px;
    height: 80px;
}
@media screen and (max-width: 639px) {
    .creator-lists__sort .creator-lists__sort-item--ghost {
        height: 120px;
    }
}
.creator-lists__sort .creator-lists__sort-item--ghost .bk__content {
    display: none;
}
.creator-lists__skeleton {
    animation: skeleton-animation;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    background: #1b1b1d;
    border-radius: 16px;
    height: 80px;
    margin-bottom: 20px;
}
.creator-lists__skeleton:nth-child(2n) {
    animation-delay: 300ms;
}
@media screen and (max-width: 639px) {
    .creator-lists__skeleton {
        height: 120px;
        margin-bottom: 10px;
    }
}
.creator-list-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.creator-lists-delete-modal__name {
    word-break: break-all;
}
.landing-monetization,
.page-button {
    align-items: center;
    justify-content: center;
}
.page-button {
    border: 2px solid #343437;
    border-radius: 32px;
    color: rgba(255, 255, 255, 0.6);
    display: inline-flex;
    font-size: 13px;
    font-weight: 500;
    height: 32px;
    margin: 0 6px 10px;
    min-width: 32px;
}
.page-button:hover {
    background: rgba(255, 255, 255, 0.3);
    border-color: transparent;
    color: #fff;
    text-decoration: none;
}
.page-button:hover .icon {
    fill: #fff;
}
.page-button.page-button-ellipsis {
    border: 0 !important;
    color: rgba(255, 255, 255, 0.5);
    pointer-events: none;
}
.page-button.page-button-beginning,
.page-button.page-button-next {
    padding: 8px 12px;
}
.page-button.page-button-beginning {
    min-width: 124px;
}
.page-button.page-button-next {
    min-width: 68px;
}
.page-button .shift-nav-button {
    align-items: center;
    display: flex;
    flex-direction: row;
}
.page-button .icon {
    fill: rgba(255, 255, 255, 0.6);
    height: 14px;
    margin: 0;
    width: 14px;
}
.page-button.hidden {
    opacity: 0;
    pointer-events: none;
}
.landing-monetization {
    display: flex;
    min-height: max(100vh, 400px);
    position: relative;
}
.landing-monetization__logo {
    display: flex;
    justify-content: center;
    margin: 0 auto 50px;
}
.landing-monetization__logo .site-logo {
    margin: 0;
}
.landing-monetization__title {
    color: #fff;
    font-size: 80px;
    font-weight: 700;
    position: relative;
}
.landing-monetization__benefit-list {
    line-height: 160%;
    margin: 20px 0 0;
}
.landing-monetization__benefit-list--dotted {
    list-style: disc;
    margin: 30px 0 0 20px;
    max-width: 400px;
}
.landing-monetization__benefit-list-item {
    margin: 10px 0;
}
.landing-monetization__benefit-list-item--icon-marker {
    display: flex;
}
.landing-monetization__benefit-list-icon {
    margin: 0 10px 0 0;
}
.landing-monetization__wing {
    display: flex;
    justify-content: center;
    position: absolute;
    right: 30px;
    top: -35px;
}
.landing-monetization__wing .smile {
    height: 104px;
    width: 104px;
}
.landing-monetization__bubble {
    background: #f59e0b;
    position: absolute;
}
.landing-monetization__bubble--1 {
    border-radius: 7.53906px;
    height: 20.1px;
    left: 18%;
    opacity: 0.6;
    top: 70.5%;
    transform: rotate(-18.46deg);
    width: 20.1px;
}
.landing-monetization__bubble--2 {
    border-radius: 5.86371px;
    height: 16.75px;
    left: 33.3%;
    opacity: 0.2;
    top: 79%;
    transform: rotate(-18.46deg);
    width: 16.75px;
}
.landing-monetization__bubble--3 {
    border-radius: 5.86371px;
    height: 18.43px;
    left: 47.4%;
    opacity: 0.3;
    top: 89%;
    transform: rotate(-2.71deg);
    width: 18.43px;
}
.landing-monetization__bubble--4,
.landing-monetization__bubble--5 {
    border-radius: 7px;
    height: 18px;
    left: 69%;
    opacity: 0.5;
    top: 89.7%;
    transform: rotate(6.11deg);
    width: 18px;
}
.landing-monetization__bubble--5 {
    left: 71.3%;
    opacity: 0.3;
    top: 43%;
    transform: rotate(-18.46deg);
}
.landing-monetization__bubble--6,
.landing-monetization__bubble--7 {
    border-radius: 7.53906px;
    height: 18.43px;
    left: 78.5%;
    opacity: 0.5;
    top: 55.5%;
    transform: rotate(-18.46deg);
    width: 18.43px;
}
.landing-monetization__create-post {
    position: relative;
}
.landing-monetization__create-post > img {
    max-width: 105%;
    width: 476px;
}
.landing-monetization__create-post::after,
.landing-monetization__mass-messenger::after {
    content: "";
    height: 1px;
    pointer-events: none;
    position: absolute;
    top: 50%;
    width: 1px;
    z-index: -1;
}
.landing-monetization__create-post::after {
    border-radius: 15%;
    box-shadow: 0 0 150px 246px rgba(138, 24, 252, 0.3);
    left: 45%;
}
.landing-monetization__invite-and,
.landing-monetization__mass-messenger,
.landing-monetization__payout-methods {
    background-repeat: no-repeat;
    background-size: contain;
    position: relative;
}
.landing-monetization__mass-messenger > img {
    max-width: 100%;
    width: 530px;
}
.landing-monetization__mass-messenger::after {
    bottom: 70px;
    box-shadow: 0 0 150px 182px rgba(138, 24, 252, 0.3);
    left: 50%;
}
.landing-monetization__invite-and > img {
    max-width: 140%;
    position: relative;
    width: 556px;
}
.landing-monetization__payout-methods {
    height: 420px;
    max-width: 100%;
    width: 420px;
}
.landing-monetization__payout-methods::after {
    border-radius: 50%;
    box-shadow: 0 0 150px 382px rgba(138, 24, 252, 0.2);
    content: "";
    height: 1px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 39%;
    width: 1px;
    z-index: -1;
}
@media screen and (max-width: 767px) {
    .landing-monetization__title {
        font-size: 30px;
    }
    .landing-monetization__wing {
        position: static;
    }
    .landing-monetization__invite-and {
        margin-left: -20%;
    }
}
.data-table {
    color: #fff;
    font-weight: 400;
    min-height: 380px;
    min-width: min-content;
    width: 100%
}

.data-table__small-text {
    opacity: .6
}

.data-table .top-align-center {
    align-items: center;
    display: flex
}

.data-table .align-center {
    justify-content: center;
    text-align: center
}

.data-table .align-right {
    justify-content: flex-end;
    text-align: right
}

.data-table-head {
    font-size: .688rem;
    background: #1b1b1d;
    border-radius: 12px 12px 0 0;
    text-transform: uppercase
}

.data-table-head-row {
    line-height: 1.125rem;
    align-items: center;
    background: 0 0;
    display: flex;
    flex-flow: row nowrap;
    padding: 15px 20px;
    width: 100%
}

.data-table-head-cell {
    font-size: .688rem;
    color: rgba(255, 255, 255, .4);
    white-space: nowrap
}

.data-table-head-cell .searchable-head {
    margin: -9px 0
}

.data-table-footer {
    font-size: .813rem;
    background-color: #111113
}

.data-table-footer-row {
    line-height: 1.125rem;
    align-items: center;
    background: 0 0;
    display: flex;
    flex-flow: row nowrap;
    padding: 15px 20px;
    width: 100%
}

.data-table-body,
.data-table-footer-cell {
    font-size: .813rem
}

.data-table-body-row {
    align-items: center;
    background: #111113;
    display: flex;
    flex-flow: row nowrap;
    min-height: 44px;
    padding: 8px 20px;
    width: 100%;
    line-height: 1.125rem
}

.data-table-body-row:nth-child(even) {
    background: #1b1b1d
}

.data-table-body-row:last-child {
    border-radius: 0 0 12px 12px
}

.data-table-body-row.selectable-body-row {
    cursor: pointer
}

.data-table-body-cell,
.data-table-footer-cell,
.data-table-head-cell {
    align-items: center;
    display: flex;
    flex-grow: 1;
    flex-shrink: 1;
    margin-right: 10px;
    min-width: 125px;
    word-break: break-word
}

.data-table-body-cell--size-l {
    min-width: 180px
}

.data-table-body-cell:last-child,
.data-table-footer-cell:last-child,
.data-table-head-cell:last-child {
    margin-right: 0
}

.data-table-body-cell-content {
    align-items: center;
    display: flex;
    gap: 12px
}

.data-table-body-cell-content--vertical {
    align-items: flex-start;
    flex-direction: column;
    gap: 0
}

.data-table-body-cell-content--left {
    align-items: flex-start
}

.data-table-body-cell-content--right {
    align-items: flex-end
}

.data-table-body-cell-content--size-s {
    gap: 4px
}

.data-table-body-cell-content--size-l {
    gap: 20px
}

.data-table-header-cell {
    align-items: center;
    display: flex;
    gap: 5px;
    justify-content: start
}

.data-table-body-error {
    font-size: .875rem;
    color: #f44;
    justify-content: center;
    padding: 50px 0
}

.data-table-text-empty {
    opacity: .8
}

.data-table-loader {
    align-items: center;
    display: flex;
    height: 300px;
    justify-content: center
}
.earnings-table {
    min-height: 260px;
}
.creators-onboarding-page-content {
    display: flex;
    gap: 20px;
}
.creators-onboarding-page-content__onboarding-items {
    flex: 1 0 418px;
}
.creators-onboarding-page-content__recommendations {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: flex-start;
}
.creators-onboarding-page-content__info {
    flex: 0 1 418px;
    margin-top: 38px;
}
.creators-onboarding-page-content__complete-account {
    background-color: #232325;
    border-radius: 12px;
    margin-bottom: 42px;
    padding: 16px 16px 16px 20px;
}
.creators-onboarding-page-content__info-item {
    background-color: #111113;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 20px;
    padding: 16px;
    white-space: break-spaces;
}
@media screen and (max-width: 767px) {
    .creators-onboarding-page-content {
        flex-direction: column;
    }
    .creators-onboarding-page-content__onboarding-items {
        order: 2;
    }
    .creators-onboarding-page-content__info {
        flex: 0;
        margin-top: 0;
        order: 1;
    }
    .creators-onboarding-page-content__complete-account {
        margin-bottom: 32px;
    }
    .creators-onboarding-page-content__info-items-list {
        display: flex;
        max-width: 100%;
        overflow: auto;
        white-space: nowrap;
        width: 100%;
    }
    .creators-onboarding-page-content__info-item {
        display: inline-flex;
        flex: 1;
        margin-bottom: 10px;
        margin-right: 20px;
        max-width: 327px;
        min-width: calc(100% - 36px);
    }
}
.creators-onboarding-page-content__pwa-popup-button {
    color: #f59e0b;
    cursor: pointer;
}
.help-tooltip {
    align-items: center;
    cursor: default;
    display: inline-flex;
    font-weight: 400;
    height: 16px;
    justify-content: center;
    line-height: 15px;
    min-width: 16px;
    text-align: center;
    width: 16px;
    font-size: 0.625rem;
}
.help-tooltip:hover {
    color: #fff;
}
.help-tooltip--border {
    border: 1px solid currentColor;
    border-radius: 50%;
}
.help-tooltip--border:hover {
    background-color: #fff;
    border-color: #fff;
    color: #2b2b2b;
}
.help-tooltip__tooltip .tooltip-inner {
    padding: 8px 10px;
}
.ps {
    overflow: hidden !important;
    overflow-anchor: none;
    touch-action: auto;
}
.ps__rail-x,
.ps__rail-y {
    display: none;
    opacity: 0;
    position: absolute;
    transition: background 0.2s linear, opacity 0.2s linear;
}
.ps__rail-x {
    bottom: 0;
    height: 15px;
}
.ps__rail-y {
    right: 0;
    width: 15px;
}
.ps--active-x > .ps__rail-x,
.ps--active-y > .ps__rail-y {
    background: 0 0;
    display: block;
}
.ps--focus > .ps__rail-x,
.ps--focus > .ps__rail-y,
.ps--scrolling-x > .ps__rail-x,
.ps--scrolling-y > .ps__rail-y,
.ps:hover > .ps__rail-x,
.ps:hover > .ps__rail-y {
    opacity: 0.6;
}
.ps > .ps__rail-x.ps--clicking,
.ps > .ps__rail-x:focus,
.ps > .ps__rail-x:hover,
.ps > .ps__rail-y.ps--clicking,
.ps > .ps__rail-y:focus,
.ps > .ps__rail-y:hover {
    background: #eee;
    opacity: 0.9;
}
.ps__thumb-x,
.ps__thumb-y {
    background: #aaa;
    border-radius: 6px;
    position: absolute;
}
.ps__thumb-x {
    bottom: 2px;
    height: 6px;
    transition: background 0.2s linear, height 0.2s ease-in-out;
}
.ps__thumb-y {
    right: 2px;
    transition: background 0.2s linear, width 0.2s ease-in-out;
    width: 6px;
}
.ps__rail-x.ps--clicking .ps__thumb-x,
.ps__rail-x:focus > .ps__thumb-x,
.ps__rail-x:hover > .ps__thumb-x {
    background: #999;
    height: 11px;
}
.ps__rail-y.ps--clicking .ps__thumb-y,
.ps__rail-y:focus > .ps__thumb-y,
.ps__rail-y:hover > .ps__thumb-y {
    background: #999;
    width: 11px;
}
.cl__iframe-wrapper {
    background: #fff;
    position: relative;
    width: calc(100vw - 32px);
}
.cl__iframe {
    border: 0;
    display: block;
    height: calc(100vh - 40px);
    width: 100%;
}
.cl__benefits-list {
    margin: 8px 0 0;
}
.cl__benefit {
    align-items: center;
    color: #000;
    font-size: 12px;
    font-weight: 500;
    line-height: 20px;
    margin: 0;
    display: flex;
    flex-direction: row;
}
.cl__benefit .icon-check-1 {
    color: #d97706;
    height: 12px;
    margin: 0 16px 0 0;
    min-width: 12px;
    width: 12px;
}
.cl__benefit .icon-gift {
    fill: currentColor;
    margin-right: 14px;
}
.cl__benefits {
    background: 0 0;
    border-radius: 12px;
    padding: 0;
}
.cl__header {
    column-gap: 20px;
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 100%;
    padding: 20px 12px 0;
    row-gap: 10px;
    width: 924px;
}
.cl__header .displayname__name {
    color: #000;
}
.cl__header .display-full-name__nickname {
    color: rgba(5, 5, 6, 0.4);
    font-size: 10px;
}
.cl__header .user-status-icon {
    background: #fff;
}
.cl__header-block {
    background: rgba(212, 212, 212, 0.2);
    border-radius: 6px;
    min-height: 104px;
    padding: 12px 16px;
}
.cl__header-block--size--big {
    flex: 1;
}
.cl__header-block--size--small {
    width: 340px;
}
.cl__header-title {
    color: rgba(5, 5, 6, 0.4);
    font-size: 10px;
    text-transform: uppercase;
}
.cl__logo {
    background: url(/assets/common/images/myclub-logo-black.svg) no-repeat center;
    background-size: contain;
    height: 20px;
    margin: 0 0 12px;
    width: 68px;
}
@media screen and (max-width: 1023px) {
    .cl {
        width: 100%;
    }
}
@media screen and (max-width: 942px) {
    .cl__header {
        background: #343437;
        left: 0;
        padding: 0;
        position: absolute;
        top: 0;
    }
    .cl__header .displayname__name {
        color: #fff;
    }
    .cl__header .display-full-name__nickname {
        color: #a0a0a1;
    }
    .cl__logo {
        display: none;
    }
    .cl__iframe-wrapper--with-header {
        padding-top: 72px;
    }
    .cl__header-block {
        background: 0 0;
        min-height: 60px;
        min-width: 100%;
        padding: 12px;
    }
    .cl__header-block--size--small {
        display: none;
    }
}
.modal-information {
    max-width: calc(100vw - 32px);
    padding: 10px 16px 24px;
    text-align: center;
    width: 456px;
}
.modal-information__icon {
    display: block;
    margin: 0 0 12px;
}
.modal-information__icon.icon-mail {
    fill: #fff;
    margin-top: 20px;
}
.modal-information__description {
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    line-height: 20px;
    margin: 10px 0 16px;
}
.modal-information .modal-body {
    text-align: center;
    width: 480px;
}
@media screen and (max-width: 600px) {
    .modal-information .modal-body {
        width: calc(100vw - 20px);
    }
}
.global-loader {
    align-items: center;
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    background: rgba(0, 0, 0, 0.4);
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 100;
}
.list-round-marker {
    color: #cfcfd0;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
}
.list-item-round-marker {
    display: flex;
    margin: 10px 0;
}
.list-item-round-marker__content {
    padding: 4px 0 0;
}
.list-item-round-marker__marker {
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 7px;
    color: #fff;
    display: flex;
    height: 24px;
    justify-content: center;
    margin: 2px 12px 0 0;
    width: 24px;
}
.list-item-round-marker__description {
    color: rgba(255, 255, 255, 0.5);
    font-size: 12px;
    font-weight: 400;
    line-height: 15px;
}
.list-item-round-marker__title {
    font-size: 15px;
    font-weight: 400;
    line-height: 18px;
    margin: 0 0 4px;
}
.cW {
    max-width: 100%;
    padding: 24px;
    width: 600px;
}
.cW__title {
    line-height: 27px;
    margin: 0 0 10px;
}
.cW__description {
    margin-bottom: 24px;
    opacity: 0.6;
}
.cW__sources {
    display: flex;
    flex-direction: column;
}
.cW__link {
    color: #fff;
    cursor: pointer;
    font-size: 22px;
    font-weight: 500;
    margin-bottom: 10px;
}
.cW__link:focus,
.cW__link:hover {
    text-decoration: none;
}
.cW__link:last-child {
    margin-bottom: 0;
}
.cW__divider {
    border-top: 1px solid rgba(255, 255, 255, 0.15);
    margin: 20px 0;
}
.cW__footer {
    display: flex;
    justify-content: flex-end;
}
.b5 .title {
    margin-bottom: 14px;
}
.b5 .description {
    font-size: 0.938rem;
    line-height: 1.5rem;
    color: rgba(255, 255, 255, 0.8);
    font-weight: 400;
    margin: 0 0 30px;
}
.b5 .scroll-bar-container {
    white-space: nowrap;
}
.b5__header-cell {
    align-items: center;
    display: flex;
    gap: 5px;
    justify-content: start;
}
.b5__cell {
    align-items: flex-end;
    display: flex;
    gap: 12px;
}
.b5__cell--vertical {
    flex-direction: column;
    gap: 0;
}
.b5__cell--center {
    align-items: center;
}
.b5__cell--left {
    align-items: flex-start;
}
.b5__icon-wrapper {
    background: #343437;
    border-radius: 10px;
    display: grid;
    height: 32px;
    place-items: center;
    width: 32px;
}
.b5__my-flag {
    align-items: center;
    background: linear-gradient(180deg, #b672fb 0, #8a19fc 100%);
    color: #fff;
    display: flex;
    height: 17px;
    justify-content: center;
    width: 24px;
}
.b5__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.b5__beta {
    background: #343437;
    border-radius: 6px;
    display: flex;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    margin-left: 10px;
    padding: 4px 8px;
    width: 44px;
}
.transfer-stepper {
    margin: 0 auto;
    max-width: 504px;
}
.transfer-stepper__logo {
    display: flex;
    justify-content: center;
    margin: 0 0 20px;
}
.transfer-stepper__title {
    font-size: 32px;
    font-weight: 500;
    line-height: 39px;
    margin: 0 0 12px;
    text-align: center;
}
.transfer-stepper__description {
    color: #a0a0a1;
    font-size: 13px;
    line-height: 20px;
    margin: 0 0 34px;
    text-align: center;
}
.Z {
    padding: 20px;
}
.Z__benefits-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 5px 0;
}
.Z__benefit {
    align-items: center;
    background: #232325;
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.6);
    flex: 1 0 224px;
    font-size: 12px;
    line-height: 120%;
    min-height: 48px;
    padding: 10px 13px;
    width: 224px;
    display: flex;
    flex-direction: row;
}
.Z__benefit .icon-check-1 {
    color: #d97706;
    height: 16px;
    min-width: 12px;
    width: 16px;
}
.Z__benefit .icon-gift {
    fill: currentColor;
    margin-right: 14px;
}
@media (max-width: 540px) {
    .Z__benefit {
        width: 100%;
    }
}
.Z__icon {
    color: #d97706;
    margin-right: 12px;
}
.Z__actions--sticked {
    backdrop-filter: blur(2px);
    background: rgba(27, 27, 29, 0.8);
    border-radius: 0 0 12px 12px;
    bottom: 0;
    left: 0;
    padding: 20px;
    position: absolute;
    width: 100%;
}
@media screen and (max-height: 760px) {
    .Z__actions--sticked {
        border-top: 1px solid rgba(255, 255, 255, 0.05);
    }
}
.Z__actions > .btn {
    margin-top: 10px;
    width: 100%;
}
.Z__actions > .btn > .icon-diamond-colored,
.Z__actions > .btn > .icon-diamond-flat {
    height: 16px;
    margin: 0 6px 0 0;
    width: 16px;
}
.Z__actions > .btn:first-child:last-of-type {
    margin-top: 0;
}
.Z__actions-description {
    color: #f8f8f8;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    margin: 12px 0 0;
    opacity: 0.4;
    text-align: center;
}
@media screen and (max-width: 479px) {
    .Z {
        padding: 0 20px 20px;
    }
    .Z__benefits-list {
        gap: 0;
        margin: 20px 0 0;
    }
    .Z__benefit {
        border-radius: 0;
        min-height: auto;
    }
    .Z__benefit:first-child {
        border-radius: 12px 12px 0 0;
    }
    .Z__benefit:last-child {
        border-radius: 0 0 12px 12px;
    }
}
.smiles-dropdown {
    --dropdown-max-height: 300px;
    align-items: center;
    display: flex;
    line-height: 40px;
    margin-right: 8px;
    pointer-events: all;
}
.smiles-dropdown__list {
    background: #161616;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    display: block;
    margin: 0;
    position: absolute;
    transition: top 0.15s ease, left 0.15s ease;
    visibility: hidden;
    z-index: 501;
}
.smiles-dropdown__list--visible {
    visibility: visible;
}
.smiles-dropdown__list .smile {
    height: 26px;
    width: 26px;
}
.smiles-dropdown__list .scroll-bar-container {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    max-height: var(--dropdown-max-height);
    padding: 8px;
}
.smiles-dropdown__icon {
    color: #fff;
    display: inline-flex;
    opacity: 0.6;
    position: relative;
    width: 20px;
}
.smiles-dropdown__icon--active,
.smiles-dropdown__icon:hover {
    opacity: 1;
}
.cn {
    align-items: center;
    display: grid;
    grid-column-gap: 20px;
    grid-template-columns: minmax(168px, 1fr) auto auto;
}
.cn__input-label {
    position: relative;
}
.cn__input-label .input {
    padding-left: 38px;
}
.cn__input-label--error .scheduled-post-settings__input-icon {
    color: #fd3a5b;
}
.cn__input-icon {
    align-items: center;
    bottom: 0;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    left: 14px;
    pointer-events: none;
    position: absolute;
    top: 0;
}
.cn__clear-button {
    align-items: center;
    background-color: #5b5b5b;
    border: 3px solid #1b1b1d;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    margin: auto;
    transition: all ease 0.25s;
    width: 24px;
}
.cn__clear-button-icon {
    color: #fff;
    fill: #fff;
    margin: 0;
}
.cn__clear-button:hover {
    background-color: #af262f;
}
.cn__input-invisible {
    border: 0;
    border-radius: 12px;
    bottom: 0;
    left: 0;
    max-width: 100%;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 200px;
    z-index: 1;
}
.N {
    background-color: #232325;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    padding-bottom: env(safe-area-inset-bottom);
    position: relative;
    transition: width 200ms;
    width: 250px;
}
@media (max-width: 639px) {
    .N {
        border-radius: 0;
        bottom: var(--tap-bar-height);
        left: 0;
        position: fixed;
        right: 0;
        top: var(--pwa-notification-height);
    }
}
.N:not(:first-child) {
    margin-left: 20px;
}
.N__content {
    display: flex;
    flex-direction: column;
    height: 0;
    justify-content: flex-end;
    position: relative;
    transition: height 200ms;
}
.N__content--expanded {
    height: 430px;
    max-height: calc(100vh - 100px);
}
@media (max-width: 639px) {
    .N__content--expanded {
        flex: 1;
    }
}
@media screen and (max-width: 639px) {
    .N__content--expanded {
        height: auto;
        max-height: none;
        overflow: hidden;
    }
}
.N .chat-header-username {
    max-width: 160px;
}
.N--expanded {
    overflow: inherit;
    width: 360px;
}
@media (max-width: 639px) {
    .N--expanded {
        width: 100%;
    }
}
.N--expanded .messenger-chat-header {
    border-color: transparent;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.N--expanded .chat-header-username {
    max-width: 180px;
}
.N__skeleton-wrapper {
    flex: 1;
    max-height: 100%;
}
.see-last-message {
    align-items: center;
    background-color: #fff;
    border-radius: 50%;
    bottom: 87px;
    color: #101010;
    display: flex;
    height: 32px;
    justify-content: center;
    left: 50%;
    opacity: 0.8;
    position: absolute;
    transform: rotate(270deg);
    width: 32px;
}
.see-last-message:hover {
    opacity: 1;
}
.see-last-message-icon {
    margin: 0;
}
.message-request-reply-note {
    align-items: center;
    background-color: #343437;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    justify-content: center;
    margin: 16px 12px 12px;
    padding: 12px 14px;
    text-align: center;
}
.feed {
    position: relative;
}
.feed .feed-loader-wrapper {
    align-items: center;
    justify-content: center;
    display: flex;
    flex-direction: row;
    height: 90px;
}
.feed .feed-info {
    width: 642px;
}
@media screen and (max-width: 639px) {
    .feed .feed-info {
        padding: 0 20px;
    }
}
.feed .feed-info-title {
    font-size: 20px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 24px;
    color: #fff;
}
.feed .feed-info-description {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
    color: rgba(255, 255, 255, 0.6);
    margin-top: 20px;
}
.feed__tabs {
    max-width: calc(100vw - 32px);
    width: 100%;
}
.feed__tabs .pill-page-tabs {
    max-width: 100%;
}
.feed-content {
    align-items: center;
    display: flex;
    flex-direction: column;
    margin: 0 auto;
    max-width: 100vw;
    position: relative;
    width: 742px;
}
@media screen and (max-width: 639px) {

}
.feed-post {
    margin-bottom: 20px;
    width: 100%;
}
.feed-post:last-child {
    margin-bottom: 0;
}
.feed-post:last-child .tile-footer::after {
    display: none;
}
.c2__checkbox-container {
    align-items: flex-start;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 8px;
    justify-content: start;
}
.c2__checkbox-title {
    color: #fff;
    font-size: 14px;
    word-break: break-all;
}
.user-fan-club-subscribe {
    border-radius: 16px;
    max-width: min(100vw - 32px, 100%);
    overflow: hidden;
    padding: 0;
    width: 500px;
}
.select-tooltip {
    left: 0;
    position: fixed;
    top: 0;
    z-index: 599;
}
.cX,
.cX__button {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cX__button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.4));
    font-size: 12px;
    gap: 4px;
    position: relative;
    text-shadow: 0 0 2px rgba(0, 0, 0, 0.1);
    transition: 0.3s color;
}
.cX__button--style--like:hover,
.cX__button--style--liked {
    color: #f44;
}
.cX__button--style--follow:hover,
.cX__button--style--followed {
    color: #fccf49;
}
.cX__button--style--tip:hover {
    color: #cfcfd0;
}
.cX__button--style--joined {
    color: #f59e0b;
    pointer-events: none;
}
.cX__button--style--joined .icon-check-round-fill {
    position: relative;
}
.cX__button--style--joined::before {
    background: #fff;
    content: "";
    height: 17px;
    position: absolute;
    top: 8px;
    width: 19px;
}
.cX__button--style--join:hover {
    color: #f59e0b;
}
.cX__menu {
    background: #1b1b1d;
    border-radius: 12px;
    bottom: 12px;
    left: 12px;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    right: 12px;
    transform: translateY(100%);
    transition: 0.3s transform, 0.3s opacity;
    z-index: 2;
}
.cX__menu--visible {
    opacity: 1;
    transform: translateY(0);
}
.cX__menu-item {
    align-items: center;
    column-gap: 6px;
    cursor: pointer;
    display: flex;
    height: 48px;
    padding: 0 20px;
}
.cX__menu-item:hover {
    background: #232325;
}
.cX__controls {
    aspect-ratio: 0.5625;
    bottom: 0;
    height: 100%;
    left: 50%;
    pointer-events: none;
    position: absolute;
    transform: translateX(-50%);
    z-index: 3;
    -webkit-user-select: none;
    user-select: none;
}
.cX__controls--mobile {
    left: auto;
    position: static;
    right: 0;
    transform: none;
}
.cX__arrow {
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    margin-top: -12px;
    overflow: hidden;
    pointer-events: auto;
    position: absolute;
    top: 50%;
    transition: 0.3s color;
}
.cX__arrow:hover {
    color: #fff;
}
.cX__arrow--style--left {
    margin-right: 24px;
    right: 100%;
    transform: rotate(180deg);
}
.cX__arrow--style--right {
    left: 100%;
    margin-left: 24px;
}
.cX__controls-aside {
    bottom: 0;
    left: 100%;
    margin: 0 0 0 24px;
    pointer-events: auto;
    position: absolute;
    width: 32px;
}
.cX__controls-aside--mobile {
    bottom: 70px;
    left: auto;
    margin: 0;
    right: 14px;
}
@media (max-height: 750px) {
    .cX__arrow--not-own-left {
        color: rgba(0, 0, 0, 0.6);
        left: 14px;
        margin: 0;
        right: auto;
    }
    .cX__arrow--not-own-left:hover,
    .cX__arrow--not-own-right:hover {
        color: rgba(0, 0, 0, 0.8);
    }
    .cX__arrow--not-own-right {
        color: rgba(0, 0, 0, 0.6);
        left: auto;
        margin: 0;
        right: 14px;
    }
}
@media (max-height: 480px) {
    .cX__arrow {
        color: rgba(0, 0, 0, 0.6);
    }
    .cX__arrow:hover {
        color: rgba(0, 0, 0, 0.8);
    }
    .cX__arrow--style--left {
        left: 14px;
        margin-right: 24px;
        right: auto;
    }
    .cX__arrow--style--right {
        left: auto;
        margin-left: 24px;
        right: 14px;
    }
}
.bz {
    margin-bottom: 160px;
    min-height: min(100vh, 1000px);
}
.bz__arrows {
    height: 120px;
    position: relative;
}
.bz__arrows--with-margin {
    margin-top: -200px;
}
.bz__arrow {
    background-size: contain;
    height: 104px;
    margin: 1.5em 0 0;
    position: absolute;
    top: 100%;
    width: 100px;
}
.bz__arrow--first {
    background: url(/assets/common/images/promo/arrow-thin-2.svg) center/contain no-repeat;
    left: 60%;
    top: -2rem;
}
.bz__arrow--second {
    background: url(/assets/common/images/promo/arrow-thin-1.svg) center/contain no-repeat;
    left: 20%;
    top: -4rem;
}
.bz__title {
    font-size: 2.75rem;
    line-height: 3.125rem;
    font-weight: 700;
    margin: 0 0 52px;
    text-align: center;
}
.bz__footer {
    align-items: center;
    display: flex;
    flex-direction: column;
}
.bz__footer-title {
    font-size: 2.125rem;
    line-height: 2.625rem;
    font-weight: 700;
    margin: 0 0 20px;
}
.bz__footer-actions {
    align-items: center;
    display: flex;
    flex-direction: column;
}
.bz__arrow-wrapper {
    cursor: pointer;
}
.bz__arrow-wrapper .arrow-down-animated {
    margin-left: 0;
}
.bz .footer-button {
    align-items: center;
    border-radius: 16px;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 8px;
    justify-content: center;
    margin-bottom: 12px;
    max-width: 144px;
    min-height: 50px;
    width: 100%;
    font-size: 1.125rem;
}
@media screen and (max-width: 767px) {
    .bz__arrows--with-margin {
        margin: -30px;
    }
}
.favorite-button {
    z-index: 2;
}
.favorite-button.favorited {
    color: #d97706;
}
.favorite-button--active {
    z-index: 3;
}
.favorite-button__content {
    color: #fff;
}
.bBB {
    flex: 1;
    position: relative;
    width: 100%;
}
.bBB__size {
    aspect-ratio: 5/4;
    display: block;
    visibility: hidden;
    width: 100%;
}
.bBB__shadow-box {
    border-radius: 50%;
    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);
    pointer-events: none;
    position: absolute;
}
.bBB__shadow-box--face--1 {
    left: 20%;
    padding-top: 31%;
    top: 74%;
    width: 31%;
}
.bBB__shadow-box--face--2 {
    left: 30%;
    padding-top: 44%;
    top: 10%;
    width: 48%;
}
.bBB__face {
    position: absolute;
}
.bBB__face--face--1 {
    left: 14%;
    top: 73%;
    width: 38%;
}
.bBB__face--face--2 {
    left: 30%;
    top: 5%;
    width: 60%;
}
.bBB__face--chat {
    position: absolute;
}
.bBB__face--chat--1 {
    left: 14%;
    top: 0;
    width: 41%;
}
.bBB__face--chat--2 {
    left: 53%;
    top: 100%;
    width: 47%;
}
.bBB__face--shadow {
    border-radius: 20px;
    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);
}
.bBB__smile {
    left: 87%;
    position: absolute;
    top: 95%;
    width: 8%;
}
@media screen and (max-width: 767px) {
    .bBB {
        margin-top: 20px;
    }
}
.third-party-authorization .third-party-authorization-separator {
    color: rgba(255, 255, 255, 0.7);
    margin: 5px 0;
    padding: 5px 0;
    position: relative;
    font-size: 0.75rem;
    line-height: 0.938rem;
    display: flex;
    flex-direction: row;
}
.third-party-authorization .third-party-authorization-separator .third-party-authorization-separator-label {
    font-weight: 500;
    padding: 3px 15px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 0;
}
.third-party-authorization .third-party-authorization-separator:after,
.third-party-authorization .third-party-authorization-separator:before {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    content: " ";
    margin: 10px 0;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.third-party-authorization .google-authorization {
    background: #e0535c;
    border: 2px solid transparent;
    align-items: center;
    border-radius: 4px;
    cursor: pointer;
    justify-content: space-between;
    max-width: 300px;
    min-height: 38px;
    padding: 5px 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    transition: all 120msms ease-in-out 0s;
}
.third-party-authorization .google-authorization .google-authorization-icon {
    border-right: 1px solid rgba(255, 255, 255, 0.5);
    padding: 0 15px 0 20px;
}
.third-party-authorization .google-authorization .google-authorization-label {
    color: #fff;
    font-weight: 700;
    justify-content: center;
    opacity: 0.8;
    text-align: center;
    font-size: 0.938rem;
    line-height: 1.188rem;
    display: flex;
    flex-direction: row;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.third-party-authorization .google-authorization:hover {
    background: #ea5f69;
}
.third-party-authorization .twitter-auth-wrapper {
    margin-top: 12px;
}
.third-party-authorization .twitter-auth {
    background: #4691d0;
    border: 2px solid transparent;
    align-items: center;
    border-radius: 4px;
    cursor: pointer;
    justify-content: space-between;
    max-width: 300px;
    min-height: 38px;
    padding: 5px 0;
    width: 100%;
    display: flex;
    flex-direction: row;
    transition: all 120msms ease-in-out 0s;
}
.third-party-authorization .twitter-auth .twitter-auth-icon {
    border-right: 1px solid rgba(255, 255, 255, 0.5);
    color: #f8f8f8;
    padding: 0 15px 0 20px;
}
.third-party-authorization .twitter-auth .twitter-auth-label {
    color: #f8f8f8;
    font-weight: 700;
    justify-content: center;
    opacity: 0.8;
    text-align: center;
    font-size: 0.938rem;
    line-height: 1.188rem;
    display: flex;
    flex-direction: row;
    flex: 1;
    flex-basis: auto;
    flex-grow: 1;
    flex-shrink: 1;
}
.third-party-authorization .twitter-auth:hover {
    background: #449dda;
}
.abilitie-tip {
    flex: 1;
    margin: 20px 0 20px auto;
    max-width: 600px;
    overflow: hidden;
    position: relative;
}
.abilitie-tip::after {
    bottom: 70px;
    box-shadow: 0 0 150px 182px rgba(138, 24, 252, 0.3);
    content: "";
    height: 1px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    width: 1px;
    z-index: 10;
}
.abilitie-tip__message {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 11;
}
.abilitie-tip__message > .login-message-wrapper {
    opacity: 0;
    transform: scale(0);
    transition: opacity 0.5s, transform 0.5s;
}
.abilitie-tip__message::before {
    background: rgba(0, 0, 0, 0.4);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.abilitie-tip__message--visible {
    pointer-events: auto;
}
.abilitie-tip__message--visible > .login-message-wrapper {
    opacity: 1;
    transform: scale(1);
}
.abilitie-tip__message--visible > .login-message-wrapper .login-message__inline-emoji {
    animation: animation-ability-tip 2.5s ease;
}
.abilitie-tip__message--visible::before {
    opacity: 1;
}
@media screen and (max-width: 1023px) {
    .abilitie-tip .tip-modal__content .radio-pill-controls {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 639px) {
    .abilitie-tip {
        width: 100%;
    }
}
@media screen and (max-width: 767px) {
    .abilitie-tip {
        margin: 30px auto;
        max-width: 100%;
    }
}
.media-list-editor {
    align-items: center;
    background: #232325;
    border-radius: 12px;
    bottom: 12px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.22), 0 19px 38px rgba(0, 0, 0, 0.3);
    color: #fff;
    display: flex;
    justify-content: space-between;
    left: 20px;
    min-height: 64px;
    padding: 0 24px;
    position: fixed;
    right: 20px;
    z-index: 3;
}
.media-list-editor__left {
    font-size: 15px;
    font-weight: 700;
}
.media-list-editor__left .red-color-text {
    display: inline-block;
    min-width: 30px;
}
.media-list-editor__left,
.media-list-editor__right {
    align-items: center;
    display: flex;
}
.media-list-editor__left > .btn,
.media-list-editor__right > .btn {
    margin: 0 16px 0 0;
}
.media-list-editor__left > .btn:last-child,
.media-list-editor__right > .btn:last-child {
    margin-right: 0;
}
.media-list-editor__select-all {
    min-width: 96px;
}
.media-list-editor__progress {
    align-items: center;
    background: #232325;
    border-radius: 12px;
    bottom: 32px;
    box-shadow: 0 0 12px rgba(0, 0, 0, 0.22), 0 19px 38px rgba(0, 0, 0, 0.3);
    color: #fff;
    display: flex;
    left: 32px;
    max-width: calc(100% - 64px);
    min-height: 64px;
    padding: 0 16px;
    position: fixed;
    width: 362px;
    z-index: 3;
}
.media-list-editor__progress-icon {
    height: 18px;
    margin: 0 16px 0 0;
    width: 18px;
}
@media screen and (max-width: 1023px) {
    .media-list-editor {
        bottom: 0;
        left: 0;
        right: 0;
    }
    .media-list-editor__progress {
        bottom: 16px;
        left: 16px;
    }
}
@media screen and (max-width: 639px) {
    .media-list-editor__select-all {
        display: none !important;
    }
}
.tile-header {
    display: flex;
    padding: 14px 0 14px;
    position: relative;
}
.tile-header .avatar-wrapper {
    position: relative;
    z-index: 1;
}
.tile-header .avatar-border {
    border: 0;
}
.tile-header .content-wrapper {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    justify-content: center;
    margin: 0 0 2px 14px;
}
.tile-header .content {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0 30px 0 0;
    word-break: break-all;
}
.tile-header .scheduled-at {
    align-items: center;
    color: #fccf49;
    display: inline-grid;
    font-size: 12px;
    font-weight: 700;
    grid-auto-flow: column;
    grid-column-gap: 6px;
}
.tile-header-fan-club {
    font-size: 12px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
    align-items: center;
    background: #363636;
    border-radius: 62px;
    display: flex;
    height: 32px;
    padding: 0 8px;
    pointer-events: none;
}
@media screen and (max-width: 639px) {
    .tile-header-fan-club .icon {
        margin: 0;
    }
}
.posted-at {
    color: #fff;
    font-size: 12px;
    margin-top: 2px;
    opacity: 0.6;
}
.posted-at:hover {
    opacity: 0.8;
}
.picture-album-grid {
    column-gap: 12px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 24px;
}
@media screen and (min-width: 480px) {
    .picture-album-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (min-width: 640px) {
    .picture-album-grid {
        column-gap: 20px;
        grid-template-columns: repeat(4, 1fr);
        row-gap: 40px;
    }
}
@media screen and (min-width: 1366px) {
    .picture-album-grid {
        grid-template-columns: repeat(5, 1fr);
    }
}
.a11y-button {
    background: 0 0;
    border: 0;
    color: inherit;
    cursor: pointer;
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    padding: 0;
    -webkit-user-select: none;
    user-select: none;
}
.a11y-button--icon {
    border-radius: 2px;
    padding: 2px;
}
.a11y-button--icon:hover {
    background: rgba(248, 248, 248, 0.1);
    color: #fff;
}
.my-collection-album__sub-title {
    margin: 8px 0 36px;
}
.bn {
    color: #fff;
    min-height: 48px;
    padding: 0 18px;
}
.bn--type--default {
    background-color: #755e8d;
}
.bn--type--warning {
    background-color: #ffc107;
    color: #050506;
}
.bn--type--warning .bn__button-view-request {
    border-color: rgba(5, 5, 6, 0.4);
}
.bn--type--alert {
    background-color: #ef7d00;
}
.bn__icon {
    min-width: 20px;
}
.bn__body {
    align-items: center;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    gap: 10px;
    justify-content: center;
    line-height: 17px;
    margin: 0 auto;
    padding: 8px 0;
}
.bn__button-view-request {
    background: 0 0;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 10px;
    color: inherit;
    cursor: pointer;
    font-size: 13px;
    padding: 6px 16px;
    white-space: nowrap;
}
.bn__close-button-container {
    color: inherit;
    padding: 0 14px;
}
.bn__close-button {
    background: 0 0;
    border: 0;
    color: inherit;
    cursor: pointer;
    padding: 2px;
}
.creators-complete-account-badge {
    align-items: center;
    -webkit-backdrop-filter: blur(3.23077px);
    backdrop-filter: blur(3.23077px);
    background: rgba(52, 52, 55, 0.4);
    border-radius: 44px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    height: 44px;
    padding: 2px 16px;
    transition: max-width 200ms linear;
}
.creators-complete-account-badge:hover .creators-complete-account-badge__icon-wrapper {
    opacity: 1;
    width: 38px;
}
.creators-complete-account-badge__content {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.creators-complete-account-badge__title {
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 6px;
    white-space: nowrap;
}
.creators-complete-account-badge__percent {
    font-size: 24px;
    font-weight: 700;
    margin-left: 20px;
}
.creators-complete-account-badge__icon-wrapper {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    opacity: 0;
    overflow: hidden;
    transition: opacity 200ms linear 50ms, width 200ms linear 50ms;
    width: 0;
}
@media screen and (max-width: 1023px) {
    .creators-complete-account-badge {
        height: 32px;
        padding: 4px 12px;
    }
    .creators-complete-account-badge__icon {
        display: none;
    }
    .creators-complete-account-badge__title {
        font-size: 10px;
        margin-bottom: 2px;
    }
}
.user-photo-upload-cut-modal {
    border-radius: 3px;
    display: inline-flex !important;
    flex-direction: column;
    height: 800px;
    max-height: calc(100% - 10px * 2);
    max-width: calc(100% - 10px * 2);
    width: 692px;
}
.user-photo-upload-cut-modal.is-pending {
    opacity: 0.33;
    pointer-events: none;
}
@media screen and (max-width: 480px) {
    .user-photo-upload-cut-modal {
        height: calc(100% - 10px * 2);
        min-height: 0;
        min-width: 0;
        width: calc(100% - 10px * 2);
    }
}
.user-photo-upload-cut-modal .modal-ds-content {
    display: inline-flex !important;
    flex-direction: column;
    height: 100%;
    padding: 10px 20px 20px !important;
}
.user-photo-upload-cut-modal .modal-ds-content .text {
    display: block;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
.user-photo-upload-cut-modal .modal-ds-footer {
    display: flex;
    justify-content: flex-end;
}
.user-photo-upload-cut-modal .modal-ds-footer .btn-default-outline {
    color: #fff;
}
.user-photo-upload-cut-modal .modal-ds-footer .btn + .btn {
    margin-left: 20px;
}
.user-photo-upload-cut-modal .photo-cut-source-container {
    cursor: move;
    display: block;
    flex-grow: 1;
    flex-shrink: 1;
    margin: 10px 0;
    overflow: hidden;
    position: relative;
    text-align: left;
    -webkit-user-select: none;
    user-select: none;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-canvas {
    left: 0;
    position: absolute;
    top: 0;
}
.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-canvas-video {
    top: 50%;
    transform: translateY(-50%);
    width: 100%;
}
.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-frame-wrapper {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.user-photo-upload-cut-modal .photo-cut-source-container .photo-cut-frame-wrapper .photo-cut-filler {
    margin-top: 100%;
}
.br {
    display: flex;
    flex-direction: column;
    position: relative;
    z-index: 4
}

.br--reposition {
    -webkit-user-select: none;
    user-select: none
}

.br__video-parent {
    position: absolute;
    right: 0;
    top: -10%;
    transform-origin: left top;
    width: 100%
}

.br__avatar-flag {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    display: flex;
    height: 34px;
    justify-content: center;
    position: absolute;
    right: -4px;
    top: 0;
    width: 34px
}

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

.br__st-link-content {
    margin-bottom: 2px;
    overflow: hidden;
    position: relative
}

@media screen and (max-width:360px) {
    .br__st-link-content:after {
        background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);
        content: "";
        display: block;
        height: 20px;
        position: absolute;
        right: 0;
        top: 0;
        width: 24px
    }
}

.br__live {
    align-items: center;
    background: #ef7d00;
    border-radius: 6px;
    color: #fff;
    column-gap: 4px;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 20px;
    margin: 0 0 0 8px;
    padding: 0 8px 0 4px;
    white-space: nowrap
}

.br__live:hover {
    background: #ef7d00
}

.br__media {
    max-height: 100%;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: min(1144px, 100%)
}

.br__media-background-cover {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.br__media-background-cover--blured {
    filter: blur(20px)
}

.br__media--no-cover::before {
    background: linear-gradient(180deg, rgba(5, 5, 6, 0)0, #050506 100%), radial-gradient(50% 200%at 50% 50%, #582424eb 0, rgba(74, 43, 8, 0) 100%), linear-gradient(0deg, #050506, #050506), linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0)0, #050506 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.br__media--shadow::after {
    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 50.03%), linear-gradient(95.78deg, #050506 4.6%, rgba(5, 5, 6, 0) 50.04%), linear-gradient(180deg, rgba(5, 5, 6, 0)0, #050506 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.br__media-aspect-ratio {
    display: block;
    visibility: hidden;
    width: 100%;
    height: 580px;
}

.br__media-cover-image {
    left: 0;
    position: absolute;
    top: -30%;
    transform-origin: left top;
    width: 100%
}

.br__mobile-top-button {
    position: absolute;
    right: 15px;
    top: 70px;
    z-index: 4
}

.br__reposition-controls {
    bottom: 95px;
    position: absolute;
    right: 83px;
    z-index: 5
}

.br__reposition-controls--mobile {
    display: none
}

.br__info {
    margin: 0 auto;
    max-width: 1280px;
    padding: 64px 83px 0;
    position: relative;
    width: 100%;
    z-index: 3
}

@media screen and (max-width:1023px) {
    .br__info {
        padding: 80px 15px 0
    }
}

.br__tabs.tabs-ds {
    border-color: 1px solid rgba(255, 255, 255, .08);
    justify-content: center;
    margin: 44px 0 0;
    white-space: nowrap;
    width: 100%;
    z-index: 1
}

.br__tabs.tabs-ds::after,
.br__tabs.tabs-ds::before {
    background: rgba(255, 255, 255, .08);
    content: "";
    height: 1px;
    pointer-events: none;
    position: absolute;
    top: 100%;
    width: 1200px
}

.br__tabs.tabs-ds::before {
    box-sizing: border-box;
    right: 100%
}

.br__tabs.tabs-ds::after {
    left: 100%
}

.br__content-counters-wrapper--mobile {
    align-items: center;
    backdrop-filter: blur(10px);
    background: rgba(0, 0, 0, .2);
    border-radius: 20px;
    display: flex;
    padding: 14px 16px;
    position: absolute;
    right: 80px;
    top: 60px;
    z-index: 1
}

@media screen and (max-width:1023px) {
    .br__content-counters-wrapper--mobile {
        right: 15px
    }
}

@media (max-width:1079px) {
    .br__media--shadow::after {
        background: linear-gradient(0deg, #050506 0, rgba(5, 5, 6, .9) 24%, rgba(5, 5, 6, .75) 40%, rgba(5, 5, 6, .5) 60%, rgba(5, 5, 6, 0) 100%)
    }
    .br__avatar-wrapper {
        width: 80px
    }
    .br__avatar-wrapper .avatar {
        height: 80px;
        min-width: 80px;
        width: 80px
    }
    .br__name-wrapper {
        align-items: flex-start;
        flex-direction: column
    }
    .br__username {
        margin-left: 0;
        font-weight: bold;
    }
    .br .displayname.displayname--big .displayname__name {
        font-size: 1.75rem
    }
    .br__profile-counters {
        font-size: .875rem
    }
    .br__content-counters-wrapper {
        height: auto;
        margin-top: 16px;
        padding: 0
    }
    .br__content-counters-wrapper::before {
        display: none
    }
    .br .br__tabs {
        margin-top: 32px
    }
    .br__reposition-controls {
        display: none;
        position: relative
    }
    .br__reposition-controls--mobile {
        display: block
    }
}

.br__onboarding-badge {
    left: 90px;
    position: absolute;
    top: -10px
}

.br .tab-interactive-active-ds .white-color-text-2 {
    color: #a0a0a1
}

.br .tabs-ds {
    column-gap: 48px
}

.br .tab-ds {
    margin: 0
}

@media screen and (max-width:1023px) {
    .br__onboarding-badge {
        left: 54px;
        top: -4px
    }
}

@media screen and (max-width:639px) {
    .br .tabs-ds {
        column-gap: 32px
    }
}

@media screen and (max-width:320px) {
    .br .tabs-ds {
        column-gap: 24px
    }
}

.media-processing {
    align-items: center;
    display: flex;
    flex-direction: column;
    left: 50%;
    position: absolute;
    top: 200px;
    transform: translateX(-50%);
    z-index: 5
}

@media screen and (max-width:1023px) {
    .media-processing {
        top: 32%
    }
}

.media-processing .loader-text {
    color: #fff;
    margin-top: 10px;
    max-width: 210px;
    opacity: .6;
    text-align: center
}

.tab-ds,
.tabs-ds {
    align-items: center;
    display: flex
}

.tabs-ds {
    border-bottom: 1px solid rgba(255, 255, 255, .13);
    margin: 0;
    position: relative
}

.tab-ds {
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, .6);
    justify-content: center;
    list-style-type: none;
    margin: 0 28px;
    outline: 0;
    overflow: visible;
    -webkit-user-select: none;
    user-select: none
}

.tab-ds:first-child {
    margin-left: 0
}

.tab-ds:last-child {
    margin-right: 0
}

.personal-notifications-modal-panel .header-notifications-action a,
.tab-ds:hover {
    color: rgba(255, 255, 255, .8)
}

@media (max-width:639px) {
    .tab-ds--adaptive {
        flex: 1;
        margin: 0
    }

}

.tab-interactive-ds {
    align-items: center;
    display: flex;
    position: relative
}

.tab-interactive-medium-ds,
.tab-interactive-small-ds {
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal
}

.tab-interactive-small-ds {
    font-size: 13px;
    margin-right: 30px;
    padding: 9px 0
}

.tab-interactive-medium-ds {
    font-size: 15px;
    height: 50px;
    padding: 0 0 12px
}

.tab-interactive-active-ds {
    color: #fff
}

.tab-interactive-active-ds:active,
.tab-interactive-active-ds:focus,
.tab-interactive-active-ds:hover {
    color: #fff
}

.tab-interactive-active-ds::after {
    background: var(--primary-border);
    border-radius: 3px;
    bottom: -1px;
    content: "";
    height: 3px;
    left: 0;
    position: absolute;
    width: 100%
}

.tab-link-ds {
    flex: 1;
    justify-content: center
}

.tab-link-ds,
.tab-link-ds:active,
.tab-link-ds:hover {
    text-decoration: none
}

.tab-link-ds:focus {
    text-decoration: inherit
}


.br__stories {
    margin: 0 auto;
    max-width: 100vw;
    padding: 0 16px;
    position: relative;
    width: 742px;
    padding: 0;
}

.br__name-wrapper {
    margin-top: 16px
}

.br__name-wrapper .displayname__name {
    word-break: break-word
}

.br__username {
    color: #fff;
    opacity: .6;
    font-size: 16px;
}

.br__avatar-wrapper {
    position: relative;
    width: 124px;
    z-index: 4
}

.br__profile-counters {
    color: rgba(255, 255, 255, .8);
    font-weight: 400;
    margin-top: 20px;
    opacity: .8;
    font-size: 1rem
}

.br__content-counters-wrapper {
    align-items: center;
    box-sizing: border-box;
    display: flex;
    height: 72px;
    justify-content: space-between;
    margin-top: 40px;
    padding: 7px 16px;
    position: relative;
    width: 100%;
    z-index: 5
}

.br__content-counters-wrapper::before {
    backdrop-filter: blur(38px);
    background: rgba(255, 255, 255, .05);
    border-radius: 20px;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%
}

.br__actions {
    display: flex;
    position: relative;
    width: 100%
}

.br .dropdown-content {
    padding: 4px 0
}

.br__tabs.tabs-ds {
    border-color: 1px solid rgba(255, 255, 255, .08);
    justify-content: center;
    margin: 44px 0 0;
    white-space: nowrap;
    width: 100%;
    z-index: 1
}

.br__tabs.tabs-ds::after,
.br__tabs.tabs-ds::before {
    background: rgba(255, 255, 255, .08);
    content: "";
    height: 1px;
    pointer-events: none;
    position: absolute;
    top: 100%;
    width: 1200px
}

.br__tabs.tabs-ds::before {
    box-sizing: border-box;
    right: 100%
}

.br__tabs.tabs-ds::after {
    left: 100%
}

.br__content-counters-wrapper--mobile {
    align-items: center;
    backdrop-filter: blur(10px);
    background: rgba(0, 0, 0, .2);
    border-radius: 20px;
    display: flex;
    padding: 14px 16px;
    position: absolute;
    right: 80px;
    top: 60px;
    z-index: 1
}

@media screen and (max-width:1023px) {
    .br__content-counters-wrapper--mobile {
        right: 15px
    }
}

@media (max-width:1079px) {
    .br__media--shadow::after {
        background: linear-gradient(0deg, #050506 0, rgba(5, 5, 6, .9) 24%, rgba(5, 5, 6, .75) 40%, rgba(5, 5, 6, .5) 60%, rgba(5, 5, 6, 0) 100%)
    }
    .br__avatar-wrapper {
        width: 80px
    }
    .br__avatar-wrapper .avatar {
        height: 100px;
        min-width: 100px;
        width: 100px
    }
    .br__name-wrapper {
        align-items: flex-start;
        flex-direction: column
    }
    .br__username {
        margin-left: 0
    }
    .br .displayname.displayname--big .displayname__name {
        font-size: 1.75rem
    }
    .br__profile-counters {
        font-size: .875rem
    }
    .br__content-counters-wrapper {
        height: auto;
        margin-top: 16px;
        padding: 0
    }
    .br__content-counters-wrapper::before {
        display: none
    }
    .br .br__tabs {
        margin-top: 32px
    }
    .br__reposition-controls {
        display: none;
        position: relative
    }
    .br__reposition-controls--mobile {
        display: block
    }
}

.br__onboarding-badge {
    left: 90px;
    position: absolute;
    top: -10px
}

.br .tab-interactive-active-ds .white-color-text-2 {
    color: #a0a0a1
}

.br .tabs-ds {
    column-gap: 48px
}

.br .tab-ds {
    margin: 0
}

@media screen and (max-width:1023px) {
    .br__onboarding-badge {
        left: 54px;
        top: -4px
    }
}

@media screen and (max-width:639px) {
    .br .tabs-ds {
        column-gap: 32px
    }
}

@media screen and (max-width:320px) {
    .br .tabs-ds {
        column-gap: 24px
    }
}

.media-processing {
    align-items: center;
    display: flex;
    flex-direction: column;
    left: 50%;
    position: absolute;
    top: 200px;
    transform: translateX(-50%);
    z-index: 5
}

@media screen and (max-width:1023px) {
    .media-processing {
        top: 32%
    }
}

.media-processing .loader-text {
    color: #fff;
    margin-top: 10px;
    max-width: 210px;
    opacity: .6;
    text-align: center
}
.br__progress-title {
    align-items: center;
    display: flex;
    font-size: 14px;
    gap: 4px;
    justify-content: space-between;
    margin: 0 0 10px;
    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);
}
.br__title-text {
    color: #cfcfd0;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.br__left {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    max-width: calc(100% - 56px);
}
.bx {
    color: #707071;
    column-gap: 24px;
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0 0;
    overflow: hidden;
    row-gap: 10px;
}
.bx__item {
    align-items: center;
    column-gap: 6px;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    position: relative;
}
.bx__item::after {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    content: "";
    height: 4px;
    left: -13px;
    position: absolute;
    width: 4px;
}
.bx__link {
    color: #a0a0a1;
}
.bx__link:hover {
    color: #cfcfd0;
}
.bv {
    position: relative;
}
.bv__tooltip {
    width: 145px;
}
.bv__tooltip .tooltip-inner {
    display: flex;
    flex-direction: column;
}
.bv__button {
    align-items: center;
    background: #111113;
    border: 0;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-weight: 500;
    gap: 12px;
    height: 40px;
    justify-content: center;
    padding: 11px 20px;
    transition: background 0.3s;
    width: 100%;
}
.bv__button:hover {
    background: #232325;
}
@media screen and (max-width: 767px) {
    .bv__button {
        padding: 11px;
    }
}
.bv__action {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    min-height: 38px;
    padding: 7px 22px 7px 15px;
    transition: all ease 0.25s;
    white-space: nowrap;
    width: 145px;
}
.bv__action .icon {
    fill: rgba(255, 255, 255, 0.8);
    margin-right: 10px;
}
.bv__action.profile-cover-dropdown__action--active,
.bv__action:hover {
    background: #343437;
    color: #fff;
}
.text-post-tile {
    position: relative;
}
.text-post-live-preview {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 25%;
    z-index: 1;
}
.text-post-live-preview + .tile-header {
    max-width: calc(75% - 12px);
}
.text-post {
    border-radius: 12px 12px 0 0;
    overflow: hidden;
    position: relative;
}
.text-post--own-single-text {
    padding-top: 40px;
}
@media screen and (min-width: 640px) {
    .text-post--own-single-text .feed__post-label {
        left: 0;
    }
}
.text-post.locked {
    min-height: 300px;
}
.text-post .text {
    color: #9b9b9b;
    font-size: 15px;
    line-height: 20px;
    margin: 20px 0 0;
    padding: 0;
    text-align: left;
    letter-spacing: .021rem;
}
.text-post .text.hidden-text {
    filter: blur(3px);
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
}
.text-post .image-skeleton {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);
    background-size: 300% 100%;
    will-change: background-position;
    height: 256px;
    width: 642px;
}
.close-icon {
    color: rgba(248, 248, 248, 0.6);
    cursor: pointer;
    margin: 0;
    pointer-events: initial;
    transition: color 0.05s ease-in-out;
}
.close-icon:hover {
    color: rgba(248, 248, 248, 0.88);
}
.close-icon-small {
    height: 20px;
    padding: 4px;
    width: 20px;
}
.close-icon-medium {
    height: 24px;
    width: 24px;
}
.close-icon-large {
    height: 28px;
    width: 28px;
}
.close-button-ds {
    background: 0 0;
    border: 0;
    color: #a0a0a1;
    cursor: pointer;
    padding: 4px;
}
.payout-settings-info-alert.payout-settings-info-alert {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
    margin-top: 7px;
    padding: 10px;
}
.bH {
    align-items: center;
    border-radius: 12px;
    column-gap: 20px;
    display: flex;
    justify-content: center;
    margin: 20px 0;
    min-height: 108px;
    overflow: hidden;
    padding: 20px 10px;
}
.bH--style--dark {
    background: #111113;
}
.bH--style--light {
    background: #232325;
}
.bH__content {
    column-gap: 40px;
    display: flex;
    flex-wrap: wrap;
    row-gap: 16px;
}
.bH__icon {
    height: 48px;
    max-width: 48px;
    position: relative;
    width: 48px;
}
.bH__icon::before {
    content: "";
    height: 192px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 192px;
}
.bH__icon--style--done::before,
.bH__icon::before {
    background: radial-gradient(50% 50%at 50% 50%, rgba(46, 123, 230, 0.2) 0, rgba(27, 27, 29, 0) 100%);
}
.bH__icon--style--pending {
    color: #fccf49;
}
.bH__icon--style--pending::before {
    background: radial-gradient(50% 50%at 50% 50%, rgba(252, 207, 73, 0.1) 0, rgba(27, 27, 29, 0) 100%);
}
.bH__icon--style--failed {
    color: #ef7d00;
}
.bH__icon--style--failed::before {
    background: radial-gradient(50% 50%at 50% 50%, rgba(210, 27, 76, 0.2) 0, rgba(27, 27, 29, 0) 100%);
}
@media (max-width: 479px) {
    .bH {
        align-items: flex-start;
        justify-content: flex-start;
    }
}
.photo-album-tile {
    position: relative;
}
.photo-album-live-preview {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 25%;
    z-index: 1;
}
.photo-album-live-preview + .tile-header {
    max-width: calc(75% - 12px);
}
.photo-album {
    display: flex;
    height: 100%;
    width: 100%;
}
.photo-album.photo-loading .photo-wrapper {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);
    background-size: 300% 100%;
    will-change: background-position;
}
.photo-album,
.photo-album__swiper {
    position: relative;
}
.photo-album .photo {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100%;
    width: 100%;
}
.photo-album .counter-wrapper {
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 8px;
    bottom: 16px;
    padding: 16px;
    position: absolute;
    right: 16px;
}
@media screen and (max-width: 639px) {
    .photo-album .counter-wrapper {
        bottom: 8px;
        padding: 8px;
        right: 8px;
    }
}
.photo-album .counter {
    color: #fff;
    font-size: 28px;
    font-weight: 700;
}
@media screen and (max-width: 639px) {
    .photo-album .counter {
        font-size: 12px;
    }
}

.island-value-link {
    background: #2e2e30;
    border-radius: 10px;
    display: block;
    padding: 6px 12px;
    width: 100%;
}
.island-value-link:hover {
    background: #343437;
    text-decoration: none;
}
.island-value-link__content {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-height: 30px;
}
.island-value-link__name,
.island-value-link__value {
    align-items: center;
    color: #cfcfd0;
    display: flex;
    font-size: 15px;
    font-weight: 500;
}
.island-value-link__value {
    color: #a349fc;
    font-size: 18px;
}
.island-value-link__bottom {
    font-size: 12px;
    line-height: 16px;
    margin: 4px 0 0;
}

.settings-island {
    background-color: #1b1b1d;
    border-radius: 12px;
    margin-bottom: 20px;
}
.settings-island--grow {
    flex: 1;
    height: 100%;
}
.settings-island__sub-title {
    align-items: center;
    display: flex;
    font-size: 20px;
    font-weight: 700;
    gap: 8px;
    justify-content: flex-start;
    margin-bottom: 10px;
}
.settings-island__add-request {
    display: flex;
}
.settings-island__add-request-button {
    flex: 1;
}
.settings-island__add-request-icon {
    margin-right: 12px;
}
.settings-island-title-wrapper--size--medium {
    padding: 12px 22px 0;
}
.settings-island-title-wrapper--size--big {
    padding: 22px;
}
.settings-island-title-wrapper .settings-island-title {
    font-size: 1rem;
}
.settings-island-title-wrapper--line {
    border-bottom: 2px solid rgba(255, 255, 255, 0.05);
}
.settings-island-title-wrapper .settings-island-icon {
    color: #fff;
    fill: #fff;
    margin-right: 16px;
}
.settings-island-content {
    padding: 20px;
}
.settings-island:last-child {
    margin-bottom: 0;
}
.settings-island.settings-island-locked > .settings-island-content {
    padding-top: 5px;
    text-align: center;
}
.settings-island > .settings-island-title-wrapper {
    align-items: center;
    overflow: hidden;
    position: relative;
    text-overflow: ellipsis;
    display: flex;
    flex-direction: row;
}
.settings-island > .settings-island-title-wrapper > .settings-island-title {
    margin-bottom: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
    white-space: nowrap;
}
.settings-island > .settings-island-content {
    position: relative;
    width: 100%;
}
.settings-island .settings-island-tooltip {
    display: inline-block;
    margin-left: 10px;
}
.settings-island .settings-island-tooltip-icon {
    color: #9b9b9b;
}
.settings-island .radio-container {
    margin-bottom: 10px;
}
.settings-island-title__additional {
    position: absolute;
    right: 22px;
    top: 20px;
}
.settings-title-email {
    display: inline-block;
    font-size: 13px;
    vertical-align: middle;
}
.settings-title-email-status {
    display: inline-block;
    margin: 0 10px;
}
.settings-title-email-status__report-icon {
    color: #fccf49;
}
.settings-title-email-status > .icon {
    margin-bottom: 5px;
}
.settings-title-email-status > .badge-alert-medium {
    display: inline-block;
}
.settings-title-email.confirmed {
    color: #41bea6;
}
.settings-title-email.confirmed .icon {
    fill: #41bea6;
}
.settings-island-content-button-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 10px;
}
.settings-island-content-button-container > .btn {
    
}
.cf__content {
    color: #a0a0a1;
    font-size: 13px;
}
.cf__input-wrapper {
    margin-top: 20px;
}
.cf__input.input::placeholder {
    color: #707071;
}
.circle-progress {
    display: block;
    height: 100%;
    position: relative;
    width: 100%;
}
.circle-progress-border {
    border: 1px solid #515151;
    border-radius: 50%;
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
}
.circle-progress-svg {
    height: 100%;
    pointer-events: none;
    width: 100%;
}
.circle-progress-circle {
    fill: none;
    stroke: currentColor;
    stroke-dasharray: 314%;
    stroke-linecap: round;
    transform-origin: center;
}
.user-tags-list {
    display: flex;
    flex-direction: column;
    padding-top: 8px;
}
.user-tags-list--mobile .user-tags-list__list {
    max-height: 60vh;
    width: 100%;
}
.user-tags-list__header {
    color: #707071;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    padding: 10px 18px;
    text-transform: uppercase;
}
.user-tags-list__list {
    flex-grow: 1;
    max-height: 320px;
    max-width: 100%;
    min-height: 300px;
    width: 320px;
}
.user-tags-list__list-item {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 8px 18px;
}
.user-tags-list__list-item:hover {
    background-color: #424248;
}
.guest-header-menu__login-buttons button :not(:last-child),
.user-tags-list__list-item:not(:last-child) {
    margin-bottom: 16px;
}
.documents-page {
    margin-bottom: 20px;
}
.documents-page__form-error {
    font-size: 12px;
    margin: 6px 0 0;
}
.documents-page .submit-block {
    padding: 20px;
    text-align: center;
}
.documents-page__field-notice {
    background: #232325;
    border-radius: 12px;
    color: #a0a0a1;
    display: flex;
    gap: 8px;
    line-height: 140%;
    margin: 20px 0 10px;
    padding: 12px 16px;
}
.documents-page .message {
    border-radius: 4px;
    display: flex;
    margin-top: 20px;
    padding: 10px 20px;
    font-size: 0.875rem;
}
.documents-page .message .message__icon {
    margin-right: 10px;
    font-size: 1.25rem;
}
.documents-page .message.message--success {
    background-color: #1b1b1d;
    color: #fff;
}
.documents-page .message.message--success .message__icon {
    fill: #078a36;
}
.documents-page .message.message--info {
    background-color: #6f8643;
}
.documents-page .message.message--danger .message__icon,
.documents-page .message.message--info .message__icon {
    fill: #fff;
}
.documents-page .message.message--danger {
    background-color: #9a272b;
}
.documents-page__accent-button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: #f59e0b;
    cursor: pointer;
    display: flex;
    gap: 6px;
    margin: 10px 0 12px;
    outline: 0;
}
.page-row {
    display: flex;
    gap: 20px;
    margin-top: 20px;
}
.guest-header-menu__login-buttons button,
.page-row__item {
    flex: 1;
}
@media screen and (max-width: 1023px) {
    .page-row {
        flex-direction: column;
    }
}
.agreement-block {
    align-items: center;
    background: #1b1b1d;
    border: 0;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    justify-content: center;
    margin-top: 20px;
    min-height: 40px;
    padding: 4px 20px;
    text-align: center;
    width: 100%;
}
.agreement-block:hover {
    text-decoration: underline;
}
.guest-header-menu {
    position: relative;
}
.guest-header-menu__menu-button {
    align-items: center;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    flex: 1;
    height: 100%;
    justify-content: center;
    transition: color 150ms linear;
    width: 56px;
}
.guest-header-menu__menu-button--active {
    color: #fff;
}
.guest-header-menu__dropdown-wrapper {
    animation: opacity-fade-show 0.2s forwards;
    border-radius: 16px;
    left: auto;
    max-height: calc(100vh - 100px - var(--pwa-notification-height) - var(--tap-bar-height) / 2);
    overflow: auto;
    position: absolute;
    right: 8px;
    top: calc(100% + 8px);
    z-index: 201;
}
.guest-header-menu__dropdown-content {
    margin: 0;
    min-width: 300px;
    padding: 16px 0;
}
.guest-header-menu__login-buttons {
    display: flex;
    padding: 0 24px;
}
.guest-header-menu__menu-item {
    position: relative;
}
.guest-header-menu__menu-item > a {
    align-items: center;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    font-size: 15px;
    font-weight: 500;
    line-height: 42px;
    padding: 0 24px;
    text-decoration: none;
    text-overflow: ellipsis;
}
.guest-header-menu__menu-item__icon {
    height: 24px;
    margin-right: 20px;
    width: 24px;
}
.guest-header-menu__menu-item--split {
    margin-top: 16px;
    padding-top: 16px;
}
.guest-header-menu__menu-item--split::before {
    background: rgba(255, 255, 255, 0.1);
    content: "";
    height: 1px;
    left: 18px;
    position: absolute;
    right: 18px;
    top: 0;
}
.guest-header-menu--theme--purple .guest-header-menu__dropdown-content {
    background: #290e3f;
}
.guest-header-menu--theme--purple .guest-header-menu__menu-item > a:hover {
    background: #3f2753;
    color: #fff;
}
.guest-header-menu--theme--purple .guest-header-menu__menu-button--active {
    background: #3f2753;
}
.guest-header-menu--theme--dark .guest-header-menu__dropdown-content {
    background: #111113;
}
.guest-header-menu--theme--dark .guest-header-menu__menu-item > a:hover {
    background: #343437;
    color: #fff;
}
.guest-header-menu--theme--dark .guest-header-menu__menu-button--active {
    background: #343437;
}
.guest-header-menu__banner {
    cursor: pointer;
    padding: 0 20px;
}
.be {
    left: -2px;
    margin: 6px 0 0;
    position: absolute;
    right: -2px;
    top: 100%;
}
.be--landing {
    z-index: 11;
}
.be--compact {
    left: 0;
    margin: 2px 0 0;
    right: 0;
}
.be__empty {
    color: #707071;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    margin: 20px 0;
    text-align: center;
}
.be__sub-title {
    color: #707071;
    font-size: 11px;
    margin: 20px 16px 10px;
    text-transform: uppercase;
}
.be__title-link {
    text-transform: none;
}
.be__button {
    margin: 0 10px 10px;
    width: calc(100% - 20px);
}
.be__verify {
    align-items: center;
    background: #232325;
    border-radius: 10px;
    display: flex;
    gap: 12px;
    margin: 20px 16px;
    padding: 8px 12px;
}
.bL {
    display: grid;
    grid-gap: 10px;
}
.bL--squad {
    grid-gap: 2px;
}
.bL__item--squad {
    position: relative;
}
.bL__item--squad > .a {
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.bL__item--squad::before {
    content: "";
    display: block;
    padding-top: 100%;
}
.bI {
    --grid-item-size: 100px;
    margin-bottom: 20px;
    width: 100%;
}
.bI:hover .bI__content {
    background-color: #343437;
}
.bI--stub {
    background-color: #232325;
    border-radius: 16px;
    min-height: 140px;
}
@media screen and (max-width: 639px) {
    .bI--stub {
        min-height: 160px;
    }
}
.bI__content {
    align-items: center;
    background-color: #1b1b1d;
    border-radius: 16px;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    min-height: 140px;
    overflow: hidden;
    padding: 20px 20px 20px 40px;
}
@media screen and (max-width: 1023px) {
    .bI__content {
        padding: 20px;
    }
}
@media screen and (max-width: 639px) {
    .bI__content {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
        padding: 12px 0 12px 16px;
    }
}
.bI__hashtag {
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
@media screen and (max-width: 639px) {
    .bI__hashtag {
        font-size: 18px;
    }
}
.bI__hashtag-info {
    align-items: center;
    display: flex;
    gap: 8px;
}
.bI__posts-counter {
    color: #a0a0a1;
    font-size: 16px;
    font-weight: 400;
}
.bI__left-part {
    flex: 0 1 390px;
    max-width: 30%;
}
@media screen and (max-width: 639px) {
    .bI__left-part {
        flex: 1;
        max-width: 100%;
    }
}
.bI__right-part {
    display: grid;
    flex: 1;
    grid-auto-flow: column;
    grid-auto-rows: 0;
    grid-gap: 20px;
    grid-template-rows: var(--grid-item-size);
    justify-content: end;
    overflow-y: hidden;
}
@media screen and (max-width: 1023px) {
    .bI__right-part {
        --grid-item-size: 80px;
    }
}
@media screen and (max-width: 639px) {
    .bI__right-part {
        grid-auto-flow: unset;
        grid-gap: 10px;
        grid-template-columns: repeat(5, var(--grid-item-size));
        justify-content: start;
        overflow: hidden;
        width: 100%;
    }
}
.bI__media-container {
    display: grid;
    width: var(--grid-item-size);
}
@media screen and (min-width: 480px) {
    .bI__media-container--with-cover {
        width: calc(var(--grid-item-size) + 34px);
    }
}
.bI__cover {
    align-items: center;
    background: linear-gradient(0deg, rgba(35, 35, 37, 0.8), rgba(35, 35, 37, 0.8));
    bottom: 0;
    color: #fff;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    justify-content: center;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.bI__top-right-block-icon {
    height: 24px;
    pointer-events: none;
    position: absolute;
    right: 8px;
    top: 8px;
    width: 24px;
}
.a {
    align-items: flex-end;
    background: #424248;
    border-radius: 16px;
    display: flex;
    height: 314px;
    max-height: 100%;
    min-height: 100%;
    overflow: hidden;
    padding: 12px;
    position: relative;
    transform: translateZ(0);
    -webkit-user-select: none;
    user-select: none;
}
.a--squad {
    border-radius: 2px;
}
.a--hover:hover > .a__cover--image {
    transform: scale(1.2);
}
.a--live-stream:hover {
    transform: scale(1.1);
    z-index: 99;
    box-shadow: 0 0 25px 2px #000;
}
.a--live-stream:hover > .a__controls {
    display: none;
}
.a--hover:hover .avatar {
    border-color: rgba(255, 255, 255, 0.6);
}
.a--hover:hover .avatar:hover {
    border-color: #fff;
}
.a--hover:hover .a__description {
    opacity: 1;
    transform: translateY(0);
}
.a--clickable {
    cursor: pointer;
}
.a--bordered::before {
    border: 3px solid #f59e0b;
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.a__controls {
    align-items: center;
    bottom: 6px;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    gap: 12px;
    left: 8px;
    position: absolute;
    z-index: 2;
}
.a__comments:hover,
.a__controls > .likes-counter:hover {
    color: #fff;
}
.a__comments {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.8);
    cursor: pointer;
    display: flex;
    font-weight: 700;
    gap: 5px;
    padding: 2px;
}
.a__cover {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.a__cover--image {
    object-fit: cover;
    object-position: center;
    transition: transform 0.3s;
}
.a__followers {
    align-items: center;
    color: rgba(255, 255, 255, 0.7);
    display: flex;
    font-size: 12px;
    margin: 2px 0 0;
}
.a__top-right-block {
    pointer-events: none;
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 1;
}
.a__top-right-block-icon {
    color: rgba(255, 255, 255, 0.8);
    height: 24px;
    width: 24px;
}
@media screen and (max-width: 639px) {
    .a__top-right-block-icon {
        height: 16px;
        width: 16px;
    }
}
.a__bottom-shadow {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.3) 100%);
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    bottom: 0;
    height: 56px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 1;
}
.a__download {
    background: #232325;
    border-radius: 4px;
    cursor: pointer;
    left: 10px;
    position: absolute;
    top: 10px;
    transform: rotate(90deg);
}
.a--top-shadow::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.4) 0, transparent 100%);
    content: "";
    height: 60px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.a__top-avatar {
    left: 8px;
    position: absolute;
    right: 40px;
    top: 8px;
    z-index: 1;
}
.a__description {
    align-items: flex-end;
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);
    bottom: 0;
    display: flex;
    filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.4));
    height: 200px;
    left: 0;
    opacity: 0;
    padding: 0 8px 40px;
    pointer-events: none;
    position: absolute;
    right: 0;
    transform: translateY(30px);
    transition: transform 150ms ease, opacity 100ms ease;
    z-index: 1;
}
.a__description-text {
    -webkit-box-orient: vertical;
    color: rgba(255, 255, 255, 0.8);
    display: -webkit-box;
    font-size: 14px;
    font-weight: 400;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-all;
}
.a__description-link {
    color: rgba(255, 255, 255, 0.8);
}
.textarea-autosize-wrapper {
    position: relative;
    width: 100%;
}
.textarea-autosize-wrapper .textarea-autosize {
    display: block;
    overflow: hidden;
    resize: none;
    width: 100%;
}
.textarea-autosize-wrapper .textarea-autosize[disabled] {
    cursor: not-allowed;
    opacity: 0.4;
}
.textarea-autosize-wrapper .textarea-autosize__counter {
    bottom: 6px;
    font-size: 10px;
    opacity: 0.6;
    pointer-events: none;
    position: absolute;
    right: 6px;
}
.textarea-autosize-wrapper .textarea-autosize__error {
    color: #fd3a5b;
    display: block;
    font-size: 12px;
    margin: 4px 0 0;
}
.cA {
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    justify-content: space-between;
    min-height: 72px;
    padding: 20px;
}
.cA__left {
    align-items: center;
    display: flex;
    max-width: 100%;
    min-height: 42px;
}
.cA__inner-title {
    align-items: center;
    display: flex;
    gap: 20px;
    margin: 0 0 40px;
}
.cA__inner-title-text {
    font-size: 24px;
    font-weight: 600;
}
.cA__back {
    align-items: center;
    background: #343437;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    margin: 0 22px 0 0;
    padding: 0 2px 0 0;
    width: 24px;
}
.cA__inner-title-left-icon {
    height: 64px;
    width: 64px;
}
.cA__icon {
    padding: 0 22px 0 0;
}
@media (max-width: 479px) {
    .cA__inner-title {
        align-items: center;
        flex-direction: column;
    }
    .cA__inner-title-text {
        text-align: center;
    }
}
.cFF {
    background: #5f5f67;
    border-radius: 6px;
    height: 6px;
    overflow: hidden;
    position: relative;
}
.cFF__spinner {
    background: #67ed27;
    border-radius: 6px;
    box-shadow: 0 0 10px 2px #67ed27;
    height: 100%;
    position: relative;
    width: 10px;
}
.cc__checkbox-group {
    align-items: center;
    display: flex;
    gap: 24px;
}
.cc__checkbox-item {
    align-items: center;
    cursor: pointer;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 12px;
    text-align: left;
}
.region-select__radio-buttons {
    align-items: flex-start;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.region-select .radio-check-block {
    background: 0 0;
}
.region-select .radio-check-block__header {
    padding: 0;
}
.region-select .radio-check-block__title {
    font-size: 14px;
}
.ce__wrapper {
    background: #232325;
    border-radius: 12px;
    padding: 20px;
}
.ce__title {
    color: #707071;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 10px;
    text-transform: uppercase;
}
.ce__header {
    align-items: center;
    display: flex;
    flex: 1;
}
.ce__actions {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-start;
}
.ce__device {
    align-items: center;
    column-gap: 12px;
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-left: 12px;
}
.ce__browser,
.ce__country {
    color: #a0a0a1;
    font-size: 12px;
    font-weight: 400;
    line-height: 150%;
}
.ce__country {
    color: #707071;
}
.ce__verified {
    align-items: center;
    color: #21b062;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    gap: 6px;
    padding: 0 0 12px;
}
.ce__button-content {
    align-items: center;
    display: flex;
    gap: 12px;
}
.ca {
    display: flex;
    min-height: 460px;
}
.ca__controls {
    flex: 1;
}
.ca__preview {
    display: flex;
    flex-direction: column;
    margin-left: 20px;
    max-width: 100%;
    width: 418px;
}
@media screen and (max-width: 1023px) {
    .ca {
        display: block;
    }
    .ca__controls {
        margin-bottom: 20px;
    }
    .ca__preview {
        margin-left: 0;
    }
}
.tile-list-item {
    align-items: center;
    background: #343437;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    padding: 22px;
    position: relative;
    transition: background 250ms;
    width: 100%;
}
.tile-list-item__icon {
    opacity: 0;
    position: absolute;
    right: 20px;
    transition: opacity 250ms;
}
.tile-list-item:hover {
    background: #5f5f67;
}
.tile-list-item:hover .tile-list-item__icon {
    opacity: 1;
}
.model-uploader {
    display: flex;
    margin-top: 20px;
}
@media (max-width: 767px) {
    .model-uploader {
        flex-direction: column;
    }
}
.model-uploader .loading-image-wrapper {
    align-items: center;
    display: flex;
    justify-content: center;
    overflow: hidden;
}
.model-uploader .loading-image-wrapper > .bd {
    height: 172px;
    width: 172px;
}
.model-uploader .loading-image {
    background-color: #424242;
    border-radius: 8px;
    height: 160px;
    object-fit: cover;
    width: 190px;
}
.model-uploader .loading-image.loading {
    filter: blur(10px);
    transform: scale(1.1);
}
.model-uploader .inputs {
    flex: 1;
    margin-left: 24px;
}
@media (max-width: 767px) {
    .model-uploader .inputs {
        margin-left: 0;
        margin-top: 20px;
    }
}
.model-uploader .field-wrapper {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 12px;
}
.model-uploader .field-wrapper .input-wrapper {
    width: 80%;
}
@media (max-width: 767px) {
    .model-uploader .field-wrapper .input-wrapper {
        width: 100%;
    }
}
.model-uploader .field-wrapper > label {
    align-items: center;
    display: inline-flex;
    flex-flow: row;
    margin: 0;
}
.model-uploader .field-wrapper:last-child {
    margin-bottom: 0;
}
@media (max-width: 767px) {
    .model-uploader .field-wrapper {
        align-items: flex-start;
        flex-direction: column;
    }
}
.model-uploader .input {
    width: 80%;
}
.model-uploader .input.price-input {
    width: 100%;
}
@media (max-width: 767px) {
    .model-uploader .input {
        width: 100%;
    }
}
.model-uploader .video-icon-wrapper {
    align-items: center;
    background-color: #343437;
    border-radius: 8px;
    display: flex;
    height: 160px;
    justify-content: center;
    width: 190px;
}
.model-uploader .video-icon {
    height: 70px;
    margin: 0;
    width: 70px;
}
.model-uploader .uploading-video {
    margin-bottom: 20px;
}
.model-uploader .video-name {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 10px;
}
.model-uploader .videos-list-item {
    cursor: default;
}
.model-uploader .videos-list-item .video-under-thumb {
    height: auto;
}
.model-uploader .videos-list-item .video-stats {
    display: none;
}
.model-uploader .albums-gallery-root {
    height: 150px;
    width: 150px;
}
.model-uploader .albums-gallery-root .albums-list-item {
    flex-basis: 100%;
    max-width: 100%;
    width: 100%;
}
.model-uploader .content-price-help {
    margin: 0 0 0 4px;
}
.upload-media-info-item {
    align-items: center;
    display: flex;
    grid-column-end: 6;
    grid-column-start: 2;
    position: relative;
}
.upload-media-info-item__content-line {
    position: absolute;
}
.upload-media-info-item__line {
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    line-height: 18px;
}
.GG {
    align-items: center;
    display: grid;
    gap: 10px;
    grid-auto-flow: column;
    height: 100%;
    padding: 10px 20px;
}
.GG__footer-description {
    display: block;
    grid-column: 1/4;
}
.user-uploader {
    margin-top: 20px;
}
.user-uploader .content {
    position: relative;
}
.user-uploader .loader-wrapper {
    background: rgba(0, 0, 0, 0.4);
    left: 50%;
    padding: 10px 20px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}
.user-uploader .loader-wrapper .loader {
    position: static;
    transform: none;
}
.user-uploader .loading-image-wrapper {
    align-items: center;
    background-color: #272727;
    display: flex;
    justify-content: center;
    overflow: hidden;
}
.user-uploader .loading-image {
    display: block;
    max-height: 50vh;
    max-width: 100%;
}
.user-uploader .loading-image.loading {
    filter: blur(20px);
}
.cC {
    max-width: 100%;
    width: 500px;
}
.cC__header {
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    gap: 20px;
    justify-content: start;
    min-height: 72px;
    padding: 20px;
}
.cC__content {
    padding: 20px;
}
.cC__input-wrapper {
    position: relative;
}
.cC__smiles-wrapper {
    bottom: 6px;
    position: absolute;
    right: 4px;
}
.cC__add-media-button {
    align-items: center;
    background: #343437;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 12px;
    grid-column: 1/6;
    height: 60px;
    justify-content: center;
    width: 100%;
}
.cC__add-media-button:active {
    transform: translateY(1px);
}
.search-input {
    position: relative;
}
.search-input__input.input {
    padding-left: 30px;
}
.search-input__with-right-block .search-input__input.input {
    padding-right: 30px;
}
.search-input__icon,
.search-input__right-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 1;
}
.search-input__icon {
    color: #a0a0a1;
    left: 12px;
}
.search-input__right-content {
    right: 12px;
}
.YY {
    border-radius: 12px;
    margin: 10px 0;
    padding: 12px 16px;
    position: relative;
}
.YY--selectable {
    cursor: pointer;
    padding-left: 51px;
}
.YY::before {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: background 0.3s, border 0.3s;
}
.YY--state--not-selected:hover::before {
    background: #232325;
    border-color: #49494a;
}
.YY--state--not-selected:hover .checkbox-ds__box {
    border-color: #a0a0a1;
}
.YY--state--selected {
    cursor: default;
}
.YY--state--selected::before {
    background: rgba(215, 13, 17, 0.1);
    border: 2px solid #d97706;
}
.YY__title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    margin: 0 0 6px;
    position: relative;
}
.YY__description {
    color: #f8f8f8;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    opacity: 0.4;
}
.YY__discount {
    align-items: center;
    background: #ef7d00;
    border-radius: 6px;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 24px;
    padding: 0 8px;
    position: absolute;
    right: 14px;
    top: 10px;
}
.YY__discount--free {
    background: #21b062;
    text-transform: uppercase;
}
.YY__checkbox {
    left: 16px;
    position: absolute;
    top: 12px;
}
.bp {
    align-items: center;
    display: flex;
    flex: 1;
    gap: 20px;
    width: 100%;
}
.bp--style--default {
    background: #343437;
    border-radius: 10px;
    padding: 10px 12px;
}
.bp--style--default:hover {
    background: #424248;
}
.bp--style-light,
.settings-price-option-add__delete-button .a11y-button:hover {
    background-color: transparent;
}
.bp--size--small {
    padding: 6px 8px;
    white-space: normal;
}
.bp__stats {
    flex: 1;
}
.bp__progress {
    margin-top: 8px;
}
.bp__title2 {
    align-items: flex-end;
    display: flex;
    flex: 1;
    gap: 6px;
    justify-content: space-between;
}
.bp__title--size--small {
    align-items: center;
    font-size: 12px;
}
.bp__title--size--medium {
    font-size: 14px;
    font-weight: 500;
}
.bp__title--size--large {
    font-size: 16px;
    font-weight: 700;
}
.bp__percent {
    font-size: 24px;
    font-weight: 700;
}
.bp__percent--size--large {
    font-size: 40px;
}
.bp__percent--size--small {
    font-size: 12px;
}
.bp__percent--color--green {
    color: #21b062;
}
.bp__percent--color--yellow {
    color: #fccf49;
}
.bp__percent--color--red {
    color: #ef7d00;
}
.creators-onboarding-items-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 100%;
}
.creators-onboarding-items-list--flat-list {
    gap: 10px;
}
.creators-onboarding-items-list__items-group {
    display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: flex-start;
    margin-bottom: 12px;
}
.creators-onboarding-items-list__items-group-header {
    color: #707071;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
}
@media screen and (max-width: 767px) {
    .creators-onboarding-items-list__items-group {
        gap: 10px;
    }
}
.highlighted-element {
    animation: animation-element-highlighted;
    animation-duration: 3s;
    animation-timing-function: linear;
}
.creator-lists-editor-modal-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    margin: 0 auto;
    max-width: 100%;
    min-height: 500px;
    overflow-y: auto;
    width: 500px;
}
.creator-lists-editor-modal-content__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.creator-lists-editor-modal-content__icon {
    padding: 0 22px 0 0;
}
.creator-lists-editor-modal-content__content {
    display: flex;
    flex: 1;
    flex-direction: column;
}
.creator-lists-editor-modal-content__form {
    height: 100%;
    padding: 20px;
}
.creator-lists-editor-modal-content__footer {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    width: 100%;
}
.creator-lists-editor-modal-content__delete-button {
    margin-right: auto;
}
.creator-lists-editor-modal-content__submit-button {
    width: 140px;
}
.creator-lists-editor-modal-content__description-input,
.creator-lists-editor-modal-content__name-input {
    position: relative;
}
.creator-lists-editor-modal-content__name-input .chat-controls-input--style--single-line {
    padding: 8px 0 0;
}
.creator-lists-editor-modal-content__name-input .creator-lists-editor-modal-content__input-actions {
    border-radius: 0;
    padding: 0;
    top: 1px;
    width: 80px;
}
.creator-lists-editor-modal-content__description-input .creator-lists-editor-modal-content__input-actions {
    bottom: 8px;
}
.creator-lists-editor-modal-content__description-input .chat-controls-input--form {
    height: 44px;
}
.creator-lists-editor-modal-content__input-actions {
    align-items: center;
    background: #111113;
    bottom: 1px;
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 6px;
    justify-content: end;
    position: absolute;
    right: 8px;
}
.creator-lists-editor-modal-content__smiles-wrapper {
    position: relative;
}
.creator-lists-editor-modal-content__counter {
    color: #a0a0a1;
    font-size: 13px;
    font-weight: 500;
    pointer-events: none;
}
.creator-lists-editor-modal-content__counter--error {
    color: #fd3a5b;
}
.creator-lists-editor-modal-content__list-users {
    color: #707071;
    font-size: 14px;
    font-weight: 500;
    max-width: 194px;
    overflow: hidden;
    text-align: end;
    text-overflow: ellipsis;
    white-space: nowrap;
}
@media screen and (max-width: 424px) {
    .creator-lists-editor-modal-content__list-users {
        max-width: 160px;
    }
}
.cQ {
    position: absolute;
    transform: translateY(-50%) translateX(-50%);
}
.cQ--disabled {
    opacity: 0.8;
    pointer-events: none;
}
.cQ__dots {
    background: rgba(5, 5, 6, 0.4);
    border-radius: 4px;
    color: #707071;
    display: flex;
    height: 16px;
    justify-content: center;
    left: 50%;
    margin: 12px 0 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    transform: translateX(-50%) translateY(-50%);
    transition: opacity 0.3s;
    width: 22px;
}
.cQ__dots--visible {
    cursor: grab;
    opacity: 1;
    pointer-events: auto;
}
.W {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1)), radial-gradient(50% 408.16%at 50% 50%, #21b062 0, #9cb93d 100%);
    border-radius: 12px;
    color: #fff;
    min-height: 220px;
    padding: 20px 16px;
}
.W__title {
    color: rgba(255, 255, 255, 0.6);
    font-size: 12px;
    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);
    text-transform: uppercase;
}
.W__goal-title {
    font-size: 16px;
    font-weight: 600;
    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);
    word-break: break-word;
}
.W__title-result {
    font-size: 24px;
    font-weight: 700;
    margin: 16px 0 12px;
}
.W__price {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    height: 24px;
}
.W__amount {
    display: flex;
    font-size: 14px;
    gap: 4px;
    margin: 12px 0 0;
}
.W__amount-count {
    color: #fff;
    font-weight: 700;
}
.W__progress-title {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin: 16px 0 4px;
}
.W__contributors {
    align-items: center;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    font-size: 13px;
    gap: 8px;
    margin: 8px 0 16px;
    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);
}
.W__form {
    display: flex;
    gap: 12px;
}
.W__input {
    flex: 1;
}
.W__input input.input {
    background: rgba(255, 255, 255, 0.2);
    border: 2px solid transparent;
    color: #fff;
}
.W__input input.input:focus {
    background: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.4);
}
.W__input input.input.error {
    background: #f6d1db;
    border-color: #ef7d00;
    color: #ef7d00;
}
.W__input input.input.error::placeholder {
    color: rgba(210, 27, 76, 0.4);
}
.W__footer {
    color: rgba(255, 255, 255, 0.4);
    font-size: 12px;
    font-weight: 500;
    margin: 16px 0 0;
    text-align: center;
}
.W__success {
    padding: 24px 0 0;
    text-align: center;
}
.settings-price-option-add {
    display: flex;
    margin-bottom: 20px;
    padding: 16px 0;
}
.settings-price-option-add__prime-part {
    display: grid;
    gap: 16px;
    grid-template-columns: repeat(5, 1fr);
}
@media screen and (max-width: 639px) {
    .settings-price-option-add__prime-part {
        display: flex;
        flex-direction: column;
    }
}
.settings-price-option-add__prime-part .chat-controls-input::before {
    max-width: calc(100% - 16px);
    overflow: hidden;
    text-overflow: ellipsis;
}
.settings-price-option-add__left-part {
    display: grid;
    flex: 1;
    grid-gap: 16px;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr;
    padding: 0 16px;
}
.settings-price-option-add__right-part {
    align-items: center;
    border-left: 1px solid rgba(255, 255, 255, 0.05);
    color: #707071;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 0 16px;
}
.settings-price-option-add__right-part--center {
    justify-content: center;
}
.settings-price-option-add__label {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    margin-bottom: 8px;
}
.settings-price-option-add__field-group {
    display: flex;
    gap: 16px;
}
.settings-price-option-add__field {
    display: block;
    flex: 1;
    text-align: left;
}
.settings-price-option-add__field .input {
    color: #fff;
    font-size: 13px;
}
.settings-price-option-add__field--title .chat-controls-input__wrapper--style--single-line {
    height: 40px;
}
.settings-price-option-add__field--title .chat-controls-input__wrapper-scroll {
    max-width: calc(100% - 80px);
}
.settings-price-option-add__field--description {
    grid-column-end: 3;
    grid-column-start: 1;
}
.settings-price-option-add__field--description .chat-controls-input {
    height: 44px;
}
.settings-price-option-add__title {
    position: relative;
}
.settings-price-option-add__title .input {
    padding-right: 58px;
}
.settings-price-option-add__dollar-icon {
    color: #707071;
    font-size: 14px;
}
.settings-price-option-add__length-counter {
    color: #a0a0a1;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
}
.settings-price-option-add__length-counter--error {
    color: #fd3a5b;
}
.settings-price-option-add__show-description-button {
    background: 0 0;
    border: 0;
    color: #707071;
    cursor: pointer;
}
.settings-price-option-add__show-description-button:hover {
    color: #fff;
}
.settings-price-option-add__active-checkbox,
.settings-price-option-add__show-description-button {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: flex-start;
}
.settings-price-option-add__active-checkbox .switcher.small,
.settings-price-option-add__input-controls .smiles-dropdown {
    margin: 0;
}
.settings-price-option-add__drag-button {
    color: #707071;
    cursor: grab;
    user-select: none;
}
@media screen and (max-width: 639px) {
    .settings-price-option-add {
        flex-direction: column;
    }
    .settings-price-option-add__left-part {
        grid-template-columns: 1fr;
    }
    .settings-price-option-add__right-part {
        border-left: none;
        border-top: 2px solid rgba(255, 255, 255, 0.05);
        flex-direction: row;
        justify-content: space-between;
        margin-top: 16px;
        padding: 16px 16px 0;
    }
    .settings-price-option-add__delete-button {
        margin-left: auto;
    }
    .settings-price-option-add__field--description {
        grid-column-end: 2;
    }
}
.settings-price-option-add__input-controls {
    align-items: center;
    background: rgba(17, 17, 19, 0.8);
    display: flex;
    gap: 8px;
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
}
.settings-price-option-add__input-controls--bottom {
    bottom: 6px;
    top: auto;
    transform: none;
}
.settings-price-option-add__reset-icon {
    color: #49494a;
    cursor: pointer;
    margin: 0 0 0-6px;
    padding: 4px;
}
.settings-price-option-add__reset-icon:hover {
    color: #a0a0a1;
}
.U {
    cursor: pointer;
    min-width: 160px;
    position: relative;
    width: 100%;
}
.U__label {
    align-items: center;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    gap: 8px;
    height: 40px;
    justify-content: flex-start;
    width: 100%;
    -webkit-user-select: none;
    user-select: none;
}
.U__label:hover .date-picker__input:not(.date-picker__input--focus) {
    border-color: #49494a;
}
.U__input {
    background: #111113;
    border: 2px solid #111113;
    border-radius: 12px;
    color: #cfcfd0;
    font-size: 12px;
    height: 40px;
    padding: 8px 28px 8px 36px;
    pointer-events: none;
    text-overflow: ellipsis;
    width: 100%;
}
.U__input--focus,
.U__input:focus {
    border-color: #d97706;
}
.U__input--error {
    border-color: #fd3a5b;
    border-width: 1px;
    color: #fd3a5b;
}
.U__input::placeholder {
    color: rgba(223, 223, 223, 0.6);
}
.U__icon {
    position: absolute;
}
.U__icon--calendar {
    left: 14px;
}
.U__icon--arrow {
    right: 16px;
}
.U__native-datepicker {
    border: 0;
    border-radius: 12px;
    bottom: 0;
    left: 0;
    min-width: 100%;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.U__calendar-wrapper {
    display: none;
    position: fixed;
    z-index: 500;
}
.U__calendar-wrapper--isVisible,
.searchable-head .icon-container:hover:after {
    display: block;
}
.bb {
    padding: 20px 20px 0;
    position: relative;
    word-break: break-all;
}
.bb--compact {
    display: flex;
}
.bb__avatar {
    display: block;
    height: 80px;
    margin: 20px 10px 16px 0;
    width: 80px;
}
.bb__avatar--size--small {
    height: 64px;
    width: 64px;
}
.bb__avatar--size--medium {
    height: 80px;
    width: 80px;
}
.bb__avatar > .avatar {
    height: inherit;
    width: inherit;
}
.bb__username {
    display: flex;
    position: relative;
}
.bb__cover {
    background-repeat: no-repeat;
    background-size: cover;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.bb__cover--size--small {
    height: 84px;
}
.bb__cover--size--medium {
    height: 100px;
}
.bb__cover--size--large {
    height: 120px;
}
.bb__cover::before {
    background: linear-gradient(80.15deg, #000 0, rgba(0, 0, 0, 0.15) 100%);
    content: "";
    display: block;
    height: inherit;
}
.bb__cover--no-photo::before {
    background: radial-gradient(138.66% 168.3%at 72.8% 11.43%, #2c2057 0, #050506 77.21%), #050506;
}
.ba {
    background: #343437;
    border-radius: 12px;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);
    margin: 10px 0 0;
    overflow: hidden;
}
.ba--style--dark {
    background: #1b1b1d;
}
.ba__menu-item {
    align-items: center;
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    padding: 10px 18px;
    position: relative;
    transition: background 0.3s;
    white-space: nowrap;
    width: 100%;
}
.ba__menu-item--split {
    margin-bottom: 2px;
}
.ba__menu-item--split::before {
    background: rgba(255, 255, 255, 0.05);
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 100%;
}
.ba__menu-item:hover {
    background: #232325;
}
.ba__menu-item:hover::before {
    display: none;
}
.ba__menu-item--selected {
    background: #343437;
    background: #232325;
}
.ba__menu-item-icon {
    height: 16px;
    margin: 0 12px 0 0;
    width: 16px;
}
.cO__overlay {
    animation: opacity-fade-show 0.5s;
    background: rgba(5, 5, 6, 0.4);
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}
.cO__header {
    animation: opacity-fade-bottom-show 0.3s;
    display: flex;
    justify-content: space-between;
    left: 0;
    padding: 12px 8px 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.cO__header-button {
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-size: 14px;
    padding: 4px 8px;
}
.cO__actions-list-wrapper {
    animation: opacity-fade-show-modal-strict 0.5s;
    background: rgba(5, 5, 6, 0.6);
    border-radius: 12px;
    color: #fff;
    left: 12px;
    margin: 36px 0 0;
    padding: 16px 12px;
    position: absolute;
    right: 12px;
    top: 40%;
    z-index: 1;
}
.cO__actions-list-title {
    align-items: center;
    display: flex;
    font-size: 12px;
    gap: 6px;
    justify-content: center;
    margin: 0 0 12px;
    min-height: 17px;
    opacity: 0.4;
    transition: opacity 0.3s;
}
.cO__actions-list-title--highlighted {
    opacity: 1;
}
.cO__actions-list-title-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cO__actions-list {
    display: flex;
    gap: 12px;
    justify-content: center;
}
.cO__action-item {
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border: 0;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    gap: 6px;
    height: 24px;
    padding: 0 12px;
}
.cO__action-item:hover {
    background: rgba(255, 255, 255, 0.2);
}
.cR {
    align-items: center;
    aspect-ratio: 0.5625;
    background: #343437;
    border-radius: 16px;
    display: flex;
    height: 100%;
    justify-content: center;
    margin: 0 auto;
    max-height: 100%;
    max-width: 100%;
    overflow: hidden;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
}
.cR__blur {
    background: no-repeat center;
    background-size: cover;
    bottom: 0;
    filter: blur(13px);
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.cR--hidden {
    visibility: hidden;
}
.cR__content {
    flex: 1;
    max-height: 100%;
    max-width: 100%;
    object-fit: contain;
    pointer-events: none;
    position: relative;
    width: 1000px;
}
.cR__no-text {
    color: #cfcfd0;
    font-size: 14px;
    padding: 0 6px;
    text-align: center;
}
.cR__controls {
    bottom: 12px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    right: 12px;
    transition: opacity 0.3s;
}
.cR__controls--visible {
    opacity: 1;
    pointer-events: auto;
}
.cR__button-wrapper {
    cursor: pointer;
    display: flex;
    justify-content: flex-end;
}
.cR__button-wrapper:hover > .cR__button {
    background: rgba(5, 5, 6, 0.6);
    transform: scale(0.8);
}
.cR__button {
    align-items: center;
    backdrop-filter: blur(4px);
    background: rgba(5, 5, 6, 0.4);
    border-radius: 24px;
    color: #fff;
    column-gap: 6px;
    display: inline-flex;
    font-size: 16px;
    height: 48px;
    padding: 0 12px;
    transition: 0.3s background, 0.3s transform;
}
.creator-list-notifications__description {
    display: grid;
    grid-auto-flow: row;
}
.creator-list-notifications__list-item {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cT {
    display: flex;
    flex-direction: column;
    gap: 20px;
}
.cT__header {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}
.cT__title {
    font-size: 14px;
    font-weight: 600;
    text-align: center;
}
.cT__error-message {
    color: #fd3a5b;
    display: block;
    font-size: 12px;
    margin-top: 4px;
}
.cS {
    align-items: center;
    background: #343437 no-repeat center;
    background-size: contain;
    border-radius: 8px;
    color: #707071;
    cursor: pointer;
    display: flex;
    height: 60px;
    justify-content: center;
    min-width: 36px;
    position: relative;
    width: 36px;
}
.cS::before {
    border: 2px solid transparent;
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.cS:hover {
    color: #cfcfd0;
}
.cS--active::before {
    border-color: #fff;
}
.cS--over::after {
    background: #ef7d00;
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.6;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.cS__close {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 20px;
    justify-content: center;
    left: -10px;
    position: absolute;
    top: -10px;
    transition: 0.3s color, 0.3s background;
    width: 20px;
    z-index: 4;
}
.cS__close:hover {
    background: #af262f;
    color: #fff;
}
.cU {
    bottom: 0;
    left: 0;
    overflow: hidden auto;
    padding: 0 20px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.cU__item {
    align-items: center;
    display: flex;
    gap: 20px;
    height: 88px;
    justify-content: space-between;
    overflow: hidden;
    padding: 8px 0;
}
.cU__left {
    align-items: center;
    display: flex;
    font-size: 14px;
    gap: 12px;
    height: 100%;
    overflow: hidden;
}
.cU__left-name {
    overflow: hidden;
}
.chat-controls-input::before,
.cU__filename {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.cU__icon {
    align-items: center;
    background: #343437;
    border-radius: 10px;
    display: flex;
    flex: 1;
    height: 100%;
    justify-content: center;
    min-width: 36px;
    width: 36px;
}
.cU__right {
    align-items: center;
    display: flex;
    font-size: 14px;
    gap: 14px;
}
.cU__close {
    align-items: center;
    background: #000;
    border: 0;
    border-radius: 50%;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    display: flex;
    height: 20px;
    justify-content: center;
    padding: 0;
    width: 20px;
}
.cU__close:hover {
    background: #ef7d00;
    color: #fff;
}
.DDD {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: flex-start;
}
.DDD--empty {
    justify-content: center;
}
.DDD__title {
    align-items: center;
    color: #a0a0a1;
    display: flex;
    font-size: 14px;
    line-height: 140%;
    margin: 20px 0;
}
.DDD__title-icon {
    align-items: center;
    background: #232325;
    border-radius: 16px;
    display: flex;
    height: 52px;
    justify-content: center;
    margin: 0 14px 0 0;
    min-width: 52px;
    width: 52px;
}
.DDD__list {
    max-height: 328px;
    padding: 0 20px 10px;
}
.DDD__empty-stub {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 18px;
    height: 100%;
    justify-content: center;
}
.DDD__empty-stub-icon {
    color: #707071;
}
.DDD__empty-stub-description {
    color: #a0a0a1;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
}
.cH,
.cH__content {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column;
}
.cH__content {
    justify-content: center;
    padding: 20px;
    width: 100%;
}
.cH__svg-icon {
    margin-bottom: 16px;
}
.cH__extra-name {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 20px;
}
.cH__description {
    color: #a0a0a1;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 20px;
    max-width: 240px;
    text-align: center;
}
.cH__add-details {
    align-items: center;
    color: #f59e0b;
    column-gap: 12px;
    cursor: pointer;
    display: flex;
    font-size: 14px;
}
.cH__text-form {
    display: flex;
    position: relative;
    width: 100%;
}
.cH__text-form-controls {
    align-items: center;
    bottom: 10px;
    column-gap: 4px;
    display: flex;
    position: absolute;
    right: 5px;
}
.cH__text-form-close {
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 20px;
    justify-content: center;
    position: absolute;
    right: 14px;
    top: 10px;
    width: 20px;
}
.cH__text-form-close:hover {
    color: #fff;
}
.cH .chat-controls-input--form {
    height: 48px;
}
.cH__vat {
    color: #707071;
    font-size: 12px;
    margin-bottom: 20px;
}
.chat-controls-input {
    color: #fff;
    line-height: 16px;
    min-width: 100%;
    outline: 0;
}


.chat-controls-input--form {
    height: 70px;
    margin: 0 0 30px;
}
.chat-controls-input--style--multy-line {
    min-height: 28px;
    overflow: auto;
    padding: 10px 0 0;
    position: relative;
    white-space: pre-wrap;
    word-break: break-word;
    text-align: left;
}
.chat-controls-input--style--single-line {
    height: 34px;
    padding: 10px 0 0;
    position: absolute;
}
.chat-controls-input:empty::before {
    content: attr(placeholder);
    max-width: 100%;
    opacity: 0.6;
    pointer-events: none;
    position: absolute;
}
.chat-controls-input--with-content::before {
    display: none;
}
.chat-controls-input__wrapper {
    cursor: text;
    flex: 1;
    font-size: 13px;
    overflow: hidden;
    position: relative;
}
.chat-controls-input__wrapper--dark {
    background: #111113;
}
.chat-controls-input__wrapper--dark:focus-within {
    border-color: #f59e0b;
}
.chat-controls-input__wrapper--form {
    border: 1px solid transparent;
    border-radius: 12px;
    color: #fff;
    padding: 0 10px;
}
.chat-controls-input__wrapper--style--single-line {
    height: 34px;
    white-space: nowrap;
}
.chat-controls-input__wrapper--disabled {
    pointer-events: none;
}
.chat-controls-input__wrapper--error {
    border-color: #fd3a5b;
}
.chat-controls-input__wrapper--error:focus-within {
    border-color: #fd3a5b;
}
.chat-controls-input__wrapper-scroll {
    bottom: -50px;
    left: 12px;
    overflow: auto;
    position: absolute;
    right: 12px;
    top: 0;
}
.chat-controls-input__hashtag,
.chat-controls-input__mention {
    color: #f59e0b;
}
.chat-controls-input__smile {
    animation: smile-appear 0.3s;
    display: inline-block;
    font-size: 0;
    margin: 0 4px;
    position: relative;
    top: -4px;
    vertical-align: text-top;
    width: 20px;
}
.chat-controls-input__smile--no-animation {
    animation: none;
}
.chat-controls-input__smile--hidden {
    margin: 0;
    opacity: 0;
    width: 1px;
}
.chat-controls-input__smile--flyed {
    animation: none;
    margin: 0;
    pointer-events: none;
    position: fixed;
    z-index: 600;
}
.cI {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: auto;
}
.cI__icon {
    margin-bottom: 28px;
}
.cI__title {
    color: #fff;
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 20px;
}
.cI__description {
    color: #a0a0a1;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px;
    margin-bottom: 40px;
    max-width: 260px;
    text-align: center;
}
.cI__can-message-badge {
    align-items: center;
    background: #232325;
    border-radius: 12px;
    color: rgba(248, 248, 248, 0.7);
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 14px;
    justify-content: start;
    min-height: 44px;
    padding: 12px 14px;
}
.F {
    border-radius: 18px;
    overflow: hidden;
    padding-top: 100%;
    position: relative;
    transform: translateZ(0);
    transition: opacity 0.3s;
}
.F--shadow::after {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.65) 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.F--locked {
    background: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%) no-repeat center;
    background-size: cover;
}
.F--locked:hover {
    background-image: linear-gradient(246.82deg, #281f4d 0, #0d071e 100%);
}
.F--clickable {
    cursor: pointer;
}
.F--disabled {
    opacity: 0.6;
    pointer-events: none;
}
.F__image {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    transform: scale(1.01);
    transition: transform 0.3s;
    width: 100%;
}
.F--with-zoom:hover > .F__image {
    transform: scale(1.1);
}
.F__content {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.tag-creator-settings {
    display: flex;
    flex-direction: column;
    height: 100%;
}
@media screen and (max-width: 639px) {
    .tag-creator-settings {
        height: calc(100vh - 113px);
    }
}
.tag-creator-settings__add-tag-button {
    cursor: pointer;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.tag-creator-settings__add-tag-button.btn {
    padding: 10px 12px;
}
.tag-creator-settings__add-tag-button.btn:active {
    transform: translate(-50%, calc(-50% + 1px));
}
.tag-creator-settings__toggle-button {
    background-color: #343437;
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: grid;
    height: 24px;
    padding: 0;
    place-items: center;
    width: 24px;
}
.tag-creator-settings__toggle-button:active {
    transform: translateY(1px);
}
.tag-creator-settings__counter {
    color: #cfcfd0;
    font-size: 16px;
    font-weight: 700;
    white-space: nowrap;
}
.tag-creator-settings__search-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 18px;
}
.tag-creator-settings__search-back-button {
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
}
.tag-creator-settings__search-input-wrapper {
    position: relative;
}
.cp__input.input,
.tag-creator-settings__search-input.input {
    padding-left: 30px;
}
.tag-creator-settings__search-icon {
    color: #a0a0a1;
    left: 10px;
    position: absolute;
    top: 12px;
    z-index: 1;
}
.tag-creator-settings__users-list {
    margin-top: 10px;
}
.tag-creator-settings__icon {
    position: absolute;
    z-index: 1;
}
.tag-creator-settings__icon:after {
    bottom: 50%;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.6);
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
}
.tag-creator-settings__icon--users {
    bottom: 10px;
    left: 10px;
}
.tag-creator-settings__icon--play {
    right: 14px;
    top: 16px;
}
.cp__header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 18px;
}
.cp__header-actions {
    align-items: center;
    display: flex;
    gap: 8px;
    justify-content: center;
}
.cp__back-button {
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
}
.cp__input-wrapper {
    position: relative;
}
.cp__icon {
    color: #a0a0a1;
    left: 10px;
    position: absolute;
    top: 12px;
    z-index: 1;
}
.cp__users-list {
    margin-top: 10px;
}
.cs {
    align-items: center;
    color: #a0a0a1;
    column-gap: 10px;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    justify-content: space-between;
    min-height: 48px;
}
.cs--clickable {
    cursor: pointer;
}
.cs--clickable:hover {
    color: #cfcfd0;
}
.cs__left {
    align-items: center;
    column-gap: 10px;
    display: flex;
    flex: 1;
}
.cs__middle {
    display: flex;
    flex: 1;
    flex-wrap: wrap;
    justify-content: space-between;
}
.cs__icon {
    align-items: center;
    display: flex;
    gap: 10px;
}
.cs__icon--new {
    color: #f59e0b;
}
.cs__dot {
    color: #707071;
    margin: 0 0 0 4px;
    position: relative;
    right: -1px;
}
.cs__description {
    color: #707071;
    font-size: 14px;
    font-weight: 400;
}
.cq {
    position: relative;
}
.cq__footer {
    align-items: center;
    bottom: 6px;
    display: flex;
    justify-content: space-between;
    left: 10px;
    position: absolute;
    right: 10px;
}
.cq__footer--disabled {
    opacity: 0.6;
    pointer-events: none;
}
.cq__left {
    align-items: center;
    column-gap: 4px;
    display: flex;
}
.cq__right {
    align-items: center;
    column-gap: 10px;
    display: flex;
}
.cq__button {
    border: 2px solid #424248;
    border-radius: 6px;
    color: #a0a0a1;
    cursor: pointer;
    font-size: 12px;
    height: 20px;
    padding: 0 8px;
}
.cq__button:hover {
    background: #424248;
    color: #cfcfd0;
}
.cq .smiles-dropdown {
    margin: 0;
}
.cq .smiles-dropdown .smiles-list {
    bottom: 25px;
}
.cq__mentions {
    background: #1b1b1d;
    bottom: 0;
    left: 0;
    padding: 20px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.cq__content {
    background: #111113;
    border-radius: 4px;
    bottom: 8px;
    left: 10px;
    position: absolute;
    right: 80px;
}
.cq__counter {
    background: #111113;
    border-radius: 4px;
    color: #a0a0a1;
    font-size: 10px !important;
    padding: 4px;
    pointer-events: none;
}
.c1 {
    aspect-ratio: 0.5625;
    position: relative;
    transition: 0.6s height;
}
.c1--style--pale {
    cursor: pointer;
    height: 41%;
}
.c1--style--pale .c1__footer,
.c1--style--pale .c1__header {
    opacity: 0;
    pointer-events: none;
}
.c1--style--pale .m {
    display: none;
}
.c1--style--active {
    height: 100%;
    margin: 0 60px;
    opacity: 1;
}
.c1--style--active .c1__user-pale {
    opacity: 0;
}
.c1--mobile {
    height: auto;
    margin: 0;
    max-width: 360px;
    width: 100%;
}
.c1__content-wrapper {
    align-items: center;
    background: #1b1b1d no-repeat center;
    background-size: cover;
    border-radius: 16px;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
}
.c1__content {
    flex: 1;
    max-height: 100%;
    max-width: 100%;
    pointer-events: none;
    position: relative;
}
.c1__content-image {
    background: no-repeat center;
    background-size: contain;
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
}
.c1__header {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0, transparent 100%);
    left: 0;
    min-height: 78px;
    padding: 12px 12px 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.c1__header .displayname--size--small-xx > .displayname__name {
    font-size: 14px;
}
.c1__sub-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.c1__user {
    align-items: center;
    display: flex;
}
.c1__header-controls {
    align-items: center;
    column-gap: 12px;
    display: flex;
}
.c1__header-button {
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    filter: drop-shadow(0 1px 10px rgba(0, 0, 0, 0.4));
    padding: 0;
    transition: 0.3s color;
}
.c1__header-button--mobile-close {
    position: absolute;
    right: 16px;
    top: 16px;
}
.c1__header-button:hover {
    color: #fff;
}
.c1__footer {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);
    bottom: 0;
    left: 0;
    padding: 0 12px 12px;
    position: absolute;
    width: 100%;
    z-index: 1;
}
.c1__footer--mobile {
    bottom: env(safe-area-inset-bottom);
    left: 50%;
    max-width: 360px;
    position: fixed;
    transform: translateX(-50%);
}
.c1__footer-icon {
    align-items: center;
    column-gap: 4px;
    display: inline-flex;
    font-size: 14px;
    font-weight: 700;
}
.c1__user-pale {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    bottom: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: 0.6s opacity;
    width: 100%;
    z-index: 1;
}
.c1__tabs {
    column-gap: 4px;
    display: flex;
    margin: 0 0 12px;
}
.c1__tab {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 2px;
    cursor: pointer;
    flex: 1;
    height: 2px;
    overflow: hidden;
    position: relative;
    transition: 0.3s background, 0.3s box-shadow;
}
.c1__tab:hover {
    background: rgba(255, 255, 255, 0.4);
}
.c1__tab-progress {
    background: rgba(255, 255, 255, 0.8);
    border-radius: 2px;
    flex: 1;
    height: inherit;
    left: 0;
    top: 0;
    width: 0;
}
.c1__moderation {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 20px;
    bottom: 12px;
    color: #cfcfd0;
    display: flex;
    font-size: 14px;
    gap: 16px;
    left: 12px;
    padding: 8px 16px;
    position: absolute;
    right: 12px;
    z-index: 1;
}
.c1 .m {
    height: auto;
    left: auto;
    top: auto;
    width: auto;
}
.c1__loader {
    align-items: center;
    color: #707071;
    display: flex;
    flex-direction: column;
    font-size: 14px;
    gap: 10px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.c1__no-available {
    color: #707071;
    font-size: 18px;
    font-weight: 700;
    padding: 0 16px;
    text-align: center;
}
.c1__user-tags {
    bottom: 60px;
    left: 20px;
    position: absolute;
}
.c1__mobile-direction {
    bottom: 0;
    position: absolute;
    top: 0;
}
.c1__mobile-direction--style--left {
    left: 0;
    width: 25%;
}
.c1__mobile-direction--style--right {
    right: 0;
    width: 75%;
}
.scheduled-post-settings {
    align-items: center;
    display: grid;
    grid-column-gap: 20px;
    grid-template-columns: 1fr;
    margin: 0-20px;
    padding: 0 20px 20px;
}
.scheduled-post-settings__error-message {
    color: #fd3a5b;
    display: block;
    font-size: 12px;
    grid-column: 1/3;
    margin: 4px 0 0;
}
.scheduled-post-settings__posts-count-notice {
    color: #a0a0a1;
    font-size: 0.75rem;
    margin-top: 6px;
}
@media screen and (max-width: 479px) {
    .scheduled-post-settings {
        padding: 0 15px 15px;
    }
}
.cz__image {
    align-items: center;
    display: flex;
    flex: 1;
    height: 234px;
    justify-content: center;
    position: relative;
}
.cz__image-photo {
    border-radius: 4px;
    max-height: 100%;
    max-width: 100%;
}
.cz__control {
    align-items: center;
    display: flex;
    gap: 10px;
    position: absolute;
}
.cy {
    -webkit-user-select: none;
    user-select: none;
}
.cy__thumbs-line {
    background: rgba(255, 255, 255, 0.05);
    height: 1px;
    margin: 0 0 19px;
}
.cy__thumb {
    background-clip: content-box;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border: 2px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    height: 64px;
    min-width: 64px;
    opacity: 0.4;
    position: relative;
    transition: opacity 0.3s;
    width: 64px;
}
.cy__thumb:hover {
    opacity: 1;
}
.cy__thumb--active {
    border-color: #d97706;
    opacity: 1;
    pointer-events: none;
}
.cy__thumb-time {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 4px;
    bottom: 4px;
    color: #cfcfd0;
    display: flex;
    font-size: 10px;
    font-weight: 500;
    height: 14px;
    line-height: 13px;
    padding: 0 3px;
    position: absolute;
    right: 4px;
}
.cy__thumb-error {
    display: flex;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translateX(-50%);
}

.bV,
.bY__wrapper-center::before {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.bV__svg {
    display: block;
}

.bY__wrapper {
    contain: strict;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
}
.bY__list {
    align-items: center;
    display: flex;
}
.bY__item {
    margin-right: 20px;
    min-width: 190px;
    width: 190px;
}
.bY__shadow {
    bottom: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 190px;
}
.bY__shadow--right {
    background: linear-gradient(to right, transparent 0, #000 100%);
    right: 0;
}
.bY__shadow--left {
    background: linear-gradient(to left, transparent 0, #000 100%);
    left: 0;
}
.bY__scroll-container {
    display: flex;
    overflow: auto;
    position: relative;
}
@media screen and (max-width: 767px) {
    .bYz__shadow {
        width: 100px;
    }
}

.messages-overlay{
    position: fixed;
    top: 0;
    left: 0;
    z-index: 105;
    background-color: #000;
    opacity: 0.85;
    width: 100%;
    height: 100%;    
}

.messages-container {
    animation: opacity-fade-show 0.3s;
    border-radius: 16px;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    height: unset;
    max-height: 100%;
    position: fixed;
    text-align: center;
    top: 100px;
    left: 50%;
    transform: translate(-50%, 0);
    z-index: 106;
    height: 75vh;
    max-width: 960px;
}

.personal-notifications-modal {
    animation: opacity-fade-show 0.3s;
    background: #232325;
    border-radius: 16px;
    bottom: 10px;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    height: unset;
    max-height: 100%;
    position: fixed;
    top: 30%;
    right: 18%;
    transform: translate(-35%, -35%);
    width: 422px;
    z-index: 106;
}
.personal-notifications-modal--cookie {
    bottom: 70px;
}
.personal-notifications-modal.is-hiding {
    animation: opacity-fade-hide 0.3s;
}
.personal-notifications-modal__verify {
    align-items: center;
    background: #1b1b1d;
    border-radius: 12px;
    display: flex;
    font-size: 14px;
    gap: 12px;
    line-height: 140%;
    margin: 0 12px 4px;
    padding: 12px 42px 12px 12px;
    position: relative;
}
.personal-notifications-modal__verify-icon {
    align-self: flex-start;
}
.personal-notifications-modal__verify-close {
    color: #707071;
    cursor: pointer;
    font-size: 0;
    padding: 6px;
    position: absolute;
    right: 4px;
    top: 4px;
}
.personal-notifications-modal__verify-close:hover {
    color: #a0a0a1;
}
.personal-notifications-modal .scroll-bar-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: none;
    max-width: none;
    overflow-x: hidden;
    width: auto;
}
.personal-notifications-modal-title {
    align-items: center;
    border-bottom: 1px solid transparent;
    color: #fff;
    display: flex;
    font-size: 20px;
    font-weight: 700;
    height: 68px;
    margin: 0;
    padding: 20px;
    transition: border-bottom-color 0.5s;
}
@media screen and (max-width: 479px) {
    .personal-notifications-modal-title {
        font-size: 20px;
        font-weight: 500;
        letter-spacing: normal;
        line-height: normal;
        height: 56px;
        padding: 12px;
    }
}
.personal-notifications-modal-title.scrolled {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.personal-notifications-modal-title button {
    border-radius: 2px;
    height: 24px;
    width: 24px;
    align-items: center;
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    margin-right: 12px;
}
.personal-notifications-modal-title button:hover {
    background: rgba(248, 248, 248, 0.1);
}
.personal-notifications-modal-title .icon {
    flex-shrink: 0;
    height: 16px;
    margin: 0;
    width: 16px;
}
.personal-notifications-modal-panel-footer .personal-notifications-modal-panel-controls-btn,
.l:hover::after {
    display: none;
}
@media (max-width: 639px) {
    .personal-notifications-modal {
        border-radius: 0;
        height: calc(100% - var(--pwa-notification-height));
        right: 0;
        top: var(--pwa-notification-height);
        width: 100%;
    }
    .personal-notifications-modal h2 {
        display: none;
    }
    .personal-notifications-modal-panel-footer .personal-notifications-modal-panel-controls-btn {
        display: block;
        margin: 0;
    }
}
@media screen and (max-width: 479px) {
    .personal-notifications-modal {
        animation: none;
        height: calc(100% - var(--tap-bar-height) - env(safe-area-inset-bottom));
    }
}
.user-media-content-sub-title.title-ds {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 40px 0 20px;
}
.user-media-content-sub-title__title {
    align-items: center;
    display: flex;
    white-space: break-spaces;
}
.user-media-content-sub-title__title--loading {
    opacity: 0;
}
.user-media-content-sub-title__title-count {
    padding: 0 0 0 14px;
}
.user-media-content-sub-title__controls {
    align-items: center;
    display: flex;
    white-space: break-spaces;
}
.user-media-content-sub-title__control-item {
    color: #fff;
    cursor: pointer;
    margin: 0 0 0 12px;
    opacity: 0.6;
    transition: opacity 0.3s;
}
.pill-control.in-animation > .pill-control__ghost,
.user-media-content-sub-title__control-item:hover {
    opacity: 1;
}
.user-media-content-sub-title__controls-icon {
    display: block;
    height: 20px;
    margin: 0;
    opacity: 0.6;
    width: 20px;
}
.my-collection-albums__content {
    display: block;
    overflow: auto hidden;
    white-space: nowrap;
}
.my-collection-albums__content > .bc {
    display: inline-block;
    margin: 0 12px 0 0;
    width: 285px;
}
@media screen and (min-width: 480px) {
    .my-collection-albums__content {
        column-gap: 12px;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        overflow: visible;
        row-gap: 12px;
        white-space: normal;
    }
    .my-collection-albums__content > .bc {
        display: block;
        margin: 0;
        width: auto;
    }
}
@media screen and (min-width: 640px) {
    .my-collection-albums__content {
        column-gap: 20px;
        grid-template-columns: repeat(3, 1fr);
        row-gap: 20px;
    }
}
@media screen and (min-width: 1366px) {
    .my-collection-albums__content {
        grid-template-columns: repeat(5, 1fr);
    }
}
.my-collection-albums__skeleton-item {
    background: #343437;
    border-radius: 18px;
    padding-bottom: 75%;
}
.pill-control {
    align-items: center;
    border-radius: 12px;
    display: flex;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
}
.pill-control--disabled {
    opacity: 0.4;
    pointer-events: none;
}
.pill-control--style--default {
    background: #1c1c1c;
}
.pill-control--style--default-dark,
.pill-control--style--primary {
    background: #111113;
}
.pill-control.multi-lines {
    flex-wrap: wrap;
}
.pill-control.in-animation,
.upload-file-list .upload-media-item-add--chosen .z__indicators,
.upload-file-list .z--chosen .z__indicators {
    pointer-events: none;
}
.pill-control__item {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    flex: 1;
    height: 32px;
    justify-content: center;
    margin: 4px;
    opacity: 0.6;
    padding: 0 12px;
    position: relative;
    transition: opacity 0.3s;
}
.pill-control__item--active {
    opacity: 1;
    pointer-events: none;
}
.pill-control__item--active.pill-control__item--style--default,
.pill-control__item--active.pill-control__item--style--default-dark {
    background: #343437;
}
.pill-control__item--active.pill-control__item--style--primary {
    background: #d97706;
}
.pill-control__item--next-active,
.pill-control__item:hover {
    opacity: 1;
}
.pill-control__item.multi-lines {
    flex: auto;
}
.pill-control__ghost {
    border-radius: 8px;
    opacity: 0;
    pointer-events: none;
    position: absolute;
}
.pill-control__ghost--style--default,
.pill-control__ghost--style--default-dark {
    background: #343437;
}
.pill-control__ghost--style--primary {
    background: #d97706;
}
@media screen and (max-width: 639px) {
    .pill-control__item {
        height: 32px;
    }
}
.upload-file-list {
    column-gap: 12px;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    padding: 0;
    row-gap: 12px;
}
.upload-file-list .upload-media-item-add,
.upload-file-list .z {
    height: auto;
    margin: 0;
    padding-top: 100%;
    width: auto;
}
.upload-file-list .upload-media-item-add--drag,
.upload-file-list .z--drag {
    padding-top: 0;
}
.upload-file-list .upload-media-item-add--drag .z__cover-badge,
.upload-file-list .upload-media-item-add--ghost,
.upload-file-list .z--drag .z__cover-badge,
.upload-file-list .z--ghost {
    opacity: 0;
}
@media screen and (max-width: 639px) {
    .upload-file-list {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media screen and (max-width: 320px) {
    .upload-file-list {
        grid-template-columns: repeat(3, 1fr);
    }
}
.bu {
    display: flex;
    position: relative;
}
.bu__button {
    align-items: center;
    background: #2a244b;
    border: 0;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex-grow: 1;
    font-size: 14px;
    font-weight: 500;
    gap: 12px;
    height: 40px;
    justify-content: center;
    padding: 11px 20px;
}
@media screen and (max-width: 1023px) {
    .bu__button {
        padding: 11px;
    }
}
.bu__dropdown-icon {
    color: #a0a0a1;
    transition: transform 0.15s linear;
}
.bu__dropdown-icon--rotated {
    transform: rotate(180deg);
}
.bu__dropdown-content {
    padding: 12px 16px;
}
.bu__prising {
    align-items: center;
    border-bottom: 2px solid rgba(255, 255, 255, 0.05);
    column-gap: 12px;
    display: flex;
    flex-wrap: nowrap;
    margin-bottom: 12px;
    padding-bottom: 12px;
}
.bu__club-prices {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.bu__price {
    color: #fff;
    white-space: nowrap;
}
.bh,
.bu__bundles {
    color: #707071;
    white-space: nowrap;
}
.bh {
    align-items: center;
    border-radius: 6px;
    color: #fff;
    display: inline-flex;
    font-size: 13px;
    font-weight: 700;
    justify-content: center;
    padding: 2px 8px;
}
.bh--style--primary {
    background: #d97706;
}
.bh--style--alert {
    background: #ef7d00;
}
.island-value-link {
    background: #2e2e30;
    border-radius: 10px;
    display: block;
    padding: 6px 12px;
    width: 100%;
}
.island-value-link:hover {
    background: #343437;
    text-decoration: none;
}
.island-value-link__content {
    align-items: center;
    display: flex;
    justify-content: space-between;
    min-height: 30px;
}
.island-value-link__name,
.island-value-link__value {
    align-items: center;
    color: #cfcfd0;
    display: flex;
    font-size: 15px;
    font-weight: 500;
}
.island-value-link__value {
    color: #f59e0b;
    font-size: 18px;
}
.island-value-link__bottom {
    font-size: 12px;
    line-height: 16px;
    margin: 4px 0 0;
}
.l {
    overflow: hidden;
    position: relative;
}
.l--animated {
    transform: translateZ(0);
}
.l--animated::after {
    animation: flareAnimation 5s infinite ease-in alternate;
    background: linear-gradient(90deg, transparent 0, #d97706 50%, transparent 100%);
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 0;
}
.l__text {
    margin-left: 11px;
    z-index: 1;
}
.l__icon {
    z-index: 1;
}
.chat-controls {
    padding: 0 6px 8px;
    position: relative;
    touch-action: none;
}
.chat-controls::before {

    bottom: 100%;
    content: "";
    height: 8px;
    left: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
}
.chat-controls--hidden,
.r img[src=""] {
    visibility: hidden;
}
.chat-controls--mobile {
    background: #232325;
    bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom));
    left: 0;
    position: fixed;
    width: 100%;
}
.chat-controls__shatter {
    align-items: center;
    display: flex;
    font-size: 12px;
    gap: 3px;
    height: 100%;
    left: 12px;
    position: absolute;
    right: 12px;
    top: 0;
}
.chat-controls__ghost {
    min-height: 40px;
}
.chat-controls .chat-controls-input {
    max-height: 80px;
    padding: 6px 0;
}
.chat-controls .chat-controls-input__wrapper {
    margin: 0 0 0 14px;
}
.chat-controls .chat-controls-content,
.chat-controls .input-wrapper {
    align-items: flex-end;
    display: flex;
}
.chat-controls .input-wrapper {
    background: #343437;
    border: 1px solid transparent;
    border-radius: 18px;
    flex: 1;
    margin: 0 8px;
    position: relative;
}
.chat-controls .input-wrapper.focus {
    border-color: rgba(248, 248, 248, 0.1);
}
.chat-controls input.chat-input {
    background: 0 0;
    border: 0;
    border-radius: 15px;
    box-shadow: none;
    color: #fff;
    flex: 1;
    font-size: 13px;
    height: 34px;
    line-height: 16px;
    outline: 0;
    padding: 0 12px;
}
.chat-controls input.chat-input:focus {
    background: 0 0;
    border: 0;
    box-shadow: none;
    outline: 0;
}
.chat-controls input.chat-input::placeholder {
    color: #fff;
    opacity: 0.5;
}
.chat-controls .input-buttons {
    align-items: center;
    display: flex;
    margin: 0 0 3px;
    min-height: 22px;
}
.chat-controls .upload-icon-wrapper {
    height: 30px;
    margin-right: 0;
    padding: 0 4px;
}
.chat-controls .upload-icon-wrapper .icon {
    margin: 0;
}
.chat-controls .smiles-dropdown .trigger {
    color: #fff;
    height: 30px;
    width: auto;
}
.chat-controls .smiles-dropdown .trigger .icon,
.chat-controls .smiles-dropdown .trigger:hover .icon {
    fill: #fff;
    opacity: 0.6;
    position: static;
}
.chat-controls .control-button {
    padding: 6px;
    position: relative;
}
.chat-controls .control-button--dotted::after {
    background: #e12947;
    border: 2px solid #232325;
    border-radius: 10px;
    content: "";
    height: 10px;
    position: absolute;
    right: 1px;
    top: 1px;
    width: 10px;
}
.chat-controls .control-button--rounded {
    align-items: center;
    background: #343437;
    border-radius: 50%;
    display: flex;
    height: 32px;
    justify-content: center;
    padding: 0;
    width: 32px;
}
.chat-controls .control-button:hover .tip-icon {
    color: #e9a63b;
    opacity: 1;
}
.chat-controls .control-button__label {
    align-items: center;
    background: #d97706;
    border-radius: 6px;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 20px;
    padding: 0 8px;
}
.chat-controls .send-button {
    cursor: default;
}
.chat-controls .send-button.non-empty-input {
    cursor: pointer;
}
.chat-controls .send-button.non-empty-input .send-icon {
    opacity: 1;
}
.chat-controls .send-button.non-empty-input:hover .send-icon {
    transform: scale(1.1, 1.1);
}
.chat-controls .control-icon {
    color: #fff;
    fill: currentColor;
    height: 20px;
    margin: 0;
    opacity: 0.6;
    width: 20px;
}
.chat-controls .smiles-dropdown .smiles-list {
    bottom: 40px;
    top: auto;
}
@media (max-width: 639px) {
    .chat-controls .smiles-dropdown .smiles-list {
        left: auto;
        right: 0;
    }
}
.k {
    column-gap: 20px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 10px;
}
.k__field-row--long {
    grid-column: span 2;
}
.k__row-split {
    background: rgba(255, 255, 255, 0.05);
    grid-column: span 2;
    height: 1px;
    margin: 6px 0 0;
}
.k__field-label {
    flex-basis: 40%;
    line-height: 30px;
    text-align: left;
    white-space: nowrap;
    font-size: 0.75rem;
}
.k__field-input {
    flex-basis: 60%;
    font-size: 0.75rem;
}
.k__field-tooltip {
    margin-left: 10px;
}
.k__field-input-optional {
    align-items: center;
    display: flex;
}
.k__field-delete-button {
    background: 0 0;
    border: 0;
    color: #707071;
    cursor: pointer;
    margin: 0 11px;
    outline: 0;
    padding: 0;
}
@media (max-width: 639px) {
    .k {
        display: block;
    }
}
.error-message {
    color: #fd3a5b;
    display: block;
    flex: 1;
    font-size: 12px;
    margin: 4px 0 0;
    text-align: left;
}
.j {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.j__item {
    background: #232325;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    flex: 1;
    flex-direction: column;
    gap: 20px;
    min-height: 240px;
    overflow: hidden;
    padding: 0 20px;
    transition: background 0.3s;
}
.j__item:hover {
    background: #343437;
}
.j__icon,
.j__item {
    align-items: center;
    display: flex;
    justify-content: center;
}
.j__icon::before {
    background: radial-gradient(50% 50%at 50% 50%, rgba(81, 53, 255, 0.2) 0, rgba(27, 27, 29, 0) 100%);
    content: "";
    height: 192px;
    position: absolute;
    width: 192px;
}
.j__text {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
}
@media (max-width: 639px) {
    .j {
        flex-direction: column;
    }
    .j__item {
        min-height: 148px;
    }
}
.select-studio-type {
    color: #a0a0a1;
    margin: 0 0 40px;
    max-width: 680px;
}
.select-studio-type .select {
    display: block;
    max-width: 400px;
}
.switcher {
    align-items: flex-end;
    background: #424248;
    border-radius: 20px;
    color: #e1e1e1;
    cursor: pointer;
    height: 100%;
    overflow: hidden;
    padding: 3px;
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: row;
    transition: all 360ms ease-in-out 0s;
}
.switcher--disabled {
    opacity: 0.45;
    pointer-events: none;
}
.switcher .switcher-wrapper {
    display: block;
    font-size: 12px;
    height: 100%;
    line-height: 14px;
    transform: translateX(-14px);
    transition: transform 0.5s ease-in-out;
    width: 100%;
}
.switcher .switcher-wrapper .switcher-label {
    color: #fff;
    display: inline-block;
    opacity: 0;
    text-align: center;
    vertical-align: middle;
    width: calc(100% - 15px);
}
.switcher .switcher-wrapper .switcher-switch {
    background: #fff;
    border-radius: 50%;
    color: #424248;
    display: inline-block;
    transition: all 0.5s;
    vertical-align: middle;
}
.switcher .switcher-wrapper .switcher-switch ~ .switcher-label {
    text-align: right;
}
.switcher .switcher-wrapper .switcher-switch .icon {
    height: 100%;
    margin-right: 0;
    transform: scale(0.75);
    width: 100%;
}
.switcher .switcher-wrapper .icon.icon-check {
    margin-bottom: 2px;
    margin-left: -1px;
}
.switcher.on {
    background: #d97706;
}
.switcher.on:hover {
    background: #d97706;
}
.switcher.on .switcher-wrapper {
    transform: translateX(0);
}
.switcher.on .switcher-wrapper .switcher-label {
    color: #fff;
    opacity: 1;
}
.switcher.on .switcher-wrapper .switcher-switch {
    color: #d97706;
}
.switcher.light {
    background: #676767;
}
.switcher.light.on {
    background: #d97706;
}
.switcher.light .switcher-wrapper .switcher-switch {
    background: #fff;
}
.switcher.mixed-light {
    background: rgba(0, 0, 0, 0.18);
}
.switcher.mixed-light .switcher-wrapper .switcher-switch {
    background: rgba(255, 255, 255, 0.4);
}
.switcher.mixed-light .switcher-wrapper .switcher-switch .icon {
    color: #252525;
}
.switcher.mixed-light.on {
    background: #79943d;
}
.switcher.mixed-light.on .switcher-wrapper .switcher-switch {
    background: #2f2f2f;
}
.switcher.mixed-light.on .switcher-wrapper .switcher-switch .icon {
    color: #79943d;
}
.switcher.mixed-light.on .switcher-wrapper .switcher-label .icon {
    fill: #2f2f2f;
}
.switcher.default,
.switcher.small {
    height: 22px;
    margin-left: 10px;
    width: 38px;
}
.switcher.default .switcher-wrapper .switcher-label {
    padding: 0 2px 0 1px;
}
.switcher.default .switcher-wrapper {
    margin-right: 2px;
}
.switcher.default .switcher-wrapper .switcher-switch {
    float: right;
    height: 14px;
    width: 14px;
}
.switcher.default .switcher-wrapper .icon.icon-check {
    height: 10px;
    width: 10px;
}
.switcher.small {
    min-width: 35px;
    width: 35px;
}
.switcher.small .switcher-wrapper {
    transform: translateX(-14px);
}
.switcher.small .switcher-wrapper .switcher-label {
    padding: 0 2px;
    visibility: hidden;
    width: calc(100% - 14px);
}
.switcher.small .switcher-wrapper .switcher-switch {
    height: 14px;
    width: 14px;
}
.switcher.small .switcher-wrapper .icon.icon-check {
    height: 7px;
    margin-left: 5px;
    width: 7px;
}
.switcher.small.on .switcher-wrapper {
    transform: translateX(0);
}
.switcher.large,
.switcher.medium {
    height: 30px;
    margin-left: 10px;
    width: 55px;
}
.switcher.medium .switcher-wrapper {
    transform: translateX(-24px);
}
.switcher.medium .switcher-wrapper .switcher-label {
    padding: 0 2px;
    width: calc(100% - 24px);
}
.switcher.medium .switcher-wrapper .switcher-switch {
    height: 24px;
    width: 24px;
}
.switcher.medium .switcher-wrapper .icon.icon-check {
    height: 12px;
    margin-left: 5px;
    width: 12px;
}
.switcher.medium.on .switcher-wrapper {
    transform: translateX(0);
}
.switcher.large {
    height: 33px;
    width: 64px;
}
.switcher.large .switcher-wrapper {
    transform: translateX(-27px);
}
.switcher.large .switcher-wrapper .switcher-label {
    margin-top: 2px;
    padding: 0 2px;
    width: calc(100% - 34px);
}
.switcher.large .switcher-wrapper .switcher-switch {
    height: 27px;
    width: 27px;
}
.switcher.large .switcher-wrapper .icon.icon-check {
    height: 16px;
    margin-bottom: 0;
    margin-left: 5px;
    width: 16px;
}
.switcher.large.on .switcher-wrapper {
    transform: translateX(0);
}
.switcher.large.on .switcher-wrapper .switcher-label {
    width: calc(100% - 28px);
}
.settings-pricing {
    display: flex;
    gap: 20px;
}
.settings-pricing__controls {
    flex: 1;
    grid-area: controls;
}
.settings-pricing__preview {
    display: flex;
    flex-direction: column;
    gap: 20px;
    width: 418px;
}
.settings-pricing__preview .user-fan-club-subscribe {
    background: #1b1b1d;
}
.settings-pricing__trial {
    grid-area: trial;
}
@media screen and (max-width: 1023px) {
    .settings-pricing {
        display: block;
    }
    .settings-pricing__preview {
        margin: 20px 0 0;
        width: auto;
    }
    .settings-pricing__trial {
        margin-top: 20px;
    }
}
.settings-pricing__preview-title {
    font-size: 20px;
    margin: 0 0 10px;
}
.settings-pricing__preview-description {
    font-size: 14px;
    margin: 10px 0 20px;
    opacity: 0.6;
}
.cd {
    background: #232325;
    border-radius: 12px;
}
.cd__header {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    padding: 20px;
    width: 100%;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
.cd__icon-close {
    color: #707071;
    height: 24px;
    padding: 2px;
    transition: transform 0.15s ease-in-out;
    width: 24px;
}
.cd__icon-close--collapsed {
    transform: rotate(180deg);
}
.cd__content {
    padding: 0 20px 20px;
    font-size: 0.75rem;
    line-height: 1rem;
}
.cd__content--collapsed {
    height: 0;
    opacity: 0;
    overflow: hidden;
    padding: 0;
}
.settings-documents-status {
    background: #232325;
    border-radius: 12px;
}
.settings-documents-status--regular {
    padding: 20px;
}
.settings-documents-status--small {
    padding: 12px 20px;
}
.settings-documents-status--warning {
    background: #ef7d00;
}
.settings-documents-status__none .icon {
    margin: -2px 6px 0 0;
}
.settings-documents-status__verified {
    align-items: center;
    display: flex;
    font-size: 16px;
}
.settings-documents-status__verified > .icon {
    height: 20px;
    margin: 0 10px 0 0;
    width: 20px;
}
.settings-documents-status__small-description {
    font-size: 14px;
    opacity: 0.6;
}
.settings-documents-status__description {
    margin: 10px 0 0;
}
.settings-documents-status__description > .icon {
    height: 16px;
    margin: -2px 10px 0 0;
    width: 16px;
}
.settings-documents-status__description > .icon.icon-wrong {
    color: #ef7d00;
}
.notifications-settings-tumblers-block {
    column-gap: 20px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    margin: 32px 0 22px;
    row-gap: 20px;
}
@media screen and (max-width: 1023px) {
    .notifications-settings-tumblers-block {
        grid-template-columns: repeat(1, 1fr);
    }
}
.stories-grid-empty-state {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 120px auto 0;
}
.stories-grid-empty-state__icon {
    color: #a0a0a1;
    margin-bottom: 4px;
}
.bF {
    align-items: center;
    background: #1b1b1d no-repeat center;
    background-size: cover;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    position: relative;
}
.bF:hover .bF__pin-button:not(.bF__pin-button--pinned):not(:hover) {
    opacity: 0.4;
}
@media screen and (max-width: 767px) {
    .bF {
        border-radius: 2px;
        height: 50px;
    }
}
.bF::before {
    content: "";
    display: block;
    flex: 1;
    padding-bottom: 180%;
}
.bF__content {
    align-items: center;
    bottom: 0;
    display: flex;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.bF__image {
    height: 100%;
    object-fit: contain;
    width: 100%;
}
.bF__date {
    font-size: 14px;
    font-weight: 500;
    left: 8px;
    line-height: 140%;
    pointer-events: none;
    position: absolute;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
    text-transform: uppercase;
    top: 6px;
    z-index: 2;
}
.bF__views {
    align-items: center;
    bottom: 8px;
    display: flex;
    gap: 8px;
    left: 8px;
    pointer-events: none;
    position: absolute;
    z-index: 2;
}
.bF__shadow-top {
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.6) 0, transparent 100%);
    height: 44px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1;
}
.bF__shadow-bottom {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.6) 100%);
    bottom: 0;
    height: 44px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 1;
}
.bF__pin-button {
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    opacity: 0;
    outline: 0;
    padding: 0;
    position: absolute;
    right: 8px;
    top: 8px;
    transition: opacity 150ms ease;
    z-index: 2;
}
.bF__pin-button:hover {
    opacity: 0.8;
}
.bF__pin-button--pinned {
    opacity: 1;
}
.bF__pin-icon {
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.2));
    transform: rotate(20deg);
}
.personal-notification {
    padding: 0.75rem 20px;
    position: relative;
}
.personal-notification__username {
    color: #fff;
}
.personal-notification-body {
    display: flex;
    flex-direction: row;
}
.personal-notification-body-left {
    height: 48px;
    margin-right: 0.75rem;
    width: 48px;
    flex: 1;
    flex-basis: auto;
    flex-grow: 0;
    flex-shrink: 1;
}
.personal-notification-body-middle {
    flex: 1;
    flex-basis: 0;
    flex-grow: 1;
    flex-shrink: 1;
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 4px 0 0;
}
.personal-notification-body-middle-body {
    white-space: normal;
}
.personal-notification-body-middle-body.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.personal-notification-body-middle-footer {
    font-size: 0.625rem;
    line-height: 1rem;
}
.personal-notification-body-text {
    color: #a0a0a1;
    font-size: 15px;
    font-weight: 400;
    line-height: 18px;
    word-break: break-word;
}

.personal-notification-body-text a{
    color: #e0e0e2;
}
.personal-notification-body-right {
    align-items: center;
    height: 48px;
    margin-left: 0.75rem;
    display: flex;
    flex-direction: row;
}
.personal-notification-footer {
    justify-content: flex-start;
    margin: 0.375rem 0 0 60px;
    display: flex;
    flex-direction: row;
}
.personal-notification-footer .btn {
    margin-bottom: 0;
}
.personal-notification-counter {
    align-items: center;
    background-color: #fa5465;
    border-radius: 3px;
    color: #fff;
    height: 24px;
    justify-content: center;
    width: 30px;
    font-size: 0.875rem;
    line-height: 1.25rem;
    display: flex;
    flex-direction: row;
}
.personal-notification-image {
    height: 48px;
    width: 48px;
}
.personal-notification-image .user-status-icon {
    background: #232325;
}
.personal-notification__icon {
    height: 24px;
    width: 24px;
}
.personal-notification__icon-wrapper {
    align-items: center;
    border-radius: 16px;
    display: flex;
    height: 48px;
    justify-content: center;
    width: 48px;
}
.personal-notification__icon-wrapper--style--regular {
    background: #1b1b1d;
    color: #a0a0a1;
}
.personal-notification__icon-wrapper--style--warning {
    background: rgba(252, 207, 73, 0.2);
    color: #fccf49;
}
.personal-notification__icon-wrapper--style--positive {
    background: rgba(33, 176, 98, 0.2);
    color: #21b062;
}
.personal-notification__icon-wrapper--style--error {
    background: rgba(210, 27, 76, 0.2);
    color: #ef7d00;
}
.personal-notification-profile-link {
    position: relative;
    z-index: 6;
    display: block;
}
.personal-notification-profile-link:hover {
    opacity: 0.8;
}
.personal-notification-profile-link > .avatar {
    font-size: 2px;
}
.personal-notification-label {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    bottom: -4px;
    display: flex;
    height: 28px;
    justify-content: center;
    position: absolute;
    right: -4px;
    width: 28px;
}
.personal-notification-closer {
    cursor: pointer;
    display: none;
    padding: 0.375rem;
    position: absolute;
    right: 0.375rem;
    top: 15px!important;
    z-index: 6;
}
.personal-notification-closer .icon {
    fill: rgba(255, 255, 255, 0.4);
    height: 10px;
    margin: 0;
    width: 10px;
}
.personal-notification-closer:hover {
    display: flex;
    flex-direction: row;
}
.personal-notification-closer:hover .icon {
    fill: rgba(255, 255, 255, 0.8);
}
.personal-notification-additional-comment {
    border: 1px solid #78797b;
    border-radius: 1px;
    margin-top: 12px;
    padding: 0.625rem;
    position: relative;
    font-size: 0.875rem;
    line-height: 1.25rem;
}
.personal-notification-additional-comment::after,
.personal-notification-additional-comment::before {
    content: "";
    left: 23px;
    position: absolute;
}
.personal-notification-additional-comment::after {
    border-bottom: 5px solid #3e3f42;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    margin-left: -5px;
    top: -4px;
}
.personal-notification-additional-comment::before {
    border-bottom: 6px solid #78797b;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    margin-left: -6px;
    top: -6px;
}
.personal-notification-additional-comment-navigable {
    color: #fff;
    cursor: pointer;
}
.personal-notification-additional-comment-navigable:hover {
    color: #ff6277;
}
.personal-notification-additional-comment-link {
    text-decoration: none;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.personal-notification-additional-comment-inners {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.personal-notification-background-link {
    z-index: 5;
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.personal-notification-description-text {
    color: rgba(255, 255, 255, 0.5);
    font-size: 0.625rem;
    line-height: 1rem;
}
.personal-notification-description-text * {
    font-size: 0.625rem;
    line-height: 1rem;
}
.personal-notification:hover .personal-notification-closer {
    display: flex;
    flex-direction: row;
}
.personal-notification .new-fan-club-content-personal-notification-text {
    margin: 1px 0 14px;
    max-width: 260px;
}
.personal-notification.new-fan-club-content-personal-notification .btn {
    margin-bottom: 0;
}
.personal-notification.content-status-changed-personal-notification .personal-notification-image {
    fill: #fa7055;
}
.personal-notification.content-status-changed-personal-notification .personal-notification-body-middle {
    justify-content: center;
}
.personal-notification.tip-personal-notification-with-comment .personal-notification-footer {
    margin-top: 0.75rem;
}
.personal-notification-appearing-trash {
    align-items: center;
    background: #38010f;
    height: 100%;
    justify-content: center;
    width: 72px;
    display: flex;
    flex-direction: row;
}
.personal-notification-appearing-trash .icon {
    color: #ef7d00;
    height: 16px;
    width: 16px;
}
.fan-club-user-joined-personal-notification .personal-notification-body-text {
    color: rgba(255, 255, 255, 0.8);
}
.fan-club-user-joined-personal-notification .personal-notification-body-text .accent {
    color: #fff;
}
.fan-club-subscription-extended-personal-notification-text {
    color: rgba(255, 255, 255, 0.8);
    margin: 1px 0 14px;
}
.fan-club-subscription-extended-personal-notification-text-months {
    color: #fff;
    font-weight: 700;
}
.cb {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: flex-start;
    margin-top: 8px;
}
.cb__connect-icon {
    margin-right: 8px;
}
.cb__connect-link {
    align-items: center;
    background: #343437;
    border-radius: 12px;
    color: #fff;
    display: inline-flex;
    font-weight: 400;
    height: 32px;
    padding: 0 20px;
    transition: background 250ms;
}
.cb__connect-link:hover {
    background: #424248;
}
.css-popover {
    position: relative;
}
.css-popover-content-top {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    left: 50%;
    top: 0;
    transform: translate(-50%, calc(-100% + 10px - 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-top {
        transition-property: opacity;
    }
}
.css-popover-content-top-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, calc(-100% - 5px));
}
.css-popover-content-bottom {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, calc(100% - 10px + 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-bottom {
        transition-property: opacity;
    }
}
.css-popover-content-bottom-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, calc(100% + 5px));
}
.css-popover-content-left {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    left: 0;
    top: 50%;
    transform: translate(calc(-100% + 10px - 5px), -50%);
}
@media (prefers-reduced-motion) {
    .css-popover-content-left {
        transition-property: opacity;
    }
}
.css-popover-content-left-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(calc(-100% - 5px), -50%);
}
.css-popover-content-right {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    right: 0;
    top: 50%;
    transform: translate(calc(100% - 10px + 5px), -50%);
}
@media (prefers-reduced-motion) {
    .css-popover-content-right {
        transition-property: opacity;
    }
}
.css-popover-content-right-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(calc(100% + 5px), -50%);
}
.css-popover-content-topleft {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    right: 0;
    top: 0;
    transform: translate(0, calc(-100% + 10px - 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-topleft {
        transition-property: opacity;
    }
}
.css-popover-content-topleft-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0, calc(-100% - 5px));
}
.css-popover-content-topright {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    left: 0;
    top: 0;
    transform: translate(0, calc(-100% + 10px - 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-topright {
        transition-property: opacity;
    }
}
.css-popover-content-topright-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0, calc(-100% - 5px));
}
.css-popover-content-bottomleft {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    bottom: 0;
    left: 0;
    transform: translate(-10%, calc(100% - 10px + 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-bottomleft {
        transition-property: opacity;
    }
}
.css-popover-content-bottomleft-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0, calc(100% + 5px));
}
.css-popover-content-bottomright {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    right: 0;
    top: 100%;
    transform: translate(10%, -10%);
}
@media (prefers-reduced-motion) {
    .css-popover-content-bottomright {
        transition-property: opacity;
    }
}
.css-popover-content-bottomright-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(0, 0);
}
.css-popover-content-middleleft {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    right: 0;
    top: 100%;
    transform: translate(-23%, calc(-100% - 10px + 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-middleleft {
        transition-property: opacity;
    }
}
.css-popover-content-middleleft-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-23%, calc(-100% + 5px));
}
.css-popover-content-middleright {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1000;
    left: 0;
    top: 100%;
    transform: translate(25%, calc(-100% - 10px + 5px));
}
@media (prefers-reduced-motion) {
    .css-popover-content-middleright {
        transition-property: opacity;
    }
}
.css-popover-content-middleright-shown {
    opacity: 1;
    pointer-events: auto;
    transform: translate(25%, calc(-100% + 5px));
}
.bG {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(8, 1fr);
    margin-top: 42px;
}
@media screen and (max-width: 1365px) {
    .bG {
        grid-template-columns: repeat(6, 1fr);
    }
}
@media screen and (max-width: 1279px) {
    .bG {
        grid-template-columns: repeat(5, 1fr);
    }
}
@media screen and (max-width: 767px) {
    .bG {
        gap: 2px;
        grid-template-columns: repeat(auto-fit, minmax(108px, 1fr));
    }
}
.bG__add-story {
    align-items: center;
    background: #1b1b1d;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    transition: all ease 200ms;
}
.bG__add-story:hover {
    background: #232325;
}
.bG__add-story:active {
    transform: translateY(2px);
}
@media screen and (max-width: 767px) {
    .bG__add-story {
        border-radius: 0;
    }
}
.bG__skeleton-item {
    background: #111113;
    border-radius: 12px;
    display: flex;
}
.bG__skeleton-item::before {
    content: "";
    display: block;
    flex: 1;
    padding-bottom: 180%;
}
@media screen and (max-width: 767px) {
    .bG__skeleton-item {
        border-radius: 0;
    }
}
.island-block {
    border-radius: 12px;
}
.island-block--overflow-hidden {
    overflow: hidden;
}
.island-block--color--grey-500 {
    background: #343437;
}
.island-block--color--grey-600 {
    background: #232325;
}
.island-block--radius--full {
    border-radius: 12px;
}
.island-block--radius--bottom {
    border-radius: 0 0 12px 12px;
}
.info-block,
.info-block--color--regular {
    background: #232325;
}
.info-block--color--light {
    background: #343437;
}
.info-block--size--small {
    border-radius: 10px;
    padding: 10px;
}
.info-block--size--medium {
    border-radius: 12px;
    padding: 24px;
}
.info-block__title {
    font-size: 22px;
    font-weight: 500;
    line-height: 27px;
    margin: 0 0 20px;
}
.info-block__footer {
    border-top: 2px solid rgba(255, 255, 255, 0.05);
    margin: 20px 0 0;
    padding: 20px 0 0;
}
.info-block-label {
    color: #bbb;
    display: flex;
    font-size: 11px;
    font-weight: 400;
    line-height: 17px;
}
.info-block-label--center {
    align-items: center;
}
.info-block-label__left {
    padding: 0 6px 0 0;
}
.info-block-label__icon {
    color: #fff;
}
.info-block-label__icon--size--small {
    height: 16px;
    width: 16px;
}
.info-block-list {
    list-style: none;
}
.info-block-list__item {
    display: flex;
    font-size: 13px;
    font-weight: 400;
    margin: 8px 2px;
    padding: 0;
}
.info-block-list__item-num {
    margin: 0 4px 0 0;
}
.bm {
    display: grid;
    grid-gap: 20px;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}
.bm__skeleton-item {
    animation: skeleton-animation;
    animation-duration: 1s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    background: #1b1b1d;
    border-radius: 16px;
    height: 300px;
}
.bm__skeleton-item:nth-child(2n) {
    animation-delay: 300ms;
}
.bK {
    contain: strict;
    min-height: 264px
}

.bK__list {
    display: flex
}

.bK__item {
    margin-right: 12px;
    min-width: 162px;
    width: 162px
}

.bK__item:last-child {
    margin: 0
}

.bk__content {
    align-items: center;
    background: #1b1b1d;
    border-radius: 12px;
    display: flex;
    justify-content: flex-start;
    min-height: 80px;
    padding: 0 20px;
}
@media screen and (max-width: 639px) {
    .bk__content {
        margin-bottom: 10px;
    }
}
@media (hover: hover) {
    .bk__content--with-hover:hover,
    .bk__content--with-hover:hover .bk__users-count {
        background: #232325;
    }
    .bk__content--with-hover:hover .bk__drag {
        opacity: 1;
    }
    .bk__content--with-hover:hover .bk__info {
        transform: translateX(0);
    }
    .bk__content:hover .bk__favorite-button {
        opacity: 1;
        pointer-events: auto;
    }
}
@media screen and (max-width: 639px) {
    .bk__content {
        align-items: flex-start;
        padding: 16px;
    }
}
.bk__name {
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bk__drag {
    color: #707071;
    opacity: 0;
    overflow: hidden;
    transition: opacity linear 200ms;
}
.bk__info {
    flex: 1;
    margin-left: 10px;
    transform: translateX(-24px);
    transition: transform linear 200ms;
}
@media screen and (max-width: 639px) {
    .bk__info {
        margin-left: 0;
    }
}
.bk__title {
    align-items: center;
    grid-gap: 6px;
    justify-content: start;
    margin-bottom: 4px;
}
.bk__description-wrapper,
.bk__title {
    display: grid;
    grid-auto-flow: column;
}
.bk__description {
    color: #a0a0a1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    width: calc(100% - 36px);
}
.bk__actions {
    display: flex;
    gap: 10px;
}
.bk__users-count {
    align-items: center;
    background: inherit;
    display: flex;
    flex-wrap: nowrap;
    gap: 10px;
    justify-content: flex-start;
    margin-right: 30px;
}
@media screen and (max-width: 639px) {
    .bk__users-count {
        margin-right: 0;
        margin-top: 18px;
    }
}
.bk__favorite-button {
    opacity: 0;
    pointer-events: none;
}
.bk__favorite-button--visible {
    opacity: 1;
    pointer-events: auto;
}
.b8 {
    display: flex;
    min-height: 460px;
}
.b8__controls {
    flex: 1 0 540px;
}
.b8__preview {
    display: flex;
    flex-direction: column;
    margin-left: 20px;
    max-width: 100%;
    width: 418px;
}
@media screen and (max-width: 1023px) {
    .b8 {
        display: block;
    }
    .b8__controls {
        margin-bottom: 20px;
    }
    .b8__preview {
        margin-left: 0;
    }
}
.media-browser__list {
    margin-top: 20px;
    max-height: 450px;
    overflow: auto;
}
.media-browser .placeholder {
    align-items: center;
    display: flex;
    height: 200px;
    justify-content: center;
    position: relative;
    width: 100%;
}
.media-browser .empty-state {
    align-items: center;
    display: flex;
    flex-direction: column;
    opacity: 0.5;
}
.media-browser .empty-state-icon {
    fill: currentColor;
    margin: 0;
}
.media-browser .empty-state-icon.icon-camera,
.media-browser .empty-state-icon.icon-photo-2 {
    height: 78px;
    width: 80px;
}
.media-browser .empty-state-icon.icon-new-upload {
    height: 64px;
    width: 56px;
}
.media-browser .empty-state-text {
    font-size: 16px;
    margin-top: 20px;
}
.browse-menu {
    border-bottom: 1px solid rgba(248, 248, 248, 0.1);
    margin-top: 15px;
}
.browse-button.a11y-button {
    color: rgba(255, 255, 255, 0.6);
    font-size: 16px;
    margin-bottom: -1px;
    padding: 15px 0;
}
.browse-button:not(:last-child) {
    margin-right: 30px;
}
.browse-button:hover,
.searchable-head .icon-container:hover {
    color: #fff;
}
.browse-button.active {
    border-bottom: 3px solid var(--primary-border);
    opacity: 1;
}
@media (max-width: 767px) {
    .browse-button {
        font-size: 13px;
    }
    .browse-button:not(:last-child) {
        margin-right: 20px;
    }
}
.club-members-info-title {
    margin-right: 20px;
}
@media screen and (max-width: 639px) {
    .club-members-info-title {
        margin-right: 0;
    }
}
.club-members-delay-info {
    font-size: 0.813rem;
    align-items: center;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    margin: 0;
}
.club-members-delay-info .time-icon {
    margin-right: 8px;
}
.searchable-head,
.v {
    align-items: center;
    -webkit-user-select: none;
    user-select: none;
}
.searchable-head {
    display: flex;
    justify-content: start;
    position: relative;
}
.searchable-head .icon-container {
    align-items: center;
    cursor: pointer;
    display: flex;
    flex-shrink: 1;
    justify-content: center;
    margin-left: 12px;
    position: relative;
}
.searchable-head .icon-container:after {
    background: rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    content: "";
    display: none;
    height: 32px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 32px;
}
.searchable-head .icon-container:hover .icon {
    fill: #fff;
}
.searchable-head .icon-close-container {
    position: absolute;
    right: 16px;
}
.searchable-head .icon-close-container:hover .icon-close {
    color: rgba(255, 255, 255, 0.6);
}
.searchable-head.icon-first {
    flex-direction: row-reverse;
    justify-content: flex-end;
}
.searchable-head.icon-first .icon-container {
    margin-left: 0;
    margin-right: 12px;
}
.searchable-head .icon-search {
    color: rgba(255, 255, 255, 0.6);
    height: 24px;
    margin: 0;
    width: 24px;
}
.searchable-head .icon-close {
    color: #49494a;
    height: 20px;
    margin: 0;
    width: 20px;
}
.searchable-head input.input.text-medium {
    min-width: 178px;
    padding-right: 32px;
}
.v {
    cursor: pointer;
    display: inline-flex;
    gap: 8px;
    text-align: right;
    white-space: nowrap;
}
.v__icons-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
    justify-content: center;
}
.v__icon-sort {
    color: rgba(255, 255, 255, 0.2);
    height: 5px;
    margin-left: 5px;
    width: 10px;
}
.v__icon-sort--up {
    transform: rotate(180deg);
}
.v:hover .v__icon-sort,
.v__icon-sort--active {
    color: rgba(255, 255, 255, 0.6);
}
.on-boarding-slide {
    min-height: 558px;
    padding: 120px 54px 78px 72px;
}
.on-boarding-slide__icon > .smile {
    height: 78px;
    width: 78px;
}
.on-boarding-slide__title {
    font-size: 34px;
    font-weight: 700;
    line-height: 42px;
    margin: 24px 0;
}
.on-boarding-slide__description {
    color: #bbb;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
}
@media screen and (max-width: 767px) {
    .on-boarding-slide {
        min-height: auto;
        padding: 32px 24px;
        text-align: center;
    }
    .on-boarding-slide__icon > .smile {
        height: 56px;
        width: 56px;
    }
    .on-boarding-slide__title {
        font-size: 26px;
        line-height: 32px;
        margin: 12px 0;
    }
    .on-boarding-slide__description {
        font-size: 14px;
        font-weight: 500;
        line-height: 22px;
    }
}
.b4 {
    width: 100%;
}
.b4__grid {
    display: grid;
    gap: 20px;
    grid-template-columns: repeat(2, minmax(400px, 1fr));
}
@media screen and (max-width: 1023px) {
    .b4__grid {
        display: flex;
        flex-direction: column;
    }
}
.b4__grid-cell {
    flex: 1;
}
.b4__grid-cell--full {
    grid-column: 1/3;
}
.b4__period-header {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 0 24px;
}
.b4__period-date {
    font-size: 16px;
}
.b4__period-links {
    align-items: center;
    display: flex;
    gap: 28px;
}
.b4__period-link {
    background: 0 0;
    border: 0;
    color: #707071;
    cursor: pointer;
    font-size: 14px;
    position: relative;
}
.b4__period-link--active {
    color: #cfcfd0;
    pointer-events: none;
}
.b4__period-link:hover {
    color: #cfcfd0;
}
.b4__period-link:not(:last-child)::before {
    color: #49494a;
    content: "•";
    position: absolute;
    right: -15px;
}
.bT__columns {
    display: flex;
    gap: 20px;
}
@media screen and (max-width: 1279px) {
    .bT__columns {
        flex-wrap: wrap;
    }
}
.bT__column {
    align-self: flex-start;
    display: flex;
    flex: 1;
    flex-basis: 590px;
    flex-direction: column;
    gap: 20px;
    width: 590px;
}
@media screen and (max-width: 639px) {
    .bT__column {
        flex-basis: 300px;
        width: 300px;
    }
}
.bT .pagination {
    justify-content: flex-end;
    margin-top: 0;
}
.ck {
    align-items: flex-start;
    border-bottom: 1px solid #e7e7e7;
    display: flex;
    flex-wrap: wrap;
    gap: 12px 20px;
    justify-content: flex-start;
    margin: 20px auto;
    max-width: 100%;
    padding: 0 12px 20px;
    width: 924px;
}
.ck__offer {
    flex: 1;
    min-width: 50%;
}
.ck__offer-title {
    color: #000;
    font-size: 16px;
    font-weight: 600;
    line-height: 18px;
    margin-bottom: 4px;
}
.ck__offer-vat {
    color: #a0a0a1;
    font-size: 12px;
    font-weight: 600;
    line-height: 18px;
}
.ck__button {
    align-items: center;
    background: #eee;
    border: 0;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    height: 40px;
    justify-content: center;
    max-width: 100%;
    outline: 0;
    padding: 0 20px;
    width: 340px;
}
@media screen and (max-width: 942px) {
    .ck {
        margin: 0 auto 20px;
    }
}
.upload-media-item-add {
    background: rgba(255, 255, 255, 0.05);
    border: 2px dashed rgba(255, 255, 255, 0.2);
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    position: relative;
    transition: background 0.3s, border-color 0.3s, color 0.3s;
}
.upload-media-item-add:hover {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 255, 255, 0.3);
    color: #fff;
}
.upload-media-item-add__icon {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.z {
    background-color: #343437;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px;
    height: 76px;
    margin-right: 20px;
    position: relative;
    width: 76px;
    -webkit-user-select: none;
    user-select: none;
}
.z--has-error .z__indicators,
.z--in-moderation .z__indicators,
.z--uploading .z__indicators {
    opacity: 1;
    pointer-events: auto;
}
.z--draggable {
    cursor: grab;
}
.z--hover .z__drag-cover-content {
    opacity: 1;
    transform: translateY(0);
}
.z__badge {
    left: 4px;
    pointer-events: none;
    position: absolute;
    top: 4px;
}
.z__time {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 4px;
    bottom: 4px;
    color: #a0a0a1;
    display: flex;
    font-size: 10px;
    height: 14px;
    padding: 0 3px;
    pointer-events: none;
    position: absolute;
    right: 4px;
}
.z__remove-button {
    align-items: center;
    background-color: #5b5b5b;
    border: 3px solid #1b1b1d;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    position: absolute;
    right: -8px;
    top: -12px;
    transition: all ease 0.25s;
    width: 24px;
    z-index: 1;
}
.z__remove-button .icon {
    color: #fff;
    fill: #fff;
    margin: 0;
}
.z__remove-button:hover {
    background-color: #af262f;
}
.z__indicators {
    align-items: center;
    background-color: rgba(0, 0, 0, 0.8);
    border-radius: inherit;
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: opacity 0.5s;
}
.z__uploading {
    animation: donut-spin 1.2s linear infinite;
}
.z__processing {
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    word-break: break-word;
}
.z__processing--in-moderation {
    color: #fccf49;
}
.z__error-icon {
    left: 5px;
    position: absolute;
    top: 5px;
}
.z__error-icon .icon {
    color: #e12947;
    fill: #e12947;
    height: 14px;
    margin: 0;
    width: 14px;
}
.z__try-again {
    cursor: pointer;
}
.z__try-again .icon {
    color: #fff;
    fill: #fff;
    height: 26px;
    margin: 0;
    transition: all ease 0.25s;
    width: 26px;
}
.z__try-again:hover .icon {
    opacity: 0.7;
}
.z__cover-badge {
    border-bottom-right-radius: 8px;
    border-top-left-radius: 8px;
    color: #fff;
    height: 40px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 40px;
    z-index: 1;
}
.z__cover-badge:before {
    border-color: #d97706 transparent transparent #d97706;
    border-style: solid;
    border-width: 20px;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    top: 0;
}
.z__cover-badge-icon {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    margin-left: 4px;
    margin-top: 4px;
    position: relative;
    z-index: 1;
}
.z__drag-cover {
    border-radius: 0 0 10px 10px;
    bottom: 0;
    display: flex;
    height: 30%;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
}
.z__drag-cover-content {
    align-items: center;
    background: rgba(5, 5, 6, 0.8);
    color: #fff;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    transform: translateY(30%);
    transition: transform 250ms ease, opacity 250ms ease;
    width: 100%;
}
.z__drag-cover-content::after,
.z__drag-cover-content::before {
    background: #fff;
    border-radius: 12px;
    content: "";
    display: block;
    height: 2px;
    width: 12px;
}
.z__drag-cover-content::before {
    margin-bottom: 4px;
}
.z__drag-cover-content--teaser {
    opacity: 1;
    transform: translateY(0);
}
.z__drag-cover-content--teaser::after,
.z__drag-cover-content--teaser::before {
    display: none;
}
.panel-select-price {
    margin: 0 0 20px;
    position: relative;
    z-index: 3;
}
.panel-select-price__left {
    flex: 1;
}
.panel-select-price__right {
    max-width: 80px;
}
.panel-select-price__content {
    align-items: center;
    display: flex;
    gap: 20px;
}
.users-groups-accordion__item {
    cursor: pointer;
    display: flex;
    font-size: 12px;
    justify-content: space-between;
    padding: 10px 12px;
}
.users-groups-accordion__item:hover,
.users-groups-accordion__list-item:hover {
    background: #050506;
}
.users-groups-accordion__item-left {
    align-items: center;
    display: grid;
    grid-auto-flow: column;
    grid-gap: 4px;
    max-width: 60%;
}
.users-groups-accordion__item-label {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.users-groups-accordion__list {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin: 8px 0 0;
    padding: 8px 0 0;
}
.users-groups-accordion__list-item {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 48px;
    overflow: hidden;
    padding: 4px 12px;
}
.users-groups-accordion__list-item-badge {
    color: #5f5f61;
    font-size: 11px;
    position: absolute;
    right: 16px;
}
.users-groups-accordion__list-item-badge--alert {
    color: #ef7d00;
}
.users-groups-accordion__title {
    display: flex;
    font-size: 12px;
    justify-content: space-between;
    line-height: 20px;
    padding: 0 12px;
}
.V {
    background: #111113;
    border: 1px solid #343437;
    border-radius: 12px;
    max-width: 360px;
    padding: 20px;
}
.V__selector-header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin-bottom: 16px;
}
.V__selector-header-title {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 18px;
    font-weight: 700;
    gap: 10px;
    line-height: 22px;
}
.V__selector-header-controls {
    align-items: center;
    display: flex;
    gap: 8px;
}
.V__control-button {
    background: 0 0;
    border: 0;
    color: #a0a0a1;
    cursor: pointer;
    display: grid;
    height: 24px;
    place-items: center;
    width: 24px;
}
.V__control-button:disabled {
    color: #49494a;
}
.V__control-button:not(:disabled):hover {
    color: #fff;
}
.V__days {
    align-items: center;
    display: grid;
    gap: 6px;
    grid-template-columns: repeat(7, 40px);
    height: 40px;
    justify-content: center;
}
.V__day-cell {
    color: #fff;
    cursor: pointer;
    display: grid;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    place-items: center;
}
.V__dates {
    display: grid;
    font-weight: 400;
    gap: 6px;
    grid-template-columns: repeat(7, 40px);
    grid-template-rows: repeat(6, 40px);
    justify-content: center;
}
.V__date-cell {
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
    display: grid;
    font-size: 12px;
    place-items: center;
    -webkit-user-select: none;
    user-select: none;
}
.V__date-cell:hover:not(.V__date-cell--disabled, .V__date-cell--selected) {
    background: #343437;
}
.V__date-cell--today:not(.V__date-cell--selected) {
    border: 2px solid rgba(255, 255, 255, 0.4);
    font-weight: 700;
}
.V__date-cell--selected {
    background: #d97706;
    font-weight: 700;
}
.V__date-cell--disabled {
    color: #707071;
    cursor: default;
}
.V__years {
    display: grid;
    font-weight: 400;
    gap: 6px;
    grid-auto-rows: 40px;
    grid-template-columns: repeat(7, 40px);
    justify-content: center;
    margin: 0-20px;
    max-height: 310px;
    padding: 20px;
}
.V__mode-button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    outline: 0;
    padding: 0;
}
.V__mode-button-icon {
    height: 24px;
    width: 24px;
}
.V__mode-button-icon--rotated {
    transform: rotate(180deg);
}
.badge,
.text-area-icon__placeholder {
    align-items: center;
    display: flex;
    font-size: 13px;
}
.text-area-icon__placeholder {
    color: #fff;
}
.text-area-icon__placeholder > .icon {
    height: 20px;
    margin: 0 12px 0 0;
    width: 20px;
}
.badge {
    border-radius: 6px;
    font-weight: 700;
    padding: 0 8px;
}
.badge,
.badge--size--small {
    height: 20px;
}
.badge--size--regular {
    height: 24px;
}
.badge--type--primary {
    background: #d97706;
    color: #fff;
}
.badge--type--teaser {
    background: #fccf49;
    color: #000;
}
.badge--type--positive {
    background: #21b062;
    color: #fff;
}
.badge--type--error {
    background: #ef7d00;
    color: #fff;
}
.masked-input-wrapper {
    position: relative;
}
.masked-input-invisible {
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.masked-input-invisible ~ input {
    z-index: 0;
}
.chat-skeleton {
    padding: 27px 12px 8px;
}
.chat-skeleton .message-skeleton {
    align-items: flex-end;
    display: flex;
}
.chat-skeleton .message-skeleton:not(:first-child) {
    margin-top: 32px;
}
.chat-skeleton .right-message {
    display: flex;
}
.chat-skeleton .right-message .skeleton-message-content {
    align-items: flex-end;
    justify-content: flex-end;
}
.chat-skeleton .skeleton-message-content {
    display: flex;
    flex: 1;
    flex-direction: column;
}
.chat-skeleton .avatar-skeleton {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #515255 20%, #535457 28%, #57595c 35%, #535457 42%, #515255 50%);
    background-size: 300% 100%;
    will-change: background-position;
    height: 24px;
    margin-right: 8px;
    width: 24px;
    border-radius: 50%;
}
.chat-skeleton .skeleton-dashes {
    display: flex;
    justify-content: inherit;
    width: 100%;
}
.chat-skeleton .skeleton-dashes .skeleton-dash:first-child {
    margin-right: 8px;
}
.chat-skeleton .skeleton-dash {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #515255 20%, #535457 28%, #57595c 35%, #535457 42%, #515255 50%);
    background-size: 300% 100%;
    will-change: background-position;
    border-radius: 37px;
    height: 6px;
}
.chat-skeleton .skeleton-line:not(:first-child) {
    margin-top: 8px;
}
.messenger-chat-header {
    background-color: #232325;
    border: 1px solid #515151;
    border-radius: 8px 8px 0 0;
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    user-select: none;
}
.messenger-chat-header--fixed {
    bottom: calc(100% - 62px);
    left: 0;
    position: fixed;
    right: 0;
    z-index: 1;
}
.messenger-chat-header__content {
    align-items: center;
    display: flex;
    overflow: hidden;
    padding: 5px 8px;
}
@media (max-width: 639px) {
    .messenger-chat-header__content {
        padding: 14px 16px;
    }
}
.messenger-chat-header__placeholder {
    height: 62px;
}
.messenger-chat-header__name .displayname__name {
    max-width: 170px;
}
.messenger-chat-header__left-block {
    align-items: center;
    display: flex;
    flex-grow: 1;
    flex-shrink: 0;
}
.messenger-chat-header .avatar-wrapper {
    height: 32px;
    margin-right: 11px;
    position: relative;
    width: 32px;
}
.messenger-chat-header .avatar-wrapper .online {
    background: #232325;
    height: 8px;
    left: -2px;
    top: -2px;
    width: 8px;
}
.messenger-chat-header .back-to-messenger-button {
    margin-right: 14px;
}
.messenger-chat-header .back-to-messenger-button:hover {
    background: rgba(248, 248, 248, 0.1);
    opacity: 1;
}
.messenger-chat-header .back-to-messenger-button,
.messenger-chat-header .header-button,
.messenger-chat-header .more-button {
    border-radius: 2px;
    height: 24px;
    width: 24px;
    opacity: 0.5;
}
.messenger-chat-header .header-button:hover {
    background: rgba(248, 248, 248, 0.1);
    opacity: 0.7;
}
.messenger-chat-header .more-button {
    margin-left: 8px;
}
.messenger-chat-header .more-button:hover {
    background: rgba(248, 248, 248, 0.1);
}
.messenger-chat-header .more-icon {
    color: #fff;
}
.messenger-chat-header .unread-messages {
    background-color: var(--primary-light);
    border-radius: 50%;
    height: 8px;
    margin: 0 6px;
    width: 8px;
}
.messenger-chat-header .header-icon {
    color: #fff;
    margin: 0;
}
.messenger-chat-header .collapse-button {
    margin-right: 10px;
    opacity: 0.5;
    transition: opacity 200ms;
}
@media (max-width: 639px) {
    .messenger-chat-header .collapse-button {
        display: none;
    }
}
.messenger-chat-header .collapse-button .hidden {
    opacity: 0;
}
.messenger-chat-header .collapse-icon {
    height: 24px;
    width: 24px;
}
.messenger-chat-header .close-icon {
    height: 20px;
    width: 20px;
}
.notifications-tooltip-content {
    width: 100%;
}
.notifications-tooltip-content .visible-wrapper {
    background-color: #1b1b1d;
    border-radius: 12px;
    box-shadow: 0 0 13px rgba(0, 0, 0, 0.45);
    color: #fff;
    padding: 0 20px;
    position: relative;
    width: 100%;
}
.notifications-tooltip-content.expanded .visible-wrapper {
    transform: none;
}
.notifications-tooltip-content .close {
    align-items: center;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    display: flex;
    height: 30px;
    justify-content: center;
    position: absolute;
    right: 0;
    top: 0;
    width: 30px;
}
.notifications-tooltip-content .close:hover {
    color: rgba(255, 255, 255, 0.8);
}
.notifications-tooltip-content .close .icon {
    height: 10px;
    margin: 0;
    width: 10px;
}
.notifications-tooltip-content .main-settings {
    align-items: center;
    display: flex;
    padding: 20px 0;
}
.notifications-tooltip-content .bell {
    align-items: center;
    background-color: rgba(255, 255, 255, 0.09);
    border-radius: 26px;
    display: flex;
    flex-shrink: 0;
    height: 52px;
    justify-content: center;
    margin-right: 14px;
    width: 52px;
}
.notifications-tooltip-content .bell .icon {
    color: rgba(255, 255, 255, 0.6);
    height: 24px;
    margin: 0;
    width: 24px;
}
.notifications-tooltip-content .notifications-tooltip-title {
    flex-grow: 1;
    font-size: 14px;
    line-height: 17px;
    margin-right: 10px;
    min-width: 0;
}
.notifications-tooltip-content .main-switcher {
    flex-shrink: 0;
    margin: 0;
}
.notifications-tooltip-content.active .bell {
    background-color: rgba(163, 73, 252, 0.16);
}
.notifications-tooltip-content.active .bell .icon {
    color: #f59e0b;
}
.notifications-tooltip-content .methods-wrapper {
    height: 0;
    overflow: hidden;
    transition: height 0.25s ease-in-out;
}
.notifications-tooltip-content .methods {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    opacity: 0;
    padding: 20px 0;
    transform: translateY(-100%);
    transition: transform 0.25s ease-in-out, opacity 0.25s ease-in-out;
}
.notifications-tooltip-content.expanding .methods-wrapper .methods {
    opacity: 1;
    transform: translateY(0);
}
.notifications-tooltip-content.expanded .methods-wrapper {
    height: auto !important;
}
.notifications-tooltip-content.expanded .methods-wrapper .methods {
    opacity: 1;
    transform: none !important;
}
.notifications-tooltip-content .methods-title {
    display: block;
    font-size: 18px;
    font-weight: 700;
    line-height: 22px;
    margin-bottom: 20px;
}
.notifications-tooltip-content .method {
    align-items: center;
    display: flex;
    font-size: 14px;
    justify-content: space-between;
    line-height: 17px;
}
.notifications-tooltip-content .method:not(:last-child) {
    margin-bottom: 14px;
}
.notifications-tooltip-content .connect-link {
    color: inherit;
    display: inline-block;
    font-size: 14px;
    line-height: 22px;
    opacity: 0.6;
    text-decoration: underline;
}
.notifications-tooltip-content .connect-link:hover,
.notifications-tooltip-warning-hint a:hover {
    opacity: 0.8;
}
.notifications-tooltip-warning-hint {
    color: rgba(255, 255, 255, 0.6);
    margin-left: 5px;
}
.notifications-tooltip-warning-hint a {
    color: inherit;
    text-decoration: underline;
}
.notifications-tooltip-warning-hint .icon-exclamation-circle {
    height: 13px;
    transform: translateY(-1px);
    width: 13px;
}
.notifications-tooltip-content.mobile .visible-wrapper {
    border-radius: 0;
    box-shadow: none;
    padding: 0 12px;
}
.notifications-tooltip-content.mobile::before {
    border-bottom: 6px solid #1b1b1d;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    bottom: 100%;
    content: "";
    display: block;
    height: 6px;
    left: 27px;
    position: absolute;
    width: 14px;
}
.notifications-tooltip-content.mobile .close {
    right: 5px;
    top: 15px;
}
.notifications-tooltip-content.mobile .main-settings {
    padding: 10px 34px 10px 0;
}
.notifications-tooltip-content.mobile .bell {
    height: 40px;
    margin-right: 12px;
    width: 40px;
}
.notifications-tooltip-content.mobile .bell .icon {
    height: 18px;
    width: 18px;
}
.notifications-tooltip-content.mobile .notifications-tooltip-title {
    font-size: 12px;
    line-height: 15px;
    margin-right: 10px;
}
.notifications-tooltip-content.mobile .methods {
    padding: 10px 0;
}
.notifications-tooltip-content.mobile .methods-title {
    font-size: 15px;
    line-height: 18px;
    margin-bottom: 12px;
}
.notifications-tooltip-content.mobile .method {
    font-size: 12px;
    line-height: 15px;
}
.notifications-tooltip-content.mobile .method:not(:last-child) {
    margin-bottom: 12px;
}
.notifications-tooltip-content.mobile .connect-link {
    font-size: 12px;
}
.tooltip.left .notifications-tooltip-content.preserve-vertical-position,
.tooltip.right .notifications-tooltip-content.preserve-vertical-position {
    height: 800px;
    padding-top: 355px;
    pointer-events: none;
}
.tooltip.left .notifications-tooltip-content.preserve-vertical-position .visible-wrapper,
.tooltip.right .notifications-tooltip-content.preserve-vertical-position .visible-wrapper {
    pointer-events: auto;
}
.notifications-tooltip-content-compact {
    align-items: center;
    background: rgba(5, 5, 6, 0.4);
    border-radius: 12px;
    display: flex;
    font-size: 12px;
    line-height: 14px;
    padding: 8px 12px;
    position: absolute;
}
.notifications-tooltip-content-compact--position--top {
    bottom: calc(100% + 16px);
    left: 0;
}
.notifications-tooltip-content-compact--position--right {
    left: 100%;
    margin: 0 0 0 12px;
    top: 0;
}
.notifications-tooltip-content-compact__text {
    margin: 0 0 0 12px;
    white-space: nowrap;
}
.bq {
    height: 112px;
    margin: 0 0 48px;
    max-width: calc(100vw - 32px);
    overflow: hidden;
    width: 100%;
}
.bq .scroll-bar-container__arrow {
    margin-top: -20px;
}
.bq--style--mobile {
    height: 82px;
    margin: 0 0 40px;
}
.bq--style--pinned {
    height: 116px;
    margin: 40px 0 0;
}
.bq--style--pinned .scroll-bar-container__arrow {
    margin-top: -8px;
}
.bq--style--pinned .avatar__img,
.bq--style--pinned-mobile .avatar__img {
    background-position: center top;
}
.bq--style--pinned-mobile {
    height: 82px;
    margin: 40px 0 0;
}
.bq__title {
    color: #a0a0a1;
    font-size: 11px;
    margin: 0 0 8px;
    text-transform: uppercase;
}
.bq__controls {
    display: flex;
    gap: 1px;
}
.bq__add {
    align-items: center;
    background: #111113;
    color: #a0a0a1;
    column-gap: 10px;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-size: 14px;
    height: 80px;
    justify-content: center;
    max-height: 100%;
    transition: background 0.3s;
    border-bottom-left-radius: 26px;
    border-top-left-radius: 26px;
}
.bq__add:hover,
.bq__archive:hover {
    background: #1b1b1d;
}
.bq__add--rounded {
    border-radius: 26px;
}
.bq__archive {
    align-items: center;
    background: #111113;
    color: #a0a0a1;
    column-gap: 10px;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-size: 14px;
    height: 80px;
    justify-content: center;
    max-height: 100%;
    transition: background 0.3s;
    border-bottom-right-radius: 26px;
    border-top-right-radius: 26px;
}
.bq__list {
    display: flex;
    gap: 12px;
    padding-bottom: 12px;
}
.bq__item {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 92px;
    min-width: 92px;
    overflow: hidden;
    padding: 6px 0;
    position: relative;
    width: 92px;
}
.bq__item .avatar {
    cursor: pointer;
}
.bq__item--mobile {
    min-height: 56px;
    min-width: 56px;
    width: 56px;
}
.bq__thumb-avatar {
    align-items: center;
    background: #111113;
    border-radius: 30.75%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    justify-content: center;
    transition: background 0.3s;
}
.bq__thumb-avatar:hover {
    background: #1b1b1d;
}
.bq__name {
    font-size: 12px;
    margin: 10px 0 0;
    text-align: center;
    width: 100%;
}
.bq__name .displayname {
    display: block;
}
.bq__icon {
    color: #fff;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.scroll-to-top-button-wrapper {
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    z-index: 5;
}
.scroll-to-top-button-wrapper.stick-to-bottom {
    bottom: -60px;
    position: absolute;
    right: -10px;
}
.scroll-to-top-button-wrapper__page-width-wrapper {
    display: flex;
    justify-content: flex-end;
    margin: 0 auto;
    max-width: 1388px;
}
.scroll-to-top-button-wrapper__scroll-to-top-button {
    bottom: 60px;
    position: absolute;
}
.scroll-to-top-button-wrapper__scroll-to-top-button:hover {
    opacity: 0.8;
}
@media screen and (max-width: 1599px) {
    .scroll-to-top-button-wrapper__scroll-to-top-button {
        right: 20px;
    }
}
@media screen and (max-width: 639px) {
    .scroll-to-top-button-wrapper__scroll-to-top-button {
        bottom: 20px;
    }
}
@media screen and (max-width: 479px) {
    .scroll-to-top-button-wrapper__scroll-to-top-button {
        bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom) + 16px);
    }
}
.scroll-to-top-button-wrapper__scroll-to-top-button-icon {
    color: #646464;
    fill: currentColor;
    height: 50px;
    width: 50px;
}
.conversation-skeleton {
    align-items: center;
    display: flex;
    flex-flow: row nowrap;
    padding: 12px;
}
.conversation-skeleton-content {
    display: flex;
    flex-flow: column nowrap;
}
.conversation-skeleton-avatar,
.conversation-skeleton-message,
.conversation-skeleton-username {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #515255 20%, #535457 28%, #57595c 35%, #535457 42%, #515255 50%);
    background-size: 300% 100%;
    will-change: background-position;
}
.conversation-skeleton-avatar {
    border-radius: 50%;
    height: 44px;
    width: 44px;
    margin-right: 12px;
}
.conversation-skeleton-message,
.conversation-skeleton-username {
    border-radius: 4px;
    height: 8px;
}
.conversation-skeleton-username {
    width: 171px;
    margin-bottom: 15px;
}
.conversation-skeleton-message {
    width: 247px;
}
.conversations-skeleton {
    margin-bottom: auto;
    padding: 0 8px;
}
.picture-squad-grid {
    column-gap: 12px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 12px;
}
@media screen and (min-width: 480px) {
    .picture-squad-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (min-width: 640px) {
    .picture-squad-grid {
        column-gap: 20px;
        grid-template-columns: repeat(4, 1fr);
        row-gap: 20px;
    }
}
@media screen and (min-width: 1366px) {
    .picture-squad-grid {
        grid-template-columns: repeat(6, 1fr);
    }
}
.picture-squad-grid--columns--2 {
    column-gap: 10px;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 10px;
}
.picture-squad-grid--columns--3 {
    column-gap: 10px;
    grid-template-columns: repeat(3, 1fr);
    row-gap: 10px;
}
.picture-squad-grid--columns--4 {
    grid-template-columns: repeat(4, 1fr);
}
.picture-squad-grid--columns--5 {
    grid-template-columns: repeat(5, 1fr);
}
.picture-squad-grid--columns--6 {
    grid-template-columns: repeat(6, 1fr);
}
.picture-squad-grid__skeleton-item {
    background: #343437;
    border-radius: 18px;
    padding-top: 100%;
}
.c7__title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
}
.c7__sub-title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    margin: 32px 20px 20px;
}
.c7__see-all-button {
    align-items: center;
    display: flex;
    gap: 16px;
}
.c7__notification-list {
    margin: 0 0 0-78px;
}
.button-dropdown {
    position: relative;
    z-index: 1;
}
.button-dropdown__button {
    align-items: center;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    height: 40px;
    justify-content: center;
    padding: 0 20px;
    width: 100%;
}
.button-dropdown__button--style--default {
    background: 0 0;
    border: 2px solid #343437;
}
.button-dropdown__button--style--primary {
    background: #2e1d3e;
    border: 0;
}
.button-dropdown__button--style--apply {
    background: #d97706;
    border: 0;
}
.button-dropdown__button--style--dark-blue {
    background: #2a244b;
    border: 0;
}
.button-dropdown__arrow {
    color: #f8f8f8;
    height: 20px;
    margin: 0 0 0 12px;
    opacity: 0.6;
    transform: rotate(180deg);
    transition: transform 0.3s;
    width: 20px;
}
.button-dropdown__arrow--opened {
    transform: rotate(0deg);
}
.button-dropdown__content {
    background: #232325;
    border-radius: 12px;
    left: 0;
    margin: 30px 0 0 0;
    padding: 10px 15px;
    position: absolute;
    top: 100%;
    left:-15px;
}
.css-tooltip-bottom,
.css-tooltip-left,
.css-tooltip-right,
.css-tooltip-top {
    display: inline-block;
    position: relative;
}
.css-tooltip-top::after {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;
    color: #000;
    content: attr(data-tooltip);
    opacity: 0;
    padding: 8px 10px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    text-transform: none;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    white-space: nowrap;
    z-index: 1000;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    left: 50%;
    top: 0;
    transform: translate(-50%, calc(-100% - 5px + 10px - 0px));
}
@media (prefers-reduced-motion) {
    .css-tooltip-top::after {
        transition-property: opacity;
    }
}
.css-tooltip-top::before {
    border-style: solid;
    border-width: 5px;
    content: "";
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1001;
    border-color: #fff transparent transparent;
    left: 50%;
    margin-left: -5px;
    top: -5px;
    transform: translateY(calc(10px - 0px));
}
@media (prefers-reduced-motion) {
    .css-tooltip-top::before {
        transition-property: opacity;
    }
}
.css-tooltip-top:hover::before {
    opacity: 1;
    transform: translateY(0);
}
.css-tooltip-top:hover::after {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, calc(-100% - 5px - 0px));
}
.css-tooltip-bottom::after {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;
    color: #000;
    content: attr(data-tooltip);
    opacity: 0;
    padding: 8px 10px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    text-transform: none;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    white-space: nowrap;
    z-index: 1000;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, calc(100% + 5px - 10px + 0px));
}
@media (prefers-reduced-motion) {
    .css-tooltip-bottom::after {
        transition-property: opacity;
    }
}
.css-tooltip-bottom::before {
    border-style: solid;
    border-width: 5px;
    content: "";
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1001;
    border-color: transparent transparent #fff;
    bottom: -5px;
    left: 50%;
    margin-left: -5px;
    transform: translateY(calc(-10px + 0px));
}
@media (prefers-reduced-motion) {
    .css-tooltip-bottom::before {
        transition-property: opacity;
    }
}
.css-tooltip-bottom:hover::before {
    opacity: 1;
    transform: translateY(0);
}
.css-tooltip-bottom:hover::after {
    opacity: 1;
    pointer-events: auto;
    transform: translate(-50%, calc(100% + 5px + 0px));
}
.css-tooltip-left::after {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;
    color: #000;
    content: attr(data-tooltip);
    opacity: 0;
    padding: 8px 10px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    text-transform: none;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    white-space: nowrap;
    z-index: 1000;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    left: 0;
    top: 50%;
    transform: translate(calc(-100% - 5px + 10px - 0px), -50%);
}
@media (prefers-reduced-motion) {
    .css-tooltip-left::after {
        transition-property: opacity;
    }
}
.css-tooltip-left::before {
    border-style: solid;
    border-width: 5px;
    content: "";
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1001;
    border-color: transparent transparent transparent #fff;
    left: -5px;
    margin-top: -5px;
    top: 50%;
    transform: translateX(calc(10px - 0px));
}
@media (prefers-reduced-motion) {
    .css-tooltip-left::before {
        transition-property: opacity;
    }
}
.css-tooltip-left:hover::before {
    opacity: 1;
    transform: translateX(0);
}
.css-tooltip-left:hover::after {
    opacity: 1;
    pointer-events: auto;
    transform: translate(calc(-100% - 5px - 0px), -50%);
}
.css-tooltip-right::after {
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 2px 4px transparent, 0 0 4px transparent;
    color: #000;
    content: attr(data-tooltip);
    opacity: 0;
    padding: 8px 10px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    text-transform: none;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    white-space: nowrap;
    z-index: 1000;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    right: 0;
    top: 50%;
    transform: translate(calc(100% + 5px - 10px + 0px), -50%);
}
@media (prefers-reduced-motion) {
    .css-tooltip-right::after {
        transition-property: opacity;
    }
}
.css-tooltip-right::before {
    border-style: solid;
    border-width: 5px;
    content: "";
    opacity: 0;
    pointer-events: none;
    position: absolute;
    transition-duration: 0.15s;
    transition-property: opacity, transform;
    transition-timing-function: ease-in-out;
    z-index: 1001;
    border-color: transparent #fff transparent transparent;
    margin-top: -5px;
    right: -5px;
    top: 50%;
    transform: translateX(calc(-10px + 0px));
}
@media (prefers-reduced-motion) {
    .css-tooltip-right::before {
        transition-property: opacity;
    }
}
.css-tooltip-right:hover::before {
    opacity: 1;
    transform: translateX(0);
}
.css-tooltip-right:hover::after {
    opacity: 1;
    pointer-events: auto;
    transform: translate(calc(100% + 5px + 0px), -50%);
}
.pp {
    align-items: stretch;
    color: #fff;
    display: flex;
    min-height: 64px;
    padding: 14px 140px 14px 46px;
    position: absolute;
    top: 0;
    transition: min-height 150ms linear;
    width: 100%;
    z-index: 4;
}
.p--relative {
    position: relative;
}
.p--type--info {
    background: #424248;
}
.p--type--warning {
    background: #d6a100;
}
.p--type--moderation {
    background: #fccf49;
    color: #000;
    min-height: 46px;
    position: relative;
}
.p--type--moderation .p__icon {
    top: 50%;
}
.p--type--error {
    background: #e12947;
    color: #cfcfd0;
}
.pp a,
.p--type--error .p__icon {
    color: #fff;
}
.pp__icon {
    height: 26px;
    left: 12px;
    position: absolute;
    top: 32px;
    transform: translateY(-50%);
    width: 26px;
}
.p__icon.icon-blocked,
.p__icon.icon-wrong {
    height: 20px;
    width: 20px;
}
.p__icon--red {
    color: #ef7d00;
}
.p__content {
    align-self: center;
    line-height: 17px;
    position: relative;
}
.p__button {
    position: absolute;
    right: 12px;
}
.p__text-expander {
    color: #fff;
}
.p__group {
    position: absolute;
    top: 0;
    width: 100%;
}
@media screen and (max-width: 374px) {
    .p__icon {
        display: none;
    }
    .p__content {
        line-height: 17px;
        padding: 6px 120px 6px 10px;
    }
}
.tile {
    max-width: 100%;
}
@media screen and (max-width: 639px) {
    .tile {
        border-radius: 0;
    }
}
.tile .media-content {
    cursor: pointer;
    height: 560px;
    margin-top: 14px;
    position: relative;
}
@media screen and (max-width: 639px) {
    .tile .media-content {
        height: 290px;
    }
    .tile .tile-footer::after {
        left: 14px;
        right: 14px;
    }
    .tile .tile-footer,
    .tile .tile-header {
        padding: 0 14px 20px;
    }
}

/*
.bl {
    background: #1b1b1d;
    border-radius: 16px;
    display: grid;
    flex-direction: column;
    height: 300px;
}
.bl__header {
    padding: 20px 20px 0;
}
.bl__title {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 20px 20px 0;
}
.bl__content {
    flex: 1;
    height: 200px;
    padding: 0 20px;
} */
.user-lists-stats__list-item {
    align-items: center;
    display: grid;
    gap: 12px;
    grid-auto-flow: column;
    justify-content: space-between;
    margin-bottom: 16px;
}
.user-lists-stats__list-item-left {
    align-items: center;
    display: grid;
    grid-auto-flow: column;
    grid-gap: 6px;
    justify-content: flex-start;
}
.user-lists-stats__list-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.user-lists-stats__list-icon {
    color: #a0a0a1;
    margin-right: 4px;
}
.user-lists-stats__list-icon--system {
    color: #f59e0b;
}
.textarea {
    display: block;
    position: relative;
    text-align: left;
}
.textarea__counter {
    background: #111113;
    bottom: 6px;
    color: #a0a0a1;
    font-size: 10px;
    pointer-events: none;
    position: absolute;
    right: 6px;
}
.textarea__counter.error-message {
    font-size: 10px;
}
.textarea__field {
    background: #111113;
    border: 1px solid transparent;
    border-radius: 12px;
    color: #fff;
    display: block;
    width: 100%;
}
.textarea__field:focus {
    border-color: #f59e0b;
}
.textarea__field--hide-focus-placeholder:focus + .textarea__placeholder {
    display: none;
}

.textarea__field--size--small {
    min-height: 80px;
    padding: 15px 15px 25px;
}
.textarea__field--size--small-x {
    font-size: 13px;
    min-height: 60px;
    padding: 10px 15px 25px;
}
.textarea__field--size--regular {
    min-height: 140px;
    padding: 15px 15px 25px;
}
.textarea__placeholder {
    font-size: 13px;
    left: 0;
    opacity: 0.6;
    padding: 15px;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}
.textarea__placeholder--size--small {
    padding: 15px;
}
.textarea__placeholder--size--small-x {
    font-size: 12px;
    padding: 10px 15px;
}
.alert,
.alert-content {
    align-items: center;
    display: flex;
    width: 100%;
}
.alert {
    font-size: 16px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
    color: #f8f8f8;
    padding: 15px;
}
.alert-content {
    justify-content: center;
}
.alert-content-closable {
    margin-left: 23px;
}
.alert-content-left-align {
    justify-content: flex-start;
}
.alert-success {
    background: #21b062;
}
.alert-error {
    background-color: #ef7d00;
}
.alert-info {
    background-color: #4b6a73;
}
.alert-close-icon.alert-close-icon {
    color: rgba(248, 248, 248, 0.5);
    margin: -9px -9px -9px 0;
}
.alert-close-icon.alert-close-icon:hover {
    color: #f8f8f8;
}
.q {
    display: grid;
    gap: 10px;
    grid-template-columns: 2.5fr 1fr;
    grid-template-rows: repeat(2, 1fr);
    height: 360px;
}
.q__item {
    align-items: center;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: relative;
}
.q__item--main {
    grid-row: 2 span;
}
.q__img {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%;
}
.q__shadow {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.q__join,
.q__lock {
    align-items: center;
    display: flex;
    flex-direction: column;
    position: relative;
}
.q__lock {
    color: rgba(255, 255, 255, 0.6);
    font-size: 14px;
    gap: 6px;
}
.q__join {
    color: rgba(255, 255, 255, 0.8);
    gap: 16px;
    text-align: center;
    z-index: 1;
}
.q__view-button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    display: flex;
    font-size: 12px;
    gap: 6px;
    padding: 0;
    transition: color 0.3s;
}
.q__view-button:hover {
    color: #cfcfd0;
}
.tile-content-info {
    color: #fff;
    display: flex;
    margin: 12px 0;
    padding: 0;
}
.tile-content-info .info-icon {
    fill: currentColor;
    height: 32px;
    margin-right: 12px;
    width: 32px;
}
.tile-content-info .title {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 1.2;
}
.tile-content-info .description {
    font-size: 13px;
    font-weight: 400;
    letter-spacing: normal;
    line-height: normal;
    margin-top: 2px;
    opacity: 0.6;
}
.tile-footer::after {
    background: rgba(255, 255, 255, 0.1);
    bottom: 0;
    content: "";
    height: 1px;
    left: 0;
    position: absolute;
    right: 0;
}
.tile-footer .content {
    align-items: center;
    border: 0;
    flex-flow: row nowrap;
    justify-content: space-between;
    padding: 14px 0;
}
.tile-footer .content,
.tile-footer .left-wrapper,
.tile-footer .right-wrapper {
    column-gap: 10px;
    display: flex;
}
.tile-footer .right-wrapper {
    align-items: center;
}
.tile-footer .likes-counter {
    position: relative;
}
.tile-footer .likes-counter:before {
    content: "";
    height: 40px;
    left: 50%;
    min-width: 100%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 40px;
}
.tile-footer__bookmark {
    align-items: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    min-width: 36px;
    transition: background 0.3s;
    white-space: nowrap;
    width: 36px;
    -webkit-user-select: none;
    user-select: none;
}
.tile-footer__bookmark--disabled {
    opacity: 0.8;
    pointer-events: none;
}
.tile-footer__bookmark > .icon {
    height: 20px;
    margin: 0;
    width: 20px;
}
.tile-footer .a11y-button,
.tile-footer .tile-button,
.tile-footer .tile-footer__bookmark {
    background: #1b1b1d;
    border-radius: 11px;
    height: 38px;
    padding: 0 8px;
}
.tile-footer .a11y-button:hover,
.tile-footer .tile-button:hover,
.tile-footer .tile-footer__bookmark:hover {
    background: #343437;
}
.X {
    display: flex;
    margin-top: 12px;
    position: relative;
}
.X--highlighted::before {
    animation: animation-comment-highlighted 6s;
    background: rgba(255, 255, 255, 0.05);
    border-radius: 10px;
    bottom: -8px;
    content: "";
    left: -12px;
    position: absolute;
    right: 0;
    top: -12px;
}
.X__left {
    position: relative;
    width: 24px;
}
.X__right {
    flex-grow: 1;
    overflow: hidden;
    padding: 0 0 0 12px;
    position: relative;
}
.X__name {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    max-width: calc(100% - 32px);
}
.X__username {
    max-width: 100%;
}
.X__date {
    color: #707071;
    font-size: 12px;
    line-height: 15px;
}
.X__content {
    color: #a4a4a4;
    font-size: 13px;
    line-height: 18px;
    margin: 6px 0 8px;
    white-space: pre-wrap;
}
.X__content-deleted {
    align-items: center;
    background: #111113;
    border-radius: 5px;
    color: #a0a0a1;
    display: flex;
    gap: 6px;
    justify-content: center;
    margin: 12px 0 8px;
    min-height: 30px;
    padding: 4px 16px;
}
.X__footer {
    align-items: center;
    display: flex;
    gap: 8px;
}
.X__reply {
    color: #a0a0a1;
    cursor: pointer;
    font-size: 12px;
    line-height: 15px;
}
.X__reply:hover {
    color: #cfcfd0;
}
.X__reply-loader {
    color: #a0a0a1;
    left: 30px;
    pointer-events: none;
    position: absolute;
    top: 0;
}
.X__reply-view {
    align-items: center;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    margin: 12px 0;
    position: relative;
}
.X__reply-view--loading {
    color: transparent;
    pointer-events: none;
}
.X__reply-view::before {
    background: #424248;
    content: "";
    height: 1px;
    margin: 0 10px 0 0;
    width: 20px;
}
.X__menu {
    position: absolute;
    right: 0;
    top: 0;
}
.X__menu .icon-three-dots {
    color: #707071;
}
.X .icon-heart {
    color: #a0a0a1;
}
.r {
    border-radius: 0 0 12px 12px;
    overflow: hidden;
    position: relative;
}
.r--clickable {
    cursor: pointer;
}
.r--locked .image-swiper__points {
    background: 0 0;
}
.r__label {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    color: #cfcfd0;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    height: 24px;
    padding: 0 8px;
    pointer-events: none;
    position: absolute;
    right: 12px;
    z-index: 2;
}
.r__label--top {
    top: 12px;
}
.r__label--bottom {
    bottom: 12px;
}
.r__blur {
    background-size: 0;
    bottom: 0;
    contain: strict;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}
.r__blur::after,
.r__blur::before {
    background-image: inherit;
    background-repeat: no-repeat;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.r__blur::before {
    background-size: cover;
    filter: blur(16px);
    transform: scale(1.2);
}
.r__blur::after {
    background-position: center;
    background-size: contain;
}
.r__tagged-users-count-badge {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    bottom: 16px;
    color: #cfcfd0;
    display: flex;
    flex-wrap: nowrap;
    font-size: 14px;
    font-weight: 700;
    gap: 8px;
    left: 16px;
    padding: 4px 8px;
    pointer-events: none;
    position: absolute;
    z-index: 2;
}
.bi {
    align-items: center;
    background: #111113;
    border-radius: 12px;
    display: flex;
    gap: 20px;
    min-height: 40px;
    padding: 6px 20px;
}

.bd {
    left: -2px;
    margin: 6px 0 0;
    position: absolute;
    right: -2px;
    top: 100%;
}
.bd--landing {
    z-index: 11;
}
.bd--compact {
    left: 0;
    margin: 2px 0 0;
    right: 0;
}
.bd__empty {
    color: #707071;
    font-size: 13px;
    font-weight: 500;
    line-height: 16px;
    margin: 20px 0;
    text-align: center;
}
.bd__sub-title {
    color: #707071;
    font-size: 11px;
    margin: 20px 16px 10px;
    text-transform: uppercase;
}
.bd__title-link {
    text-transform: none;
}
.bd__button {
    margin: 0 10px 10px;
    width: calc(100% - 20px);
}
.bd__verify {
    align-items: center;
    background: #232325;
    border-radius: 10px;
    display: flex;
    gap: 12px;
    margin: 20px 16px;
    padding: 8px 12px;
}

.bddd {
    border-radius: 18px;
    overflow: hidden;
    padding-top: 100%;
    position: relative;
    transform: translateZ(0);
    transition: opacity 0.3s;
}
.bddd--shadow::after {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.65) 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.bddd--locked {
    background: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%) no-repeat center;
    background-size: cover;
}
.bddd--locked:hover {
    background-image: linear-gradient(246.82deg, #281f4d 0, #0d071e 100%);
}
.bddd--clickable {
    cursor: pointer;
}
.bddd--disabled {
    opacity: 0.6;
    pointer-events: none;
}
.bddd__image {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    transform: scale(1.01);
    transition: transform 0.3s;
    width: 100%;
}
.bddd--with-zoom:hover > .bd__image {
    transform: scale(1.1);
}
.bddd__content {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.sS {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 10px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 60%;
}
@media screen and (max-width: 1023px) {
    .s--style--album {
        flex-direction: row;
        justify-content: center;
        top: 30%;
        width: 80%;
    }
    .s--style--album .s__label {
        max-width: 98px;
        text-align: left;
    }
}
@media screen and (max-width: 639px) {
    .s--style--album {
        flex-direction: column;
        top: 50%;
        width: 60%;
    }
    .s--style--album .s__label {
        max-width: 120px;
        text-align: center;
        white-space: normal;
    }
}
.s__label {
    color: #fff;
    font-size: 14px;
    font-weight: 400;
    max-width: 120px;
    text-align: center;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.2), 0 1px 20px rgba(0, 0, 0, 0.4);
}
@media screen and (max-width: 639px) {
    .s__label {
        font-size: 12px;
    }
}
.s__icon {
    color: #fff;
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));
    height: 32px;
    width: 32px;
}
@media screen and (max-width: 1023px) {
    .s__icon {
        height: 24px;
        width: 24px;
    }
}
.s__avatar {
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.2));
}
.s__avatar.avatar {
    height: 48px;
    width: 48px;
}
@media screen and (max-width: 639px) {
    .s__avatar.avatar {
        height: 36px;
        width: 36px;
    }
}
.s__avatar--adaptive.avatar {
    height: 64px;
    width: 64px;
}
@media (max-width: 639px) {
    .s__avatar--adaptive.avatar {
        height: 48px;
        width: 48px;
    }
}
@media (max-width: 479px) {
    .s__avatar--adaptive.avatar {
        height: 36px;
        width: 36px;
    }
}
.settings-island-checkbox__switcher {
    display: flex;
    flex: 1;
    justify-content: flex-end;
}
.slidable-appearing-container-left,
.slidable-appearing-container-right {
    bottom: 0;
    position: absolute;
    top: 0;
    transition: transform ease 150ms;
}
.slidable-appearing-container-right {
    left: auto;
    right: 0;
}
.slidable-appearing-container-left {
    left: 0;
    right: auto;
}
.slidable {
    transition: transform ease 150ms;
}
.slidable.slidable-waiting-action {
    -webkit-user-select: none;
    user-select: none;
}
.header-search-result-item {
    margin: 6px 0;
}
.bKK {
    background: #1b1b1d;
    border-radius: 16px;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 16px;
    justify-content: space-between;
    overflow: hidden;
    padding: 85px 20px 20px;
    position: relative;
}
.bKK__info {
    background: #232325;
    border-radius: 10px;
    display: flex;
    justify-content: space-between;
    padding: 16px;
    position: relative;
    white-space: nowrap;
}
.bKK__info-left {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 70%;
    text-align: left;
}
.bKK__info-right {
    text-align: right;
}
.bKK__info-text {
    overflow: hidden;
    text-overflow: ellipsis;
}
.bKK__footer {
    display: flex;
    gap: 8px;
    justify-content: space-between;
}
.bN__tiles {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    min-width: 900px;
}
@media screen and (max-width: 1023px) {
    .bN__tiles {
        column-gap: 20px;
    }
}
.bN__skeleton {
    background: #111113;
    border-radius: 12px;
    flex: 1 0 284px;
    min-height: 128px;
    min-width: 284px;
}
.notifications-subscribed-common-table .menu-button-dots {
    margin-left: auto;
    width: 32px;
}
.notifications-subscribed-common-table .switcher.default {
    margin: 0 auto;
}
.image-swiper__root--disabled .m {
    pointer-events: none;
}
.mm {
    align-items: center;
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    padding: 20px 14px;
    position: absolute;
    text-align: center;
    top: 0;
    transform: none;
    width: 100%;
    z-index: 1;
}
.m--fill--locked {
    background: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%) no-repeat center;
    background-size: cover;
}
.m--fill--moderation {
    background-color: rgba(252, 207, 73, 0.8);
    color: #000;
}
.m--fill--rejected {
    background-color: rgba(210, 27, 76, 0.6);
    color: #cfcfd0;
}
.m--dark {
    background: rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 639px) {
    .mm {
        min-height: 135px;
        min-width: 135px;
    }
}
.m__icon--size--regular {
    height: 40px;
    width: 40px;
}
.m__icon--size--big {
    height: 58px;
    width: 58px;
}
.m__title {
    font-size: 16px;
    font-weight: 700;
    margin-top: 16px;
    padding: 0 12px;
    white-space: normal;
    word-break: normal;
}
@media screen and (max-width: 639px) {
    .m__title {
        font-size: 12px;
        font-weight: 400;
        letter-spacing: normal;
        line-height: normal;
        margin-top: 12px;
    }
}
.m__description {
    font-size: 13px;
    margin-top: 16px;
    max-width: 310px;
    padding: 0 12px;
    white-space: normal;
    word-break: normal;
}
.m .content-lock-button {
    margin: 20px 0 0;
}
@media screen and (max-width: 639px) {
    .m .content-lock-button {
        margin: 12px 0 0;
    }
}
.b9__message-body {
    min-height: 142px;
    position: relative;
}
.b9__message-body--with-media {
    height: 204px;
}
.b9__message-input {
    background: #111113;
    border: 1px solid transparent;
    border-radius: 12px;
    bottom: 0;
    height: 100%;
    left: 0;
    overflow-y: auto;
    position: absolute;
    right: 0;
    top: 0;
}
.b9__message-input:focus-within:not(.b9__message-input--error) {
    border: 1px solid #d97706;
}
.b9__message-input--error .chat-controls-input__wrapper {
    border-color: #fd3a5b;
}
.b9__message-input .chat-controls-input {
    height: 100%;
    margin: 0;
    min-height: 100px;
    padding-bottom: 10px;
}
.b9__message-input .chat-controls-input__wrapper {
    border: 0 !important;
}
.b9__media-list {
    background-color: red;
    height: 80px;
    margin: 0 10px;
}
.b9__input-actions {
    align-items: center;
    background: #111113;
    border-radius: 12px;
    bottom: 4px;
    display: flex;
    gap: 14px;
    justify-content: flex-end;
    padding: 2px 0 2px 6px;
    position: absolute;
    right: 4px;
}
.b9__counter {
    color: #a0a0a1;
    font-size: 14px;
    font-weight: 400;
}
.b9__counter--error-message {
    color: #fd3a5b;
}
.b9__upload-button-wrapper {
    height: 100%;
    opacity: 0.6;
}
.b9__upload-button-wrapper--disabled {
    cursor: default;
    opacity: 0.2;
}
.b9__upload-button-wrapper:hover:not(.b9__upload-button-wrapper--disabled) {
    opacity: 1;
}
.b9__upload-icon {
    height: 22px;
    width: 22px;
}
.b9__smiles-wrapper .smiles-dropdown .smiles-list {
    bottom: 40px;
    top: auto;
}
.b9__upload-file-wrapper {
    max-width: 100%;
    padding: 12px;
    width: 460px;
}
.b9__upload-file-wrapper .z {
    margin-top: 0;
}
.b9__active-checkbox {
    align-items: center;
    display: flex;
    justify-content: flex-start;
    margin-bottom: 20px;
}
.b9__checkbox-title {
    font-size: 14px;
    font-weight: 500;
}
.b9__error-message {
    color: #fd3a5b;
    font-size: 12px;
    font-weight: 400;
    line-height: 14px;
    margin-top: 2px;
}
@media screen and (max-width: 1023px) {
    .b9__message-body {
        height: 204px;
    }
}
@media screen and (max-width: 639px) {
    .b9__message-input .chat-controls-input--style--multy-line {
        min-height: 132px;
    }
}
.bPP {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    margin-bottom: 20px;
}
.bPP__tabs {
    border-radius: 10px;
    display: flex;
    flex: 1;
    max-width: 1140px;
}
.bPP__tabs .pill-control__item {
    width: 154px;
}
.b0 {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-width: 100%;
    width: 418px;
}
.b0__preview-title {
    font-size: 20px;
    margin: 0 0 10px;
}
.b0__preview-description {
    color: #cfcfd0;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    margin: 10px 0 20px;
}
.b0__chat {
    background: #232325;
    border-radius: 8px;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex: 1;
    flex-direction: column;
    width: 100%;
}
.b0__chat-header {
    align-items: center;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    gap: 8px;
    height: 44px;
    justify-content: flex-start;
    padding: 6px 8px;
}
.b0__chat-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    height: 304px;
    justify-content: flex-end;
    padding: 6px 8px;
}
.b0__chat-content .base-message {
    background-color: #f59e0b;
    max-width: 240px;
}
.b0__chat-content .base-message .Q__gallery {
    min-width: 240px;
}
.bU {
    margin-right: 8px;
    position: relative;
}
.bU__mobile-button {
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    opacity: 0;
    padding: 0;
    pointer-events: none;
}
.bU__mobile-button:hover {
    color: rgba(255, 255, 255, 0.8);
}
.bU__mobile-button--visible {
    opacity: 1;
    pointer-events: auto;
}
.bU__intervals {
    align-items: center;
    display: flex;
    justify-content: flex-end;
}
.bU__intervals--mobile {
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 10;
}
.bU__intervals-buttons {
    align-items: center;
    animation-duration: 150ms;
    animation-name: animate-slide;
    animation-timing-function: ease-in;
    display: flex;
    gap: 12px;
    height: 44px;
    justify-content: center;
    padding: 0 10px;
}
.bU__intervals-buttons--mobile {
    background: #1b1b1d;
    border-radius: 12px;
    box-shadow: 0 1px 10px rgba(0, 0, 0, 0.4);
}
.bU__dot {
    color: rgba(255, 255, 255, 0.2);
    font-size: 20px;
}
.bU__interval-button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    gap: 5px;
    padding: 0;
    white-space: nowrap;
}
.bU__interval-button--opened {
    color: rgba(255, 255, 255, 0.8);
}
.bU__dropdown-icon--opened {
    transform: rotate(180deg);
}
.bU .dropdown-content {
    padding: 4px 0;
}
.bU__dropdown-item {
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    gap: 12px;
    justify-content: space-between;
    min-width: 160px;
    padding: 10px 15px;
}
.bU__dropdown-item--active {
    pointer-events: none;
}
@media (hover: hover) {
    .bU__dropdown-item:hover {
        background: #232325;
    }
}
.u {
    min-height: 48px;
}
.u__wrapper {
    left: 0;
    right: 0;
}
.u__wrapper--sticky {
    bottom: calc(10px + var(--tap-bar-height));
    position: fixed;
    z-index: 2;
}
.u__wrapper--sticky .u__content {
    backdrop-filter: blur(3px);
    background: rgba(35, 35, 37, 0.6);
    border-radius: 12px;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);
    margin: 0 60px;
    min-height: 64px;
    width: 100%;
}
@media screen and (max-width: 1365px) {
    .u__wrapper--sticky .u__content {
        margin: 0;
    }
}
.u__row {
    display: flex;
    justify-content: center;
    margin: 0 auto;
    max-width: 1568px;
    width: 100%;
}
.u__content {
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    flex: 1;
    min-height: 48px;
    transition: bottom 0.2s;
    width: inherit;
}
.bX {
    background-color: #232325;
    border-radius: 12px;
    width: 50%;
    -webkit-user-select: none;
    user-select: none;
}
.bX--open .bX__icon-close {
    transform: rotate(180deg);
}
.bX__header {
    align-items: center;
    background: 0 0;
    border: 0;
    border-radius: 12px;
    color: #cfcfd0;
    cursor: pointer;
    display: flex;
    flex-flow: row nowrap;
    font-size: 15px;
    font-weight: 400;
    justify-content: center;
    padding: 14px 16px;
    width: 100%;
}
.bX__header:hover .bX__icon-close {
    fill: #fff;
}
.bX__icon {
    fill: rgba(255, 255, 255, 0.8);
}
.bX__title {
    font-size: 0.938rem;
    flex-grow: 1;
    font-weight: 400;
    margin: 0;
    text-align: start;
}
.bX__icon-exclamation {
    height: 21px;
    margin-right: 21px;
    width: 21px;
}
.bX__icon-close {
    margin: 0;
}
.bX__dropdown {
    font-size: 0.813rem;
    line-height: 1.25rem;
    color: rgba(255, 255, 255, 0.6);
    font-weight: 400;
    padding: 0 64px 1px;
}
.bX__list {
    list-style: disc;
    margin-bottom: 20px;
    margin-top: 0;
    padding-left: 12px;
}
.bX__list-item {
    margin-bottom: 15px;
}
.bX__list-item:last-child {
    margin-bottom: 0;
}
@media screen and (max-width: 1365px) {
    .bX {
        width: 100%;
    }
    .bX__dropdown,
    .bX__header {
        padding-right: 21px;
    }
}
.creators-onboarding-item {
    align-items: center;
    background-color: #232325;
    border-radius: 10px;
    display: flex;
    flex: 1;
    gap: 16px;
    justify-content: space-between;
    padding: 16px;
    width: 100%;
}
.creators-onboarding-item:first-child {
    margin-top: 10px;
}
.creators-onboarding-item:last-child {
    margin-bottom: 10px;
}
.creators-onboarding-item__left-part {
    display: grid;
    flex: 1;
    grid-auto-flow: row;
    grid-row-gap: 4px;
}
.creators-onboarding-item__right-part {
    align-items: center;
    display: flex;
    justify-content: flex-end;
}
.creators-onboarding-item__title {
    align-items: center;
    display: flex;
    justify-content: flex-start;
}
.creators-onboarding-item__option-badge {
    background-color: #343437;
    border-radius: 6px;
    color: #fff;
    margin-left: 8px;
    padding: 2px 8px;
    pointer-events: none;
}
.creators-onboarding-item__completed-icon {
    color: #21b062;
}
.teaser-banner {
    background: url(/assets/common/images/teaser-bg.svg), radial-gradient(146.3% 146.3%at 50%0, #994cfa 0, rgba(82, 0, 133, 0.6) 35.41%, transparent 100%);
    background-size: cover, auto;
    border-radius: 12px;
    max-width: calc(100vw - 32px);
    overflow: hidden;
    padding: 16px 20px 20px;
    text-align: center;
    width: 100%;
}
.teaser-banner__title {
    color: #f9d400;
    font-size: 20px;
    font-weight: 700;
    line-height: 24px;
    margin: 8px 0 12px;
}
.teaser-banner__description {
    color: #a0a0a1;
    font-size: 15px;
    line-height: 22px;
    margin: 0 0 20px;
}
.post-edit-preview-header {
    display: flex;
}
.post-edit-preview-header__image {
    background-color: #000;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px;
    height: 60px;
    position: relative;
    width: 60px;
}
.post-edit-preview-header__image--pointer {
    cursor: pointer;
}
.post-edit-preview-header__media-counter {
    background: #424248;
    border: 3px solid #1b1b1d;
    border-radius: 13px;
    color: #cfcfd0;
    display: grid;
    font-size: 12px;
    height: 26px;
    min-width: 26px;
    overflow: hidden;
    padding: 0 4px;
    place-items: center;
    pointer-events: none;
    position: absolute;
    right: -6px;
    top: -8px;
}
.post-edit-preview-header__loading {
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
}
.post-edit-preview-header__body-wrapper {
    flex: 1;
    position: relative;
}
.cP {
    align-items: center;
    animation: opacity-fade-show-modal-strict 0.5s;
    border-radius: 60px;
    display: flex;
    height: 48px;
    justify-content: center;
    min-width: 60px;
    padding: 0 20px;
    position: relative;
    transition: background 0.3s;
    -webkit-user-select: auto;
    user-select: auto;
}
.cP--draggable {
    cursor: grab;
}
.cP--draggable::before {
    background: rgba(0, 0, 0, 0.1);
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.cP--draggable:hover::before {
    opacity: 1;
}
.cP--dark-select ::selection {
    background: #f59e0b;
}
.cP__count {
    bottom: 3px;
    font-size: 10px;
    opacity: 0;
    position: absolute;
    right: 20px;
    transition: opacity 0.3s;
}
.cP__count--dark-text {
    color: #000;
}
.cP__count--visible {
    opacity: 0.4;
}
.cP__text {
    color: #fff;
    font-size: 20px;
    white-space: nowrap;
}
.cP__text--editable {
    cursor: text;
}
.cP__text--dark-text {
    color: #000;
}
.cP__text::before {
    content: attr(placeholder);
    display: none;
    opacity: 0.6;
    pointer-events: none;
    transition: opacity 0.3s;
}
.cP__text--highlighted::before {
    opacity: 1;
}
.cP__text:empty::before {
    display: block;
}
.cP__hints {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.5s;
    white-space: nowrap;
}
.cP__hints--visible {
    opacity: 1;
}
.cP__hint {
    color: #fff;
    font-size: 14px;
    left: 50%;
    position: absolute;
    text-align: center;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.6);
    transform: translateX(-50%);
    white-space: nowrap;
}
.cP__hint--position--top {
    bottom: 100%;
    margin: 0 0 6px;
}
.cP__hint--position--bottom {
    margin: 6px 0 0;
    top: 100%;
}
.cM {
    background: #1b1b1d;
    padding: 20px;
    z-index: 1;
}
.cM--mode--desktop {
    animation: opacity-fade-show-modal-strict 0.3s;
    border-radius: 12px;
    bottom: 12px;
    left: 12px;
    position: absolute;
    right: 12px;
}
.cM--mode--mobile {
    animation: move-bottom-right 0.25s;
    border-radius: 12px 12px 0 0;
    bottom: 0;
    left: 0;
    min-height: 320px;
    position: fixed;
    width: 100%;
    z-index: 2;
}
.cM__header {
    align-items: center;
    display: flex;
    justify-content: space-between;
    margin: 0 0 20px;
}
.cM__description {
    color: #707071;
    font-size: 12px;
    margin: 20px 20px 0;
    text-align: center;
}
.cN {
    animation: move-from-right 0.5s;
    bottom: 0;
    display: flex;
    gap: 6px;
    left: 0;
    overflow-x: auto;
    padding: 0 12px 16px;
    position: absolute;
    width: 100%;
}
.cN__item {
    background-clip: content-box;
    border: 2px solid rgba(255, 255, 255, 0.1);
    border-radius: 5px;
    cursor: pointer;
    height: 22px;
    min-width: 22px;
    transition: border-color 0.3s;
    width: 22px;
}
.cN__item--active,
.cN__item:hover {
    border-color: #fff;
}
.cN__item--dark-text.cN__item--active,
.cN__item--dark-text:hover {
    border-color: #000;
}

.C {
    background: #343437;
    border-radius: 12px;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.2);
    margin: 10px 0 0;
    overflow: hidden;
}
.C--style--dark {
    background: #1b1b1d;
}
.C__menu-item {
    align-items: center;
    background: 0 0;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    padding: 10px 18px;
    position: relative;
    transition: background 0.3s;
    white-space: nowrap;
    width: 100%;
}
.C__menu-item--split {
    margin-bottom: 2px;
}
.C__menu-item--split::before {
    background: rgba(255, 255, 255, 0.05);
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 100%;
}
.C__menu-item:hover {
    background: #232325;
}
.C__menu-item--selected {
    background: #343437;
    background: #232325;
}
.C__menu-item-icon {
    height: 16px;
    margin: 0 12px 0 0;
    width: 16px;
}

.CCC {
    align-items: center;
    background-color: #232325;
    border: 2px solid #232325;
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    gap: 8px;
    margin-bottom: 10px;
    min-height: 70px;
    padding: 12px;
    transition: all 100ms linear;
}
.CCC:hover {
    background-color: #343437;
    border-color: #343437;
}
.CCC--active {
    background: rgba(215, 13, 17, 0.1);
    border-color: #f59e0b;
    pointer-events: none;
}
.CCC__left-part {
    align-items: start;
    display: grid;
    flex: 1;
    grid-auto-flow: row;
    grid-row-gap: 4px;
}
.CCC__right-part {
    align-items: flex-end;
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 44px;
}
.CCC__primary-text {
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.CCC__sub-text {
    color: #707071;
    font-size: 12px;
    word-break: break-all;
}
.cr {
    flex: 1;
}
@media screen and (max-width: 639px) {
    .cr {
        padding-bottom: 54px;
    }
}
.cr__content {
    height: 344px;
}
@media screen and (max-width: 639px) {
    .cr__content {
        height: 100%;
        max-height: calc(100vh - 156px);
    }
}
.cr__image-container {
    align-items: center;
    display: flex;
    height: 240px;
    justify-content: center;
    margin-bottom: 20px;
}
.cr__image-wrapper {
    border-radius: 4px;
    height: 100%;
    overflow: hidden;
    position: relative;
}
@media screen and (max-width: 639px) {
    .cr__image-wrapper {
        max-height: 100%;
    }
}
.cr__image {
    height: 100%;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}
@media screen and (max-width: 639px) {
    .cr__image {
        object-fit: cover;
    }
}
.cr__footer {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.05);
    display: flex;
    justify-content: space-between;
    margin: 0-20px;
    padding: 20px 20px 0;
}
@media screen and (max-width: 639px) {
    .cr__footer {
        bottom: 20px;
        position: absolute;
        width: 100%;
    }
}
.cr__toggle-button {
    align-items: center;
    background-color: #343437;
    border: 0;
    border-radius: 50%;
    color: #fff;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    padding: 0;
    place-items: center;
    width: 24px;
}
.cr__toggle-button:active {
    transform: translateY(1px);
}
.cr__counter {
    color: #cfcfd0;
    font-size: 16px;
    font-weight: 700;
    white-space: nowrap;
}
.cr__additional-content {
    margin-top: 10px;
}
.cr__icon {
    position: absolute;
    z-index: 1;
}
.cr__icon:after {
    bottom: 50%;
    box-shadow: 0 0 40px rgba(0, 0, 0, 0.6);
    content: "";
    display: block;
    height: 1px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 1px;
}
.cr__icon--users {
    bottom: 10px;
    left: 10px;
}
.cr__icon--play {
    right: 14px;
    top: 16px;
}
.users-search {
    flex: 1;
}
.users-search__input-wrapper {
    padding: 20px;
}
.users-search__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.users-search__footer {
    align-items: center;
    display: flex;
    justify-content: flex-end;
    width: 100%;
}
.users-search__search-result-description {
    align-items: center;
    display: flex;
    gap: 12px;
    justify-content: space-between;
    padding: 0 20px;
}
.users-search__info-icon {
    margin-left: 5px;
}
.users-search__users-list {
    height: 316px;
    padding: 20px;
}
.users-search__users-list--with-footer {
    height: 244px;
}
.creators-search-result-item {
    align-items: center;
    display: flex;
    justify-content: space-between;
    padding: 10px 0;
}
.creators-search-result-item:not(:last-child) {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05);
}
.MMM {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    margin: 0 8px;
    padding: 12px;
    position: relative;
    transition: background 0.3s;
}
.MMM .icon-people {
    color: #fff;
    margin: 0 6px 0 0;
}
@media (pointer: fine) {
    .MMM:hover,
    .MMM:hover .avatar .online,
    .MMM:hover .M__tier {
        background: #343437;
    }
}
.M__tier {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    bottom: -4px;
    display: flex;
    height: 22px;
    justify-content: center;
    position: absolute;
    right: -4px;
    transition: background 0.3s;
    width: 22px;
}
.M__tier .icon-diamond-colored,
.M__tier .icon-diamond-flat {
    height: 14px;
    width: 14px;
}
.M__avatar-wrapper {
    margin: 0 12px 0 0;
    position: relative;
}
.M .avatar {
    flex-shrink: 0;
    height: 44px;
    width: 44px;
}
.M .avatar .online {
    background: #232325;
    height: 12px;
    left: -3px;
    top: -3px;
    width: 12px;
}
.M__content {
    overflow: hidden;
}
.M__name {
    align-items: center;
    display: flex;
}
.M__name .username {
    font-weight: 700;
}
.M__text {
    color: rgba(255, 255, 255, 0.6);
    margin: 5px 0 0;
    min-height: 16px;
    overflow: hidden;
    padding-right: 40px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.M__time {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    margin: 0 0 0 6px;
    opacity: 0.3;
}
.M__menu {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    opacity: 0.4;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: opacity 0.3s;
    width: 32px;
}
@media screen and (max-width: 639px) {
    .M__menu {
        height: 44px;
        margin-right: -8px;
        width: 44px;
    }
}
.M__menu:hover {
    opacity: 1;
}
.M__new {
    align-items: center;
    background: #ff5f5f;
    border-radius: 10px;
    color: #fff;
    display: flex;
    font-size: 11px;
    height: 20px;
    justify-content: center;
    min-width: 20px;
    padding: 0 4px;
    pointer-events: none;
    position: absolute;
    right: 30px;
}
.M .personal-notifications-settings {
    bottom: unset;
    left: unset;
    right: -8px;
    top: 56px;
}
@media screen and (max-width: 639px) {
    .M .personal-notifications-settings {
        bottom: unset;
        left: 7px;
        right: 7px;
        top: 56px;
        width: unset;
    }
}
.M--menu--top .personal-notifications-settings {
    bottom: 56px;
    top: unset;
}
@media screen and (max-width: 639px) {
    .M--menu--top .personal-notifications-settings {
        bottom: 56px;
        top: unset;
    }
}
.M--menu--top .personal-notifications-settings-arrow-up {
    bottom: -5px;
    top: unset;
    transform: rotate(180deg);
}
.M .personal-notifications-switcher-name {
    cursor: pointer;
    text-decoration: none;
}
.M .personal-notifications-switcher-name:hover {
    color: #fff;
}
.modal-light {
    animation: opacity-fade-top-show 0.5s;
    cursor: default;
    min-width: 400px;
    position: absolute;
}
.modal-light--position--top {
    bottom: 100%;
    left: 0;
    margin: 0 0 20px;
}
.modal-light--position--top-right {
    bottom: 100%;
    margin: 0 0 20px;
    right: 0;
}
.modal-light--position--bottom {
    left: 0;
    margin: 20px 0 0;
    top: 100%;
}
@media screen and (max-width: 639px) {
    .modal-light {
        animation: none;
        bottom: auto !important;
        left: 20px !important;
        margin: 0;
        min-width: auto;
        position: fixed !important;
        right: 20px !important;
        top: 50% !important;
        transform: translateY(-50%);
        z-index: 4;
    }
}
.media-thumb-edit-content__select-cover {
    background: rgba(217, 2, 60, 0.4);
    border-radius: 18px;
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
}
.media-thumb-edit-content__checkbox {
    pointer-events: none;
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 2;
}
.media-thumb-edit-content .menu-button-dots {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 2;
}
.media-thumb-edit-content__edit-cover {
    background: #000;
    border-radius: 18px;
    bottom: 0;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.media-thumb-edit-content__edit-cover:hover {
    opacity: 0.2;
}
.bc {
    position: relative;
}
.bc--clickable {
    cursor: pointer;
}
.bcc::before {
    background: #1b1b1d;
    border-radius: 18px;
    content: "";
    height: 100%;
    left: 2%;
    pointer-events: none;
    position: absolute;
    top: 2%;
    width: 100%;
}
.bc--locked:hover > .bc__image-wrapper--locked {
    background: linear-gradient(246.82deg, #3b2d71 0, #1e1146 100%) no-repeat center;
    background-size: cover;
}
.bc .m {
    border-radius: 18px;
    overflow: inherit;
}
.bc__image-wrapper {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 18px;
    display: block;
    overflow: hidden;
    padding-bottom: 75%;
    pointer-events: none;
    position: relative;
    transform: translateZ(0);
    width: 100%;
}
.bc__image-wrapper--locked {
    background-image: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%);
}
.bc__image-wrapper--shadow::after {
    background: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, 0.65) 100%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.bc__image {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    transform: scale(1.01);
    transition: transform 0.3s;
    width: 100%;
}
.bc:hover .bc__image {
    transform: scale(1.1);
}
.bc:hover .bc__image-wrapper::after {
    opacity: 0.5;
}
.bc__description {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    bottom: 5%;
    color: rgba(255, 255, 255, 0.6);
    left: 6%;
    margin: 0 14px 0 0;
    max-width: 100%;
    padding-right: 28px;
    position: absolute;
    white-space: normal;
}
.bc__name {
    font-size: 16px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    color: #fff;
    display: block;
    margin: 0 0 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bD {
    max-width: calc(100vw - 32px);
    width: 100%;
}
.bD__header {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin: 0 0 32px;
}
.bD__tabs {
    color: #a0a0a1;
    display: flex;
    font-size: 24px;
    gap: 32px;
}
.bD__tab {
    cursor: pointer;
}
.bD__tab--active,
.bD__tab:hover {
    color: #fff;
}
.bD__tab--active {
    pointer-events: none;
}
.bD__link {
    align-items: center;
    color: #f59e0b;
    display: flex;
    font-size: 16px;
    transition: color 0.3s;
}
@media (max-width: 639px) {
    .bD__tabs {
        gap: 24px;
    }
    .bD .scroll-bar-container__arrow,
    .bD .scroll-bar-container__shadow {
        display: none;
    }
}
.link-banner {
    align-items: center;
    background: radial-gradient(120.5% 1003.32%at 69.22% 14.96%, #7a2cc4 0, #421074 100%), #050506;
    border-radius: 10px;
    display: flex;
    padding: 8px 10px;
    text-decoration: none;
    transition: background 0.3s;
}
.link-banner:hover {
    background: radial-gradient(120.5% 1003.32%at 69.22% 14.96%, #9544e1 0, #7a29cc 100%), #050506;
    text-decoration: none;
}
.link-banner:hover .link-banner__text {
    color: #cfcfd0;
}
.link-banner__icon {
    width: 48px;
}
.link-banner__text {
    color: #a0a0a1;
}
.link-banner__title {
    color: #fff;
    margin: 0 0 4px;
}
.messenger-upload-button-wrapper {
    height: 100%;
    margin-right: 8px;
    opacity: 0.6;
}
.messenger-upload-button-wrapper:hover,
.cY:hover::before {
    opacity: 1;
}
.messenger-upload-button-wrapper .upload-icon {
    height: 22px;
    width: 22px;
}
.documents-submit-warning {
    align-items: center;
    display: flex;
    flex-direction: column;
    padding: 0 0 56px;
    text-align: center;
}
.documents-submit-warning__icon {
    margin-bottom: 8px;
}
.documents-submit-warning__title {
    font-size: 1.125rem;
    line-height: 1.374rem;
    font-weight: 500;
    margin-bottom: 12px;
}
.documents-submit-warning__subtitle {
    font-size: 0.813rem;
    line-height: 1.125rem;
    margin-bottom: 20px;
    opacity: 0.8;
}
.E {
    align-items: center;
    border-bottom: 2px solid rgba(255, 255, 255, 0.05);
    display: flex;
    justify-content: flex-start;
    padding: 20px;
}
.E__left {
    height: 48px;
    margin-right: 14px;
    width: 48px;
}
.E__avatar.avatar {
    height: 48px;
    width: 48px;
}
.E__title {
    font-size: 16px;
    font-weight: 700;
}
.E__sub-text {
    color: #707071;
    font-size: 12px;
}
.E__sub-text--last::before {
    content: " • ";
}
.E__avatar {
    height: 48px;
    width: 48px;
}
.co {
    bottom: -22px;
    column-gap: 4px;
    display: flex;
    height: 42px;
    left: 0;
    position: absolute;
    right: 0;
    z-index: 1;
}
.co__item {
    align-items: center;
    background: #343437;
    border-radius: 6px;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex-shrink: 0;
    font-size: 12px;
    height: 20px;
    overflow: hidden;
    padding: 0 5px;
    white-space: nowrap;
}
.co__item:hover {
    background: #424248;
}
.cZ {
    align-items: center;
    display: flex;
    justify-content: center;
}
.cZ--disabled {
    pointer-events: none;
}
.cZ__content {
    align-items: center;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 10px;
    display: flex;
    flex: 1;
    height: 40px;
    position: relative;
    transition: background 0.3s;
    z-index: 2;
}
.cZ__content:focus-within {
    background: rgba(255, 255, 255, 0.2);
}
.cZ .chat-controls-input {
    height: 40px;
    margin: 0;
    padding: 8px 0 0;
}
.cZ .chat-controls-input__wrapper {
    padding: 0 0 0 4px;
}
.cZ .chat-controls-input__wrapper-scroll {
    right: 4px;
}
.cZ__smiles-wrapper {
    background: 0 0;
    border: 0;
    display: block;
    padding: 0;
}
.cZ__send {
    align-items: center;
    background: 0 0;
    border: 0;
    box-sizing: content-box;
    color: #cfcfd0;
    cursor: pointer;
    display: flex;
    justify-content: flex-end;
    overflow: hidden;
    padding: 0;
    position: relative;
    transition: padding-left 0.3s;
    width: 32px;
}
.cZ__send--share {
    padding-left: 6px;
}
.cZ__send--share::before {
    background: rgba(255, 255, 255, 0.05);
    content: "";
    height: 20px;
    left: 10px;
    position: absolute;
    width: 1px;
}
.cY:hover,
.cZ__send:hover {
    color: #fff;
}
.cZ__alert {
    align-items: center;
    animation: form-alert-top-and-hide 3s;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 20px;
    bottom: 100%;
    color: #cfcfd0;
    display: flex;
    font-size: 14px;
    margin: 0 0 12px;
    min-height: 42px;
    opacity: 0;
    padding: 0 18px;
    pointer-events: none;
    position: absolute;
}
.cZ__shater {
    align-items: center;
    color: rgba(255, 255, 255, 0.4);
    cursor: pointer;
    display: flex;
    font-size: 12px;
    gap: 3px;
    left: 12px;
    position: absolute;
    right: 12px;
    top: 8px;
}
.cZ__shater--loading {
    color: #fccf49;
    pointer-events: none;
}
.cY {
    align-items: center;
    border-radius: 60px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 20px;
    height: 48px;
    overflow: hidden;
    padding: 0 20px;
    position: absolute;
    transform: translateY(-50%) translateX(-50%);
    white-space: nowrap;
    z-index: 1;
}
.cY::before {
    background: rgba(0, 0, 0, 0.1);
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.cY--dark-text,
.cY--dark-text:hover {
    color: #000;
}
.cY__text {
    position: relative;
}
.cY__icon--style--blocked {
    color: #ef7d00;
}
.cY__icon--style--star-filled {
    color: #fccf49;
}
.cY__notify {
    align-items: center;
    animation: opacity-fade-show 0.5s;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 20px;
    bottom: 64px;
    display: flex;
    gap: 18px;
    left: 12px;
    min-height: 48px;
    padding: 4px 18px;
    pointer-events: none;
    position: absolute;
    right: 12px;
    z-index: 2;
}
.cY__notify--floor {
    bottom: 12px;
}
.c9__logo {
    align-items: center;
    background: #d97706;
    border-radius: 14px;
    display: flex;
    justify-content: center;
}
.c9__list {
    margin: 0 0 0-64px;
}
.ct {
    column-gap: 10px;
    display: flex;
    margin: 0 0 20px;
    overflow: auto;
    position: relative;
    width: 100%;
}
.cu {
    display: flex;
    gap: 20px;
    height: 304px;
}
.cu__item {
    align-items: center;
    background: #343437 no-repeat center;
    background-size: cover;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 4px;
    justify-content: center;
    overflow: hidden;
    position: relative;
}
.cu__item:hover {
    background-color: #424248;
}
.cu__item--image::before {
    background: #000;
    bottom: 0;
    content: "";
    left: 0;
    opacity: 0.7;
    position: absolute;
    top: 0;
    width: 100%;
}
.cu__item--image:hover::before {
    opacity: 0.6;
}
.cx__video-time {
    align-items: center;
    background: rgba(0, 0, 0, 0.8);
    border-radius: 4px;
    bottom: 6px;
    color: #cfcfd0;
    display: flex;
    font-size: 10px;
    font-weight: 500;
    height: 14px;
    line-height: 13px;
    padding: 0 3px;
    position: absolute;
    right: 6px;
}
.cx__video {
    border-radius: 4px;
    max-height: 100%;
    max-width: 100%;
}
.cx__video-wrapper {
    align-items: center;
    display: flex;
    height: 234px;
    justify-content: center;
    margin: 0 0 20px;
    position: relative;
}
.cx__video-inner-wrapper {
    align-items: center;
    display: flex;
    height: inherit;
    justify-content: center;
    overflow: hidden;
    position: relative;
}
.cx__track {
    display: flex;
    margin: 0 0 0-14px;
}
.cx__error {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.cx__remove {
    align-items: center;
    color: #707071;
    cursor: pointer;
    display: flex;
    justify-content: center;
    width: 34px;
}
.cx__remove:hover {
    color: #cfcfd0;
}
.cv {
    display: flex;
    height: 225px;
}
.cv__image {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
    position: relative;
}
.cv__image-photo {
    border-radius: 4px;
    max-height: 100%;
    max-width: 100%;
}
.cv__controls {
    align-items: center;
    bottom: 20px;
    display: flex;
    gap: 10px;
    position: absolute;
}
.cv__button {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 50%;
    color: #cfcfd0;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    width: 32px;
}
.cv__button:hover {
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
}
.cv__loading {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 10px;
    justify-content: center;
    width: 100%;
}
.c3 {
    padding: 0 20px;
}
.c3__row {
    align-items: flex-start;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    gap: 12px;
    justify-content: space-between;
}
.c3__row:not(first-child) {
    margin-top: 16px;
}
.c3__row-title {
    display: grid;
    font-size: 14px;
    font-weight: 400;
    grid-auto-flow: column;
    grid-column-gap: 8px;
    justify-content: start;
    min-width: 40%;
}
.c3__row-value {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 14px;
    font-weight: 500;
}
.c3__row-value--warning {
    color: #fccf49;
}
.c3__question-icon {
    margin-left: 5px;
}
.c3__divider {
    background-color: #fff;
    height: 1px;
    margin-top: 21px;
    opacity: 0.1;
}
.c3__lists {
    color: #fff;
    text-align: end;
    word-break: break-word;
}
.c3__user-group {
    white-space: nowrap;
}
.c3__media {
    align-items: flex-start;
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(5, 1fr);
    margin-top: 21px;
}
.c3__description {
    font-style: italic;
    margin-top: 16px;
    white-space: pre-wrap;
}
.c3__buttons-wrapper {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
}
.c3__edit-button {
    align-items: center;
    display: flex;
    flex: 1;
    gap: 10px;
}
@media (max-width: 420px) {
    .c3__media {
        grid-template-columns: repeat(3, 1fr);
    }
}
.c4 {
    position: relative;
}
.c4:first-child {
    margin-left: 0;
}
.c4__image {
    aspect-ratio: 1;
    border-radius: 4px;
    cursor: pointer;
    height: 64px;
    overflow: hidden;
    width: 100%;
}
.c4__top-right {
    pointer-events: none;
    position: absolute;
    right: 2px;
    top: 2px;
}
.c4__icon {
    color: #fff;
    filter: drop-shadow(0 0 6px rgba(0, 0, 0, 0.3));
    height: 16px;
    width: 16px;
}
.personal-notifications-modal-panel-controls {
    align-items: center;
    color: rgba(255, 255, 255, 0.4);
    display: flex;
    height: 24px;
    position: absolute;
    right: 22px;
    top: 20px;
    z-index: 11;
}
.personal-notifications-modal-panel-controls-btn {
    background: 0 0;
    color: #707071;
    margin-left: 24px;
    position: relative;
    z-index: 11;
}
.personal-notifications-modal-panel-controls-btn:hover {
    color: #fff;
}
.personal-notifications-modal-panel-controls-btn.active {
    color: #fff;
    pointer-events: none;
}
.personal-notifications-modal-panel-controls-btn.active .icon-settings {
    transform: rotate(180deg);
}
.personal-notifications-modal-panel-controls .icon {
    height: 18px;
    transition: all 0.3s;
    width: 18px;
}
.personal-notifications-modal-panel-controls .icon.icon-close-3 {
    height: 15px;
    width: 15px;
}
@media screen and (max-width: 639px) {
    .personal-notifications-modal-panel-controls .icon.icon-close-3 {
        height: 13px;
        width: 13px;
    }
}
.personal-notifications-modal-panel-controls__icon-title {
    margin: 0 16px 0 0;
}
.personal-notifications-modal-panel-controls__select {
    margin: 8px 0;
    max-width: 300px;
    width: 300px;
}
.personal-notifications-modal-panel-controls-form {
    max-width: 100%;
    padding: 30px;
    width: 600px;
}
.personal-notifications-modal-panel-controls-form label {
    align-items: center;
    display: flex;
    margin: 10px 0;
}
.personal-notifications-modal-panel-controls-form-field.input,
.personal-notifications-modal-panel-controls-form-field.select {
    display: block;
    height: 30px !important;
    text-align: left;
    width: 185px;
}
.personal-notifications-modal-panel-controls-form-field .select-control {
    height: 30px !important;
}
.personal-notifications-modal-panel-controls-form-text {
    text-align: left;
    width: 100px;
}
.personal-notifications-modal-panel-controls-form-actions {
    align-items: center;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    display: flex;
    justify-content: flex-end;
    margin: 20px 0 0;
    padding: 20px 0 0;
}
.personal-notifications-modal-panel-controls-form-actions > .btn {
    margin: 0 0 0 20px;
}
.personal-notifications-modal-panel-controls-form h3 {
    font-size: 22px;
    font-weight: 600;
    letter-spacing: normal;
    line-height: normal;
    margin: 0 0 12px;
}
.personal-notifications-modal-panel-controls-form h3 > .icon {
    height: 21px;
    margin: 0 14px 0 0;
    width: 21px;
}
.personal-notifications-modal-panel-controls__create-mass-message-btn {
    align-items: center;
    color: rgba(255, 255, 255, 0.6);
    display: grid;
    grid-auto-flow: column;
    grid-column-gap: 10px;
    justify-content: start;
    transition: color 0.3s;
    width: auto;
}
.personal-notifications-modal-panel-controls__create-mass-message-btn .icon {
    transition: none;
}
.personal-notifications-modal-panel-controls__create-mass-message-btn:hover {
    color: #fff;
}
.personal-notifications-modal-panel-controls > .personal-notifications-modal-panel-controls-settings {
    right: 20px;
    top: 32px;
}
@media screen and (max-width: 639px) {
    .personal-notifications-modal-panel-controls {
        right: 17px;
        top: 15px;
    }
    .personal-notifications-modal-panel-controls-form label {
        justify-content: space-between;
    }
}
.i {
    display: flex;
    flex-direction: column;
    margin: -20px 0 0;
}
.settings-pricing-controls .input-wrapper {
    margin: 8px 0 20px;
}
.settings-pricing-controls__wrapper--disabled {
    opacity: 0.4;
    pointer-events: none;
}
.settings-pricing-controls__description {
    font-size: 14px;
    margin: 10px 0 20px;
    opacity: 0.6;
}
.settings-pricing-controls__title {
    font-size: 20px;
    font-weight: 700;
    margin: 20px 0;
}
.settings-pricing-controls__footer-text {
    color: #707071;
    font-size: 12px;
    margin: 20px 0;
}
.c__description {
    color: #a0a0a1;
    font-size: 14px;
    margin: 10px 0 20px;
}
.c__title {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 20px;
}
.c__links-list {
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 16px;
    margin-bottom: 20px;
}
.c__actions {
    display: flex;
}
.c__add-link-button {
    align-items: center;
    display: grid;
    flex: 1;
    grid-auto-flow: column;
    grid-column-gap: 12px;
    justify-content: center;
}
.b2 {
    height: 100%;
    position: relative;
}
.b2__total {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
    justify-content: center;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.b2__total-title {
    color: #707071;
    font-size: 12px;
    font-weight: 500;
    line-height: 120%;
    text-transform: uppercase;
}
.flag {
    background-repeat: no-repeat;
    background-size: contain;
}
.flag.size-small {
    height: 11px;
    width: 16px;
}
.flag.size-medium {
    height: 17px;
    width: 24px;
}
.b3,
.statistics-line-chart {
    height: 100%;
    position: relative;
}
.multi-check-box-settings {
    background: #1b1b1d;
    border-radius: 12px;
    color: #cfcfd0;
    font-size: 13px;
    font-weight: 400;
    line-height: 20px;
    overflow: hidden;
    position: relative;
}
.multi-check-box-settings--closed:hover {
    background: #232325;
}
.multi-check-box-settings__title {
    color: #fff;
    display: flex;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    min-height: 62px;
    padding: 20px 20px 0;
    position: relative;
}
.multi-check-box-settings__title--closed {
    cursor: pointer;
}
.multi-check-box-settings__content {
    padding: 0 20px;
}
.multi-check-box-settings__help {
    align-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    color: #cfcfd0;
    cursor: pointer;
    display: flex;
    font-size: 11px;
    height: 15px;
    justify-content: center;
    margin: 3px 0 0 6px;
    width: 15px;
}
.multi-check-box-settings__description {
    margin: 8px 0 0;
}
.multi-check-box-settings__control {
    cursor: pointer;
    opacity: 0.6;
    padding: 4px;
    position: absolute;
    right: 20px;
    top: 16px;
    transition: transform 0.3s, opacity 0.3s;
}
.multi-check-box-settings__control:hover,
.bd__content:hover .my-collection-video-item__play {
    opacity: 1;
}
.multi-check-box-settings__control--opened {
    transform: rotate(-180deg);
}
.multi-check-box-settings__arrow {
    height: 14px;
    width: 14px;
}
.multi-check-box-settings__list {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    margin: 10px 0 0;
    padding: 10px 0;
}
.radio-check-block {
    background: #343437;
    border-radius: 12px;
    margin: 0 0 10px;
}
.radio-check-block__header {
    cursor: pointer;
    display: flex;
    gap: 18px;
    padding: 18px;
}
.radio-check-block__title {
    font-size: 16px;
    font-weight: 500;
}
.radio-check-block__sub-title {
    color: #a0a0a1;
    margin: 6px 0 0;
}
.radio-check-block__radio-box {
    align-items: center;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 50%;
    display: flex;
    height: 20px;
    justify-content: center;
    width: 20px;
}
.radio-check-block__radio-box--checked {
    border-color: #f59e0b;
}
.radio-check-block__radio-box--checked::before {
    background: #f59e0b;
    border-radius: 50%;
    content: "";
    display: block;
    height: 10px;
    width: 10px;
}
.radio-check-block__checkbox {
    align-items: center;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 4px;
    color: #fff;
    display: flex;
    height: 18px;
    justify-content: center;
    width: 18px;
}
.radio-check-block__checkbox--checked {
    background: #f59e0b;
    border-color: #f59e0b;
}
.radio-check-block__checkbox--disabled {
    background: #5f5f67;
    border-color: #5f5f67;
    color: #e3e1ec;
    pointer-events: none;
}
.radio-check-block__radio-box-icon {
    height: 14px;
    width: 14px;
}
.radio-check-block__content {
    padding: 14px 18px 18px;
    position: relative;
}
.radio-check-block__content::before {
    background: #f8f8f8;
    content: "";
    height: 1px;
    left: 18px;
    opacity: 0.05;
    position: absolute;
    right: 18px;
    top: 0;
}
.bj {
    align-items: center;
    background: inherit;
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
}
.bj__avatar-wrapper {
    background: inherit;
    border-radius: 30.75%;
    padding: 2px;
    z-index: 1;
}
.bj__avatar-wrapper:not(:first-child) {
    margin-left: -10px;
}
.earnings-table-info {
    align-items: center;
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    margin-bottom: 20px;
}
.earnings-table-info__description {
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    margin: 12px 0;
}
@media screen and (max-width: 639px) {
    .earnings-table-info {
        padding: 0;
    }
}
@media screen and (max-width: 1023px) {
    .earnings-table-info {
        align-items: start;
    }
}
.earnings-table-info-main {
    align-items: center;
    display: flex;
    flex-flow: row nowrap;
    flex-grow: 1;
    justify-content: space-between;
    margin-right: 20px;
}
@media screen and (max-width: 1023px) {
    .earnings-table-info-main {
        align-items: start;
        flex-flow: column nowrap;
    }
}
.earnings-table-info-title {
    font-size: 1.25rem;
    color: #fff;
    font-weight: 400;
    line-height: 1.2;
    margin: 0;
}
.earnings-table-info-title .primary-color-text {
    font-weight: 700;
}
@media screen and (max-width: 1023px) {
    .earnings-table-info-title {
        margin-bottom: 13px;
    }
}
.earnings-table-info-life-time-picker {
    min-width: 286px;
}
.my-collection-video-item__duration {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal;
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 6px;
    bottom: 3%;
    color: #a0a0a1;
    display: flex;
    height: 22px;
    padding: 0 8px;
    position: absolute;
    right: 3%;
}
.my-collection-video-item__play {
    align-items: center;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 24px;
    display: flex;
    height: 30%;
    justify-content: center;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    transition: opacity 0.3s;
    width: 30%;
}
.my-collection-video-item__play > .icon {
    height: 50%;
    margin: 0;
    width: 50%;
}
.bM {
    align-items: stretch;
    background: #111113;
    border-radius: 12px;
    display: flex;
    flex: 1 0 284px;
    gap: 16px;
    min-height: 128px;
    min-width: 284px;
    padding: 20px 16px 20px 20px;
    transition: background 0.3s;
}
.bM--style--accent {
    background: rgba(91, 65, 255, 0.2);
}
.bM--style--accent .bM__title {
    color: #f59e0b;
}
.bM--hovered {
    cursor: pointer;
}
.bM--hovered:hover {
    background: #1b1b1d;
}
.bM--hovered:hover.bM--style--accent {
    background: rgba(91, 65, 255, 0.3);
}
.bM--hovered:hover .df__chevron-icon {
    color: #cfcfd0;
}
.bM__left-part {
    flex: 1;
}
.bM__right-part {
    align-items: center;
    display: flex;
    flex: 0 1 24px;
    flex-direction: column;
    justify-content: space-between;
    width: 24px;
}
.bM__right-part--center {
    justify-content: center;
}
.bM__title {
    color: #707071;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 15px;
    text-transform: uppercase;
}
.bM__body {
    color: #fff;
    display: grid;
    font-size: 36px;
    font-weight: 500;
    margin-bottom: 8px;
}
.bM__body-content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bM__body-highlight {
    color: #fff;
    font-size: 2rem;
    line-height: 2.5rem;
}
.bM__description {
    align-items: flex-start;
    color: #707071;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    gap: 10px;
}
.bM__indicator {
    color: #21b062;
}
.bM__indicator--spaced {
    margin-right: 8px;
}
.bM__indicator--negative {
    color: #ef7d00;
}
.bM__chevron-icon {
    color: #707071;
}
.bM__help-tooltip {
    color: #707071;
    white-space: normal;
}
.bM__help-tooltip.help-tooltip:hover {
    color: #a0a0a1;
}
.b7__title {
    color: #f8f8f8;
    font-size: 20px;
    font-weight: 500;
    line-height: 24px;
    margin-bottom: 8px;
}
.b7__description {
    color: #cfcfd0;
    font-size: 14px;
    font-weight: 500;
    line-height: 22px;
    margin-bottom: 20px;
}
.bW {
    animation-duration: 250ms;
    animation-name: animate-slide;
    animation-timing-function: ease;
}
.responsive-grid {
    column-gap: 20px;
    display: grid;
    grid-template-columns: 2fr 1fr;
    margin: 40px 0 0;
    row-gap: 20px;
}
.responsive-grid__column {
    flex: 1;
}
@media screen and (max-width: 1023px) {
    .responsive-grid {
        grid-template-columns: 1fr;
    }
}
.icon-badge {
    align-items: center;
    display: flex;
    justify-content: center;
}
.icon-badge--size--small {
    border-radius: 6px;
    font-size: 12px;
    height: 20px;
    width: 20px;
}
.icon-badge--style--white {
    background: #fff;
    color: #d97706;
}
.icon-badge--style--primary {
    background: #d97706;
    color: #fff;
}
.upload-percent-round {
    align-items: center;
    border: 2px solid #424248;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    pointer-events: none;
    position: relative;
}
.upload-percent-round--animated {
    animation: donut-spin 1.2s linear infinite;
}
.upload-percent-round--color--blue {
    color: #d97706;
}
.upload-percent-round__svg {
    height: inherit;
    position: absolute;
    transform: rotateY(-180deg) rotateZ(-90deg);
    width: inherit;
}
.upload-percent-round__circle {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
}
.select-popup {
    color: #fff;
    display: inline-block;
    position: relative;
    width: 100%;
    z-index: 2;
}
.select-popup__value-content {
    align-items: center;
    column-gap: 10px;
    display: flex;
    font-size: 12px;
    font-weight: 700;
}
.select-popup__value {
    align-items: center;
    background: #343437;
    border: 1px solid transparent;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    height: 44px;
    padding: 0 40px 0 12px;
    transition: background 0.3s;
}
.select-popup__value:hover {
    background: #424248;
}
.select-popup__value--error {
    border-color: #fd3a5b;
}
.select-popup__value-icon {
    height: 20px;
    margin: 0 8px 0 0;
    width: 20px;
}
.select-popup__arrow {
    color: #a0a0a1;
    margin: 0 0 0 16px;
    position: absolute;
    right: 12px;
    width: 12px;
}
.select-popup__popup {
    background: #232325;
    border-radius: 12px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
}
.select-popup__title {
    font-size: 13px;
    font-weight: 500;
    margin: 0 0 12px;
    padding: 0 16px 12px;
}
.select-popup__item {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: 15px;
    font-weight: 500;
    height: 56px;
    padding: 4px 20px 4px 0;
    position: relative;
    transition: background 0.3s;
}
.select-popup__item:hover {
    background: #343437;
}
.select-popup__item--disabled {
    background: 0 0 !important;
    pointer-events: none;
}
.select-popup__item-check {
    color: #f59e0b;
    height: 17px;
    position: absolute;
    right: 18px;
    width: 17px;
}
.select-popup__item-icon-wrapper {
    display: flex;
    justify-content: center;
    width: 46px;
}
.select-popup__item-icon {
    height: 20px;
    width: 20px;
}
.user-check-box {
    display: flex;
    margin: 8px 0;
    padding: 0 116px 0 0;
}
.user-check-box--disabled {
    opacity: 0.6;
    pointer-events: none;
}
.user-check-box__avatar {
    margin: 0 8px;
}
.user-check-box .checkbox-ds {
    pointer-events: none;
}
.steps {
    align-items: center;
    color: #a0a0a1;
    display: flex;
    height: 24px;
    justify-content: space-between;
    margin: 0 0 20px;
}
.steps--uncompact {
    margin: 0 0 60px;
}
.steps__item {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 24px;
    transition: color 0.3s;
    width: 24px;
}
.steps__item-line {
    flex: 1;
    transition: color 0.3s;
}
.steps__item-line::before {
    border-top: 1px dashed currentColor;
    content: "";
    display: block;
    margin: 0 3px;
}
.steps__item-line--ready::before {
    border-top-style: solid;
    color: #21b062;
    margin: 0;
}
.steps__item-icon {
    display: block;
    flex: 1;
    height: 24px;
    min-height: 24px;
    min-width: 24px;
    width: 24px;
}
.steps__item-text {
    margin: 10px 0 0;
}
.steps__item-text-inner {
    display: inline-block;
    font-size: 13px;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.transfer-fan-steps-info {
    background: #232325;
    border-radius: 12px;
    padding: 24px;
}
.radio-pill-controls {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}
.radio-pill-controls--content--space-between {
    justify-content: space-between;
}
.radio-pill-controls__item {
    align-items: center;
    background: #343437;
    border: 2px solid transparent;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    height: 40px;
    justify-content: center;
    line-height: 17px;
    padding: 0 24px;
    transition: border-color 0.3s, background 0.3s;
}
.radio-pill-controls__item--grow {
    flex: 1;
}
.radio-pill-controls__item:last-child {
    margin-right: 0;
}

.radio-pill-controls__item--active {
    background: rgba(221, 11, 11, 0.2);
    border-color: #f59e0b;
}
.add-founds-pill {

}

.add-founds-pill .radio-pill-controls__item--active {
    background: rgb(14 231 71 / 20%) !important;
    border-color: #0abd07 !important;
}

@media screen and (max-width: 639px) {
    .radio-pill-controls {
        gap: 10px;
        justify-content: space-between;
    }
    .radio-pill-controls__item {
        flex: 1;
        padding: 0 12px;
    }
}
.I {
    align-items: center;
    bottom: 48px;
    display: flex;
    justify-content: space-between;
    left: 0;
    min-height: 30px;
    padding: 4px 12px;
    position: absolute;
    right: 0;
    text-align: center;
}
.I--level--error {
    background: #9e3233;
    color: #fff;
}
.I--level--warning {
    background: #343437;
    color: #cfcfd0;
}
.I__close-icon {
    position: absolute;
    right: 6px;
    top: 6px;
}
.chat-request-delivering-banner {
    align-items: center;
    background-color: #f59e0b;
    color: #a0a0a1;
    display: flex;
    gap: 6px;
    height: 30px;
    margin-bottom: 8px;
    padding: 4px 16px;
    width: 100%;
}
.chat-request-delivering-banner__body {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.chat-request-delivering-banner__close-button {
    background: 0 0;
    border: 0;
    color: #a0a0a1;
    cursor: pointer;
}
.message-list-overlay {
    -webkit-backdrop-filter: blur(0);
    backdrop-filter: blur(0);
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
    transition: backdrop-filter 50ms linear;
    z-index: 2;
}
.message-list-overlay--visible {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    pointer-events: auto;
}
.content-status-changed-personal-notification .success-icon {
    color: #79943d;
    fill: currentColor;
}
.closable-settings-menu .chat-header-personal-notifications-settings {
    right: 56px;
    top: 5px;
    width: 247px;
}
@media (max-width: 639px) {
    .closable-settings-menu .chat-header-personal-notifications-settings {
        bottom: auto;
        right: 107px;
    }
}
.closable-settings-menu .chat-header-personal-notifications-settings .personal-notifications-settings-arrow-up {
    display: none;
}
.c5 {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    margin: 0 8px;
    padding: 12px;
    position: relative;
    transition: background 0.3s;
}
@media (pointer: fine) {
    .c5:hover,
    .c5:hover .c5__icon-circle--hovered {
        background: #343437;
    }
}
.c5__icon-wrapper {
    align-items: center;
    display: flex;
    justify-content: center;
    margin-right: 12px;
    position: relative;
}
.c5__icon-circle {
    align-items: center;
    background-color: #f59e0b;
    border-radius: 14px;
    display: flex;
    height: 44px;
    justify-content: center;
    width: 44px;
}
.c5__icon-circle--free {
    background-color: #21b062;
}
.c5__icon-circle--small {
    background-color: #3e3f42;
    bottom: -3px;
    height: 24px;
    position: absolute;
    right: -1px;
    width: 24px;
}
.c5__icon-circle--error {
    background-color: #ef7d00;
}
.c5__icon-circle--pending {
    background-color: #fccf49;
    color: #232325;
}
.c5__status-icon {
    color: #fff;
    fill: #fff;
}
.c5__pending {
    color: #fccf49;
    margin-left: 8px;
    position: relative;
}
.c5__question-icon {
    margin-left: 5px;
}
.c5__icon {
    margin-right: 5px;
}
.c5__mode {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal;
    color: #fff;
}
.c5__time {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    color: #fff;
    margin-left: 8px;
    opacity: 0.3;
}
.c5__bottom {
    align-items: center;
    column-gap: 12px;
    display: flex;
    margin-top: 4px;
}
.c5__count {
    font-size: 14px;
    font-weight: 400;
    letter-spacing: normal;
    color: rgba(255, 255, 255, 0.6);
    line-height: 17px;
}
.c5__chevron {
    color: rgba(255, 255, 255, 0.6);
    margin-left: auto;
}
.c5__error {
    color: #fd4967;
    margin-left: 8px;
}
.image-loader-placeholder {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);
    background-size: 300% 100%;
    will-change: background-position;
    border-radius: 4px;
    overflow: hidden;
}
.image-with-lazy-loading {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
}
.image-with-lazy-loading--pending::before {
    background: rgba(0, 0, 0, 0.7);
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.image-with-lazy-loading__image {
    clip: rect(0 0 0 0);
    display: none;
    height: 1px;
    margin: -1px;
    position: absolute;
    visibility: hidden;
    width: 1px;
}
.image-with-lazy-loading__placeholder {
    display: none;
    height: 100%;
    left: 0;
    top: 0;
    width: 100%;
}
.image-with-lazy-loading__placeholder--loading {
    display: block;
}
.image-with-lazy-loading__icon {
    align-items: center;
    background-color: #000;
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 34px;
    justify-content: center;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 36px;
}
.image-with-lazy-loading__icon--pending {
    background-color: transparent;
}
.image-with-lazy-loading__icon--pending .icon.icon-sand-clock {
    margin-left: 0;
}
.image-with-lazy-loading__icon .icon {
    fill: currentColor;
    margin-left: 2px;
    margin-right: 0;
}
.c0__media-preview,
.c6__logo {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 14px;
}
.c6__logo {
    align-items: center;
    background-color: #d97706;
    display: flex;
    justify-content: center;
}
.c6__footer {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    justify-content: flex-start;
}
.likes-counter {
    align-items: center;
    background: 0 0;
    border: 0;
    color: inherit;
    cursor: default;
    display: flex;
    opacity: 0.6;
    padding: 0;
    pointer-events: none;
}
.likes-counter--size--small {
    font-size: 12px;
}
.likes-counter--long-format,
.likes-counter--size--medium {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: normal;
}
.likes-counter--long-format {
    font-size: 15px;
}
.likes-counter--clickable {
    cursor: pointer;
    opacity: 1;
    pointer-events: auto;
}
.like-icon--size--small {
    height: 16px;
    margin-right: 4px;
    width: 16px;
}
.like-icon--size--medium {
    height: 20px;
    margin-right: 5px;
    width: 20px;
}
.like-icon.liked {
    color: #f44;
}
.user-media-content-unlock-badge {
    align-items: center;
    border-radius: 6px;
    box-shadow: 0 0 2px rgba(32, 32, 39, 0.3);
    display: flex;
    font-size: 11px;
    font-weight: 700;
    left: 8px;
    max-width: calc(100% - 16px);
    min-height: 24px;
    padding: 4px 8px;
    position: absolute;
    top: 8px;
}
.user-media-content-unlock-badge--style--free {
    background: #f2f2f2;
}
.user-media-content-unlock-badge--style--paid {
    background: #d97706;
}
.user-media-content-unlock-badge__icon {
    color: #fff;
    height: 36px;
    left: 50%;
    opacity: 0.1;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 36px;
}
.multi-check-box-settings-item {
    color: #cfcfd0;
    display: flex;
    font-size: 13px;
    font-weight: 400;
    justify-content: space-between;
    line-height: 16px;
    margin: 14px 0;
}
.bVV {
    background: #111113;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 20px;
}
.bVV__caption {
    align-items: center;
    display: flex;
    margin-bottom: 20px;
}
.bVV__title {
    color: #fff;
    flex: 1;
    font-size: 20px;
    font-weight: 500;
    line-height: 120%;
}
.bVV__tabs-scrollbar {
    border-radius: 12px;
    margin: 20px 0;
}
.bVV__tabs {
    max-width: 640px;
    min-width: 480px;
}
.bVV__tabs--style--expand {
    max-width: 100%;
}
.bVV__dropdown {
    position: relative;
}
.bVV__dropdown .dropdown-menu {
    width: 240px;
}
.bVV__dropdown .dropdown-menu__menu-item {
    padding: 12px 20px;
}
.bVV__dropdown-button {
    align-items: center;
    color: #707071;
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    gap: 6px;
    user-select: none;
}
.bVV__dropdown-button--disabled {
    pointer-events: none;
}
.bVV__dropdown-icon--opened {
    transform: rotate(180deg);
}
.bVV__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    position: relative;
}
.bVV__content--horizontal {
    align-items: center;
    flex-direction: row;
    gap: 40px;
    justify-content: center;
}
.bVV__screen {
    background: rgba(17, 17, 19, 0.9);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.bVV__screen-content {
    align-items: center;
    color: #707071;
    display: flex;
    flex-direction: column;
    gap: 8px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.notifications-subscribers-table .data-table-body-row {
    align-items: center;
    padding: 3px 20px;
}
.payment-cards-list-item {
    align-items: center;
    display: flex;
    font-size: 13px;
    justify-content: space-between;
    margin: 18px 0 0;
}
.payment-cards-list-item__number {
    margin: 0 0 0 12px;
}
.payment-cards-list-item__left {
    align-items: center;
    color: #cfcfd0;
    display: flex;
}
.payment-cards-list-item__right {
    align-items: center;
    color: #a0a0a1;
    display: flex;
}

.bRR {
    background: rgba(17, 17, 19, 0.8);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.bRR__content {
    align-items: center;
    color: #a0a0a1;
    display: flex;
    flex-direction: column;
    left: 50%;
    max-width: 260px;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
}
.bSS {
    background: rgba(17, 17, 19, 0.8);
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 3;
}
.bSS__loader {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 8px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.bZ {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
}
.bZ--vertical {
    align-items: flex-start;
    flex-direction: column;
}
.bZ__item {
    align-items: center;
    border-radius: 10px;
    display: grid;
    grid-auto-flow: column;
    grid-gap: 8px;
    padding: 8px 10px;
    position: relative;
    transition: all 0.1s linear;
}
.bZ__item--hidden {
    opacity: 0.4;
}
.bZ__item--active,
.bZ__item--hovered:hover {
    background: #1b1b1d;
    cursor: pointer;
    opacity: 1;
}
.bZ__item--active .statistics-line-chart__legend-item-label,
.bZ__item--hovered:hover .statistics-line-chart__legend-item-label {
    color: #fff;
}
.bZ__item--disabled {
    opacity: 0.4;
}
.bZ__item-color {
    border-radius: 4px;
    height: 12px;
    width: 12px;
}
.bZ__item-body {
    color: #cfcfd0;
    font-size: 12px;
    font-weight: 700;
    user-select: none;
}
.bZ__tooltip .tooltip-inner {
    background: #343437;
    box-shadow: none;
    color: #cfcfd0;
}
.bZ__tooltip .tooltip-inner--arrow {
    border-color: #343437;
}
.bO {
    display: inline-block;
    position: relative;
}
.bO__button {
    align-items: center;
    background: 0 0;
    border: 2px solid #343437;
    border-radius: 12px;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    flex-flow: row nowrap;
    font-size: 14px;
    font-weight: 400;
    min-height: 40px;
    padding: 8px 20px;
    position: relative;
    white-space: nowrap;
    -webkit-user-select: none;
    user-select: none;
}
.bO__button:hover {
    border-color: #fff;
    color: #fff;
}
.bO__button:active,
.bO__button:focus {
    outline: 0;
}
.bO--open .bO__button {
    background: #343437;
    color: #fff;
}
.bO__button-icon {
    margin-right: 10px;
}
@media screen and (max-width: 639px) {
    .bO__button-icon {
        margin: 0;
    }
}
.bO__dropdown {
    position: absolute;
    right: 0;
    top: calc(100% + 10px);
    z-index: 10;
}
.bO__dropdown-menu {
    background: #1b1b1d;
    border-radius: 12px;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);
    display: flex;
    flex-flow: column nowrap;
    max-width: 100%;
    overflow: hidden;
    transition: opacity 100ms ease;
    width: 248px;
}
.bO__dropdown-menu--hidden {
    opacity: 0;
    pointer-events: none;
}
.bO__dropdown-item {
    font-size: 0.875rem;
    align-items: center;
    background: inherit;
    border: 0;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-weight: 400;
    justify-content: space-between;
    outline: 0;
    padding: 10px 20px;
    text-align: left;
}
.bO__dropdown-item:hover {
    background-color: #232325;
}
.bO__predefine-dates {
    display: flex;
    flex-flow: column nowrap;
}
.bO__custom-interval {
    align-items: center;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    gap: 10px;
    padding: 20px;
    position: relative;
}
.bO__custom-interval::before {
    background: rgba(255, 255, 255, 0.05);
    content: "";
    height: 1px;
    margin: 0 auto;
    position: absolute;
    top: 0;
    width: calc(100% - 40px);
}
.bO__custom-interval--fill {
    color: #fff;
}
.bO__clear-interval {
    align-items: center;
    backdrop-filter: blur(5px);
    background: #050506;
    border: 0;
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 20px;
    justify-content: center;
    outline: 0;
    width: 20px;
}
.bO .V {
    background: #1b1b1d;
    border: 0;
}
.bO__calendar-wrapper {
    position: absolute;
    top: 0;
    z-index: 4;
}
.bO__calendar-wrapper--position--left {
    right: calc(100% + 10px);
}
.bO__calendar-wrapper--position--right {
    left: calc(100% + 10px);
}
.bO__calendar-wrapper--position--mobile {
    background: #1b1b1d;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);
    display: flex;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: 100%;
    transform: translateY(0);
}
.bO__calendar-wrapper--position--mobile.bO__calendar-wrapper--visible {
    transform: translateY(-100%);
}
.bO__close-calendar-mobile {
    background: 0 0;
    border: 0;
    color: #707071;
    display: grid;
    height: 32px;
    padding: 0;
    place-items: center;
    position: absolute;
    right: 0;
    top: -32px;
    width: 32px;
}
.cL {
    align-items: center;
    background: #232325;
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-size: 16px;
    gap: 10px;
    justify-content: space-between;
    min-height: 56px;
    padding: 4px 16px;
    transition: background 0.3s;
}
.cL:hover {
    background: #343437;
}
.cL__left {
    align-items: center;
    display: flex;
    gap: 14px;
}
.bQ,
.cL__right {
    align-items: center;
    display: flex;
}
.bQQ {
    gap: 12px;
}
.bQQ__image {
    background-color: #343437;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 10px;
    color: #d4d4d4;
    display: grid;
    font-size: 16px;
    place-items: center;
    position: relative;
}
.bQQ__image--type--horizontal {
    height: 32px;
    width: 42px;
}
.bQQ__image--type--vertical {
    height: 64px;
    width: 36px;
}
.bQQ__image--type--square {
    height: 32px;
    width: 32px;
}
.bQQ__preview {
    align-items: center;
    background-color: #343437;
    border-radius: 10px;
    display: flex;
    height: 90px;
    justify-content: center;
    left: 50%;
    opacity: 0;
    overflow: hidden;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 120px;
    z-index: 3;
}
.bQQ__preview-image {
    height: 100%;
    margin: 0 auto;
    max-width: 100%;
    object-fit: contain;
    width: auto;
}
.bQQ__title {
    color: #fff;
    font-size: 13px;
    font-weight: 400;
    line-height: 120%;
}
.bQQ__title--clickable {
    cursor: pointer;
}
.bQQ__description {
    color: #707071;
    font-size: 11px;
    font-weight: 400;
    line-height: 125%;
}
.text-post-skeleton .avatar-skeleton {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);
    background-size: 300% 100%;
    will-change: background-position;
    border-radius: 50%;
    height: 40px;
    width: 40px;
}
.text-post-skeleton .model-name-skeleton {
    border-radius: 4px;
    height: 16px;
    margin-bottom: 4px;
    width: 85px;
}
.text-post-skeleton .image-skeleton,
.text-post-skeleton .model-name-skeleton,
.text-post-skeleton .posted-at-skeleton {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);
    background-size: 300% 100%;
    will-change: background-position;
}
.text-post-skeleton .posted-at-skeleton {
    border-radius: 4px;
    height: 12px;
    width: 85px;
}
.text-post-skeleton .image-skeleton {
    height: 256px;
    width: 642px;
}
.text-post-skeleton .footer-skeleton {
    padding: 12px 20px 20px;
}
.text-post-skeleton .first-line,
.text-post-skeleton .second-line {
    animation: skeleton-animation 3s infinite linear;
    background: linear-gradient(90deg, #383838 20%, #404040 28%, #454545 35%, #404040 42%, #383838 50%);
    background-size: 300% 100%;
    will-change: background-position;
    border-radius: 4px;
    height: 19px;
    width: 100%;
}
.text-post-skeleton .second-line {
    margin-top: 12px;
    width: 70%;
}
.personal-notifications-message-item-body .message-body-media-icon {
    fill: currentColor;
    vertical-align: bottom;
}
.personal-notifications-message-item-body .extra-request-icon {
    color: #fccf49;
    margin-right: 7px;
}
.bCC {
    contain: strict;
    min-height: 264px;
}
.bCC__list {
    display: flex;
}
.bCC__item {
    margin-right: 12px;
    min-width: 190px;
    width: 190px;
}
.bCC__item:last-child {
    margin: 0;
}
.select-toggler {
    align-items: center;
    background: #424248;
    border: 2px solid #424248;
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: space-between;
    padding: 0 10px 0 16px;
    transition: background 0.3s, color 0.3s;
}
.select-toggler--opened {
    background: 0 0;
}
.select-toggler__content {
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    padding: 0 14px 0 0;
}
.select-toggler__icon {
    color: #fff;
    opacity: 0.4;
    transition: opacity 0.3s, transform 0.3s;
}
.select-toggler__icon--opened {
    opacity: 1;
    transform: rotate(180deg);
}
.c8__logo {
    align-items: center;
    background-color: #d97706;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 14px;
    display: flex;
    justify-content: center;
    position: relative;
}
.c8__icon--small {
    align-items: center;
    background: #d97706;
    border-radius: 50%;
    bottom: -4px;
    display: flex;
    height: 24px;
    justify-content: center;
    position: absolute;
    right: -4px;
    width: 24px;
}
.cw {
    border-radius: 4px;
    flex: 1;
    overflow: hidden;
    position: relative;
}
.cw__thumbs {
    display: flex;
    height: 50px;
}
.cw__item {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: inherit;
    pointer-events: none;
    position: relative;
}
.cw__control {
    border: 2px solid #f59e0b;
    border-radius: 4px;
    box-shadow: 0 0 0 500px rgba(0, 0, 0, 0.6);
    cursor: grab;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
}
.cw__control--hidden {
    opacity: 0;
}
.chat-notifications-header {
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 2;
}
.personal-notifications-price-control {
    align-items: center;
    background: #343437;
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.6);
    display: flex;
    justify-content: space-between;
    margin: 10px 0;
    min-height: 34px;
    padding: 10px 12px;
}
.personal-notifications-price-control-text,
.personal-notifications-price-control-value {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    color: #fff;
}
.personal-notifications-price-control-value {
    font-weight: 700;
    color: #d97706;
}
.personal-notifications-price-control-free {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    color: rgba(255, 255, 255, 0.8);
}
.personal-notifications-price-control-change {
    font-size: 13px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    text-decoration: underline;
}
.personal-notifications-price-control.disabled {
    opacity: 0.6;
    pointer-events: none;
}
.personal-notifications-settings-overlay {
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    bottom: 0;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
}
@media screen and (max-width: 639px) {
    .personal-notifications-settings-overlay {
        z-index: 10;
    }
}
.personal-notifications-settings {
    animation: opacity-fade-show 0.2s;
    background: #232325;
    border-radius: 8px;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.25);
    color: #fff;
    cursor: default;
    display: flex;
    flex-flow: column nowrap;
    padding: 10px 20px;
    position: absolute;
    right: 31px;
    text-decoration: none;
    top: 33px;
    width: 350px;
    z-index: 11;
    -webkit-user-select: none;
    user-select: none;
}
.personal-notifications-settings-line {
    background: #fff;
    height: 1px;
    margin: 12px 0 10px;
    opacity: 0.1;
}
.personal-notifications-settings-question {
    align-items: center;
    border: 1px solid currentColor;
    border-radius: 50%;
    display: inline-flex;
    font-size: 11px;
    height: 14px;
    justify-content: center;
    margin: 0 0 0 6px;
    width: 14px;
}
.personal-notifications-settings.is-hiding {
    animation: opacity-fade-hide 0.1s;
    opacity: 0;
    pointer-events: none;
}
.personal-notifications-settings-arrow-up {
    border-bottom: 5px solid #232325;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    height: 0;
    position: absolute;
    right: 20px;
    top: -5px;
    width: 0;
}
.personal-notifications-settings.dialog-settings .personal-notifications-switcher,
.personal-notifications-settings.messenger-settings .personal-notifications-switcher {
    margin-left: -20px;
    margin-right: -20px;
    padding: 10px 20px;
}
.personal-notifications-settings.dialog-settings .personal-notifications-switcher:hover,
.personal-notifications-settings.messenger-settings .personal-notifications-switcher:hover {
    background-color: #343437;
    text-decoration: none;
}
.personal-notifications-settings .icon {
    height: 20px;
    width: 20px;
}
.personal-notifications-settings h3 {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    align-items: center;
    display: flex;
    margin: 10px 0 12px;
}
@media screen and (max-width: 639px) {
    .personal-notifications-settings {
        bottom: 41px;
        left: 7px;
        right: 7px;
        top: unset;
        width: unset;
    }
    .personal-notifications-settings .personal-notifications-settings-arrow-up {
        display: none;
    }
}
.personal-notifications-switcher {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: 20px;
    align-items: center;
    color: #fff;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    position: relative;
    transition: opacity 0.5s;
}
.personal-notifications-switcher:hover {
    text-decoration: none;
}
.personal-notifications-switcher--split {
    margin-top: 22px;
}
.personal-notifications-switcher--split::after {
    background: #fff;
    content: "";
    height: 1px;
    left: 20px;
    opacity: 0.2;
    position: absolute;
    right: 20px;
    top: -10px;
}
.personal-notifications-switcher--disabled {
    opacity: 0.6;
    pointer-events: none;
}
.personal-notifications-switcher-name {
    align-items: center;
    color: #fff;
    display: flex;
    flex: 1;
    padding-right: 12px;
    text-align: left;
}
.personal-notifications-switcher-name .icon {
    color: #fff;
    fill: currentColor;
    height: 18px;
    margin: 0 16px 0 0;
    min-width: 18px;
    width: 18px;
}
.personal-notifications-switcher .icon-arrow-right {
    color: rgba(255, 255, 255, 0.6);
    height: 18px;
    margin: 0;
    width: 18px;
}
.personal-notifications-switcher .switcher {
    pointer-events: none;
}
.gg {
    border-bottom: 1px solid #29292b;
    display: flex;
    gap: 12px;
    padding: 20px 0;
}
.gg:last-child {
    border-bottom: 0;
}
.g__left,
.g__right {
    flex: 1;
}
.g__right-inner {
    display: flex;
    gap: 10px;
}
.g__header {
    align-items: center;
    display: flex;
    font-size: 16px;
    gap: 12px;
}
.g__number {
    align-items: center;
    background: #29292b;
    border-radius: 8px;
    color: #a0a0a1;
    display: flex;
    font-size: 14px;
    height: 24px;
    justify-content: center;
    width: 24px;
}
.g__description {
    color: #a0a0a1;
    font-size: 14px;
    line-height: 20px;
    padding: 6px 0 0;
}
.g__example {
    align-items: flex-end;
    background: #343437;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    height: 120px;
    margin: 20px 0 0;
    overflow: hidden;
    padding: 10px;
    position: relative;
    text-align: center;
    width: 90px;
}
.g__example::before {
    background: rgba(0, 0, 0, 0.4);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.g__example:hover .g__img {
    transform: scale(1.1);
}
.g__img {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    transition: transform 0.3s;
    width: 100%;
}
.g__example-expand {
    align-items: center;
    backdrop-filter: blur(2px);
    background: rgba(5, 5, 6, 0.4);
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 32px;
    justify-content: center;
    position: absolute;
    right: 8px;
    top: 8px;
    transition: background 0.3s;
    width: 32px;
    z-index: 1;
}
.g__example-text {
    position: absolute;
    z-index: 1;
}
@media (max-width: 639px) {
    .g {
        flex-direction: column;
    }
    .g__left {
        display: flex;
        gap: 20px;
        justify-content: space-between;
    }
    .g__example {
        margin: 0;
    }
}
.h {
    background: #343437 center no-repeat;
    background-origin: border-box;
    background-size: contain;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    min-height: 160px;
    overflow: hidden;
    position: relative;
}
.h--disabled {
    pointer-events: none;
}
.h:hover {
    background-color: #424248;
}
.h--rejected,
.h--rejected:hover {
    background: #000;
}
.h--error {
    border: 1px solid #5e152a;
}
.h--pending {
    opacity: 0.5;
    pointer-events: none;
}
.h--with-image::before {
    background: rgba(0, 0, 0, 0.8);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1;
}
.h__item {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
    padding: 16px;
    position: relative;
    z-index: 1;
}
.h__item::before {
    background: rgba(255, 255, 255, 0.05);
    content: "";
    height: 1px;
    left: 32px;
    position: absolute;
    right: 32px;
    top: 0;
}
.h__item:first-child::before {
    display: none;
}
.h__content {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    gap: 10px;
    justify-content: center;
    text-align: center;
}
.h__content-header {
    align-items: center;
    display: flex;
    gap: 10px;
}
@media (max-width: 639px) {
    .h {
        min-height: 60px;
    }
}
.trial-link-creation-form {
    margin-bottom: 20px;
}
.trial-link-creation-form__form {
    padding: 16px;
}
.trial-link-creation-form__content {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-bottom: 16px;
}
.trial-link-creation-form__select-label {
    color: #fff;
    font-size: 12px;
    font-weight: 700;
    margin: 0 0 8px;
}
.trial-link-creation-form__select {
    width: 284px;
}
.trial-link-creation-form__select--small {
    width: 158px;
}
.trial-link-creation-form__actions {
    display: flex;
    gap: 16px;
    justify-content: flex-end;
}
.b__info {
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 16px;
    padding: 16px;
}
.b__actions,
.b__info-row {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.b__actions {
    flex: 1;
    gap: 22px;
}
.b__trial-members {
    color: #707071;
    pointer-events: none;
    position: relative;
}
.b__trial-members--active {
    cursor: pointer;
    pointer-events: auto;
}
.b__users-menu {
    bottom: calc(100% + 8px);
    position: absolute;
    right: 0;
}
.b__copy-button-container {
    position: relative;
}
.b__copy-button {
    display: flex;
    gap: 12px;
}
.b__delete-button {
    background: 0 0;
    border: 0;
    border-radius: 2px;
    color: #707071;
    cursor: pointer;
    margin-left: auto;
    padding: 2px;
}
.b__delete-button:hover {
    background: rgba(248, 248, 248, 0.1);
    color: #fff;
}

.b1 {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background: rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    color: #707071;
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));
    font-size: 12px;
    font-weight: 500;
    padding: 8px;
    pointer-events: none;
    position: fixed;
    transition: opacity 0.1s linear;
    z-index: 3;
}
.b1--position--center {
    transform: translateX(-50%);
}
.b1--position--left {
    transform: translateX(-10%);
}
.b1--position--right {
    transform: translateX(-90%);
}
.b1--type--bar.b1--position--left,
.b1--type--doughnut.b1--position--left {
    transform: translateX(5px);
}
.b1--type--bar.b1--position--right,
.b1--type--doughnut.b1--position--right {
    transform: translateX(calc(-100% - 5px));
}
.b1--type--bar.b1--position--right .b1__arrow,
.b1--type--doughnut.b1--position--right .b1__arrow {
    left: unset;
    right: 0;
    transform: translate(50%, -50%) rotate(-135deg);
}
.b1__arrow {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background: rgba(255, 255, 255, 0.2);
    border-bottom-left-radius: 2px;
    clip-path: polygon(0 0, 0 100%, 100% 100%);
    filter: drop-shadow(0 1px 20px rgba(0, 0, 0, 0.4));
    height: 10px;
    left: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%) translateX(-50%) rotate(45deg);
    width: 10px;
}
.b1__line {
    background: rgba(255, 255, 255, 0.1);
    border-radius: 0 0 1px 1px;
    position: absolute;
    transform: translateX(-50%);
    transition: all 0.1s linear;
    width: 2px;
    z-index: 1;
}
.b1__title {
    margin-bottom: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.b1__items {
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 8px;
}
.b1__item {
    align-items: center;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 6px;
}
.b1__color {
    border-radius: 4px;
    flex: 0 1 12px;
    height: 12px;
    width: 12px;
}
.b1__label {
    color: #cfcfd0;
    flex: 1;
    margin-right: 4px;
    white-space: nowrap;
}
.b1__value {
    color: #fff;
    text-align: right;
    white-space: nowrap;
}
.b6 {
    align-items: start;
    color: #a0a0a1;
    display: flex;
    gap: 18px;
    margin-bottom: 20px;
    padding: 18px;
}
.b6__title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 20px;
    margin-bottom: 14px;
}
.b6__list {
    margin-bottom: 28px;
}
.b6__list-item {
    margin-bottom: 6px;
}
.dashboard-widget {
    background: #232325;
    border-radius: 12px;
    display: flex;
    height: 140px;
    justify-content: center;
}
.dashboard-widget__content {
    align-items: center;
    display: flex;
    width: 100%;
}
.dashboard-widget-item {
    flex: 1;
    padding: 0 16px;
    position: relative;
    text-align: center;
}
.dashboard-widget-item--split {
    border-left: 1px solid rgba(255, 255, 255, 0.05);
}
.dashboard-widget-item__label {
    margin: 0 0 16px;
}
.messenger-chat-stub {
    align-items: center;
    background: #343437;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 12px;
    padding: 16px;
}
.messenger-chat-stub__or {
    font-size: 12px;
    line-height: 20px;
    margin: 6px 0;
    opacity: 0.6;
}
.messenger-chat-stub .blocked-icon {
    height: 45px;
    width: 45px;
}
.messenger-chat-stub .stub-title {
    font-size: 17px;
    margin: 16px 0;
    text-align: center;
}
.messenger-chat-stub .stub-description {
    font-size: 12px;
    line-height: 20px;
    margin: 0 0 12px;
    opacity: 0.6;
    text-align: center;
}
.messenger-chat-stub .stub-description-link {
    color: inherit;
    cursor: pointer;
    text-decoration: underline;
}
.messenger-chat-stub .stub-description-link:hover {
    color: #fff;
}
.messenger-chat-stub__message-icon-wrapper {
    align-items: center;
    background: url('') no-repeat;
    background-size: contain;
    display: flex;
    height: 56px;
    justify-content: center;
    margin: 0 auto;
    width: 56px;
}
.messenger-chat-stub__message-icon {
    display: block;
    height: 20px;
    width: 20px;
}
.messenger-chat-stub__unlock {
    animation: opacity-zoom-fade-hide 1.5s;
    bottom: 50%;
    display: flex;
    justify-content: center;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 1;
}
.messenger-chat-stub__unlock-icon {
    height: 30px;
    width: 30px;
}
.chart-canvas {
    position: relative;
    z-index: 2;
}
.oo {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    gap: 8px;
    height: 28px;
    padding: 0 8px;
}
.image-swiper__root--disabled .t {
    pointer-events: none;
}
.t {
    align-items: center;
    color: #fff;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    left: 0;
    padding: 20px 14px;
    position: absolute;
    text-align: center;
    top: 0;
    transform: none;
    width: 100%;
    z-index: 1;
}
.t--fill--locked {
    background: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%) no-repeat center;
    background-size: cover;
    border-radius: 12px;
}
.t--fill--moderation {
    background-color: rgba(252, 207, 73, 0.8);
    color: #000;
}
.t--fill--rejected {
    background-color: rgba(210, 27, 76, 0.6);
    color: #cfcfd0;
}
.t--dark {
    background: rgba(0, 0, 0, 0.2);
}
@media screen and (max-width: 639px) {
    .t {
        min-height: 135px;
        min-width: 135px;
    }
}
.t__icon--size--regular {
    height: 40px;
    width: 40px;
}
.t__icon--size--big {
    height: 58px;
    width: 58px;
}
.t__title {
    font-size: 16px;
    font-weight: 700;
    margin-top: 16px;
    padding: 0 12px;
    white-space: normal;
    word-break: normal;
}
@media screen and (max-width: 639px) {
    .t__title {
        font-size: 12px;
        font-weight: 400;
        letter-spacing: normal;
        line-height: normal;
        margin-top: 12px;
    }
}
.t__description {
    font-size: 13px;
    margin-top: 16px;
    max-width: 310px;
    padding: 0 12px;
    white-space: normal;
    word-break: normal;
}
.t .content-lock-button {
    margin: 20px 0 0;
}
@media screen and (max-width: 639px) {
    .t .content-lock-button {
        margin: 12px 0 0;
    }
}

.t__content {
    overflow: hidden
}

.t__name {
    align-items: center;
    display: flex
}

.t__name .username {
    font-weight: 700
}

.t__text {
    color: rgba(255, 255, 255, .6);
    margin: 5px 0 0;
    min-height: 16px;
    overflow: hidden;
    padding-right: 40px;
    text-overflow: ellipsis;
    white-space: nowrap
}

.t__time {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    margin: 0 0 0 6px;
    opacity: .3
}

.t__menu {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    opacity: .4;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: opacity .3s;
    width: 32px
}

@media screen and (max-width:639px) {
    .t__menu {
        height: 44px;
        margin-right: -8px;
        width: 44px
    }
}

.t__menu:hover {
    opacity: 1
}

.t__new {
    align-items: center;
    background: #ff5f5f;
    border-radius: 10px;
    color: #fff;
    display: flex;
    font-size: 11px;
    height: 20px;
    justify-content: center;
    min-width: 20px;
    padding: 0 4px;
    pointer-events: none;
    position: absolute;
    right: 30px
}

.t .personal-notifications-settings {
    bottom: unset;
    left: unset;
    right: -8px;
    top: 56px
}

@media screen and (max-width:639px) {
    .t .personal-notifications-settings {
        bottom: unset;
        left: 7px;
        right: 7px;
        top: 56px;
        width: unset
    }
}

.t--menu--top .personal-notifications-settings {
    bottom: 56px;
    top: unset
}

@media screen and (max-width:639px) {
    .t--menu--top .personal-notifications-settings {
        bottom: 56px;
        top: unset
    }
}

.t--menu--top .personal-notifications-settings-arrow-up {
    bottom: -5px;
    top: unset;
    transform: rotate(180deg)
}

.t .personal-notifications-switcher-name {
    cursor: pointer;
    text-decoration: none
}

.t .personal-notifications-switcher-name:hover {
    color: #fff
}
.user-list-actions__container {
    display: table;
    width: 100%;
}
.user-list-actions .scroll-bar-container {
    max-height: 200px;
}
.counterpart-text-message,
.own-text-message {
    color: #fff;
    padding: 10px 12px;
    position: relative;
    word-break: break-word;
}
.own-text-message {
    background-color: rgb(129 40 40 / 28%);
}
.counterpart-text-message {
    background-color: #151516;
}
.counterpart-text-message .text-message-indicators {
    right: 8px;
}
.Q {
    background: #151516;
}
.Q--own {
    background: rgba(91, 65, 255, 0.2);
}
.Q__gallery {
    background: #151516;
    height: 240px;
    min-height: 214px;
    min-width: 220px;
    position: relative;
}
.Q__gallery--uncovered {
    height: 214px;
}
.Q__icon {
    color: #cfcfd0;
    left: 8px;
    pointer-events: none;
    position: absolute;
    top: 8px;
}
.Q__footer {
    padding: 10px 12px 26px;
    text-align: left;
}
.Q__counters {
    color: #a0a0a1;
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    margin-top: 2px;
}
.Q__body {
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    margin: 5px 0 0;
    padding-top: 5px;
    word-break: break-word;
}
.Q__right-bottom {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 12px;
    text-transform: uppercase;
    align-items: center;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    color: rgba(248, 248, 248, 0.8);
    display: flex;
    justify-content: center;
    padding: 4px 8px;
    position: absolute;
    right: 8px;
    top: calc(100% - 8px);
    transform: translateY(-100%);
}
.Q__play-icon {
    color: #fff;
    position: absolute;
    right: 8px;
    top: 8px;
}
.J {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 12px;
    font-weight: 600;
    height: 40px;
    justify-content: center;
}
.J--type--default {
    background-color: #424248;
}
.J--type--warning {
    background-color: #ffc107;
    color: #050506;
}
.J--type--warning .J__button-view-request {
    border-color: rgba(5, 5, 6, 0.4);
}
.J--type--alert {
    background-color: #ef7d00;
}
.J__cart-icon--with-notification {
    position: relative;
}
.J__cart-icon--with-notification:after {
    background-color: #e12947;
    border: 2px solid #424248;
    border-radius: 50%;
    content: "";
    height: 7px;
    position: absolute;
    right: -4px;
    top: -2px;
    width: 7px;
}
.J__body {
    align-items: center;
    color: inherit;
    display: flex;
    flex: 1;
    gap: 12px;
    justify-content: center;
}
.J__button-view-request {
    background: 0 0;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 10px;
    color: inherit;
    cursor: pointer;
    font-size: 12px;
    height: 24px;
    padding: 2px 12px;
}
.users-dropdown-list {
    background: #1b1b1d;
    border: 1px solid rgba(255, 255, 255, 0.02);
    border-radius: 12px;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
    max-width: 100%;
    overflow: hidden;
    width: 280px;
}
.users-dropdown-list__header {
    padding: 12px 16px;
}
.users-dropdown-list__body {
    max-height: 168px;
    overflow-y: auto;
}
.users-dropdown-list__item {
    height: 56px;
    padding: 8px 16px;
}
.users-dropdown-list__item:hover {
    background-color: #343437;
}
.dd {
    align-items: center;
    background: #232325;
    border-radius: 12px;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 12px 16px;
}
.dd__left {
    word-break: break-word;
}
.dd__right {
    align-items: center;
    display: flex;
    gap: 10px;
    white-space: nowrap;
}
.PPP {
    background: #232325;
    height: 240px;
    overflow: inherit;
}
.P__play {
    align-items: center;
    background-color: #000;
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 34px;
    justify-content: center;
    width: 34px;
}
.user-list-actions-item {
    align-items: center;
    display: flex;
    margin: 12px 0;
}
.user-list-actions-item__left {
    flex: 1;
}
.user-list-actions-item__right {
    align-items: center;
    display: flex;
    justify-content: flex-end;
}
.user-list-actions-item__label {
    margin: 0 0 0 10px;
    white-space: nowrap;
}
.user-list-actions-item__icon {
    align-items: center;
    color: #707071;
    display: flex;
    justify-content: center;
    margin: 0 0 0 20px;
    width: 24px;
}
.message-indicators {
    color: rgba(255, 255, 255, 0.4);
    float: right;
    font-size: 10px;
    line-height: 16px;
    margin-left: 3px;
    pointer-events: none;
    -webkit-user-select: none;
    user-select: none;
}
.message-indicators__content {
    position: relative;
    right: -6px;
    top: 5px;
    white-space: nowrap;
}
.message-indicators__error-wrapper {
    margin: 0 0 0 7px;
}
.message-indicators__error-icon {
    color: #ffc107;
    height: 10px;
    width: 10px;
}
.message-indicators .read-icon {
    color: rgba(255, 255, 255, 0.4);
    fill: currentColor;
    height: 8px;
    margin: 0 0 0 3px;
}
.message-indicators .read-icon.icon-check-4 {
    margin-right: 3px;
    width: 11px;
}
.message-indicators .read-icon.icon-read {
    width: 14px;
}
.message-indicators.with-absolute-position {
    bottom: 6px;
    position: absolute;
    right: 6px;
}
.message-indicators.with-absolute-position .message-indicators-placeholder {
    display: none;
}
.message-indicators.with-absolute-position .message-indicators-content {
    position: static;
}
.message-indicators.with-background {
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 4px;
    color: rgba(255, 255, 255, 0.8);
    line-height: 10px;
    padding: 4px;
}
.message-indicators.with-background .read-icon {
    color: rgba(255, 255, 255, 0.8);
}
.message-indicators.with-background .message-indicators__content {
    right: auto;
    top: auto;
}
.counterpart-base-message .message-indicators {
    margin-left: 5px;
}
.counterpart-base-message .message-indicators .message-indicators-content,
.counterpart-base-message .message-indicators.with-absolute-position {
    right: 8px;
}
.counterpart-base-message .message-indicators .read-icon {
    display: none;
}
.TT {
    cursor: pointer;
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 4px;
    margin-bottom: 4px;
    max-width: 80%;
    min-height: 24px;
    padding-left: 6px;
    position: relative;
}
.TT:hover .TT__title {
    color: #fff;
}
.TT__label {
    color: #f59e0b;
    font-size: 12px;
    font-weight: 400;
    white-space: nowrap;
}
.TT::before {
    background-color: #f59e0b;
    border-radius: 1px;
    bottom: 0;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    top: 0;
    width: 2px;
}
.TT__title {
    color: #707071;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.SS {
    align-items: center;
    background: rgba(0, 0, 0, 0.6);
    border: 0;
    border-radius: 20px;
    color: #fff;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    justify-content: center;
    left: 50%;
    max-width: 85%;
    min-width: 118px;
    padding: 10px 20px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: background 0.3s;
}
.S__icon {
    fill: currentColor;
    height: 20px;
    margin: 0;
}
.S__icon--unlocked {
    color: #34b353;
}
.S__label {
    margin-top: 8px;
}
.S__price {
    font-weight: 700;
}
.S__original-price {
    color: #b5b6b7;
    font-weight: 700;
    text-decoration: line-through;
}
.OPA {
    display: grid;
    gap: 2px;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    height: 100%;
    width: 100%;
}
.O__item {
    align-items: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center;
}
.L__header {
    color: #707071;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    gap: 4px;
    margin: 0 0 4px;
    position: relative;
}
.L__header::before {
    background: rgba(255, 255, 255, 0.4);
    border-radius: 1px;
    bottom: 0;
    content: "";
    position: absolute;
    top: 0;
    width: 2px;
}
.L__header--style--left {
    padding: 0 0 0 8px;
}
.L__header--style--left::before {
    left: 0;
}
.L__header--style--right {
    align-items: end;
    padding: 0 8px 0 0;
    text-align: right;
}
.L__header--style--right::before {
    right: 0;
}
.L__body {
    word-break: break-word;
}
.L__image-wrapper {
    align-items: center;
    aspect-ratio: 0.5625;
    background: no-repeat center;
    background-size: cover;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    width: 90px;
}
.L__image {
    flex: 1;
    max-height: 100%;
    max-width: 100%;
}
.L__empty {
    background: #343437;
    border-radius: 8px;
    color: #707071;
    line-height: 120%;
    max-width: 90px;
    padding: 10px;
    text-align: center;
}
.K__header {
    align-items: center;
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 6px;
    justify-content: space-between;
    padding: 0 12px 10px;
}
.K__sub-header {
    align-items: center;
    display: flex;
    gap: 4px;
}
.K__footer {
    display: flex;
    gap: 8px;
    justify-content: start;
    margin-top: 8px;
}
.K__footer--disabled {
    opacity: 0.4;
}
.K__delivered-time {
    align-items: center;
    color: #a0a0a1;
    display: grid;
    font-size: 13px;
    font-weight: 500;
    grid-auto-flow: column;
    grid-column-gap: 6px;
}
.K__link {
    color: #fff;
    text-decoration: underline;
}
.K__title {
    color: #f59e0b;
    cursor: pointer;
}
.photo-message {
    background: #343437;
}
.photo-message--own {
    background: rgba(91, 65, 255, 0.2);
}
.photo-message__body {
    padding: 10px 10px 20px;
    word-break: break-word;
}
.album-message__album-image.image-with-loader,
.photo-message__photo-image {
    height: unset;
    max-height: 220px;
    max-width: 100%;
    min-height: 150px;
    min-width: 172px;
    object-fit: cover;
}
.photo-message__photo-image--blocked {
    filter: blur(10px);
}
.photo-message-modal-content {
    border-radius: 0;
}
.photo-message-modal-content.photo-message-modal-loading .image {
    filter: blur(15px);
    width: 50vw;
}
.album-message {
    background: #343437;
    position: relative;
}
.album-message--own {
    background: rgba(91, 65, 255, 0.2);
}
.album-message__body {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    margin: 10px 12px 0;
    padding: 10px 0 20px;
    word-break: break-word;
}
.album-message .image-container {
    position: relative;
}
.album-message .image-container .a11y-button {
    display: block;
}
.album-message__texts {
    padding: 10px 12px;
    text-align: left;
}
.album-message__photos-count {
    color: #a0a0a1;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
    margin-top: 2px;
}
.album-message span.message-indicators.with-absolute-position {
    bottom: 10px;
    right: 12px;
}
.media-unlocked-message {
    border: 2px solid rgba(91, 65, 255, 0.2);
    padding: 8px 12px;
    position: relative;
    word-wrap: break-word;
}
.media-unlocked-message-media-button {
    color: rgba(255, 255, 255, 0.6);
    cursor: pointer;
    text-decoration: underline;
}
.media-unlocked-message-media-button:hover {
    color: rgba(255, 255, 255, 0.8);
}
.video-message {
    position: relative;
    height: unset;
    max-height: 220px;
    max-width: 100%;
    min-height: 150px;
    min-width: 172px;
    object-fit: cover;
}
.video-message--body {
    background: rgba(91, 65, 255, 0.2);
}
.video-message__body {
    padding: 10px 10px 20px;
    word-break: break-word;
}
.video-message__video-image {
    height: unset;
    max-height: 220px;
    max-width: 100%;
    min-width: 172px;
    object-fit: cover;
    min-height: 160px;
}
.video-message .play {
    align-items: center;
    background-color: rgba(0, 0, 0, 0.6);
    border-radius: 50%;
    color: #f8f8f8;
    display: flex;
    height: 50px;
    justify-content: center;
    left: 50%;
    margin: 0;
    padding: 15px;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 50px;
}
.video-message .play-icon {
    fill: currentColor;
    height: 25px;
    left: 15px;
    margin: 0;
    position: absolute;
    top: 12px;
    width: 25px;
}
.video-message .right-top {
    display: flex;
    flex-flow: row nowrap;
    height: 20px;
    position: absolute;
    right: 8px;
    top: 8px;
}
.video-message .duration {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 12px;
    text-transform: uppercase;
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    color: rgba(248, 248, 248, 0.8);
    padding: 4px 8px;
}
.processing-video-message,
.video-message .duration,
.video-message .mini-play {
    align-items: center;
    display: flex;
    justify-content: center;
}
.video-message .mini-play {
    background-color: rgba(0, 0, 0, 0.4);
    border-radius: 4px;
    color: rgba(248, 248, 248, 0.8);
    margin-right: 8px;
    padding: 4px 6px;
}
.video-message .mini-play-icon {
    fill: currentColor;
    margin: 0;
}
.processing-video-message {
    background-color: #515255;
    color: #fff;
    flex-flow: column nowrap;
    padding: 81px 40px;
    text-align: center;
}
.processing-video-message .time-icon {
    margin: 0 0 10px;
}
.date-message {
    color: #fff;
    opacity: 0.4;
    -webkit-user-select: none;
    user-select: none;
}
.tipped-message.base-message {
    background: rgba(33, 176, 98, 0.2);
}
.base-message-wrapper {
    align-items: flex-end;
    display: flex;
    flex: 1;
    padding: 8px 12px 0;
    position: relative;
    width: 100%;
}
.base-message-wrapper--left {
    justify-content: flex-start;
}
.base-message-wrapper--right {
    justify-content: flex-end;
}
.base-message-wrapper--mobile .base-message {
    -webkit-user-select: none;
    user-select: none;
}
.base-message-wrapper--position--left {
    justify-content: flex-start;
}
.base-message-wrapper--position--left > .base-message {
    transform-origin: left bottom;
}
.base-message-wrapper--position--left > .base-message__clone {
    left: 40px;
}
.base-message-wrapper--position--right {
    justify-content: flex-end;
}
.base-message-wrapper--position--right > .base-message {
    transform-origin: right bottom;
}
.base-message-wrapper--position--right > .base-message__clone {
    right: 12px;
}
.base-message-wrapper--special-request {
    background: #1b1b1d;
    flex-wrap: wrap;
    margin: 8px 0;
    padding-bottom: 8px;
}
.base-message-wrapper__resend-wrapper {
    color: #fff;
    cursor: pointer;
    left: 10px;
    margin: -8px 0 0;
    opacity: 0.6;
    position: absolute;
    top: 50%;
}
.base-message-wrapper__resend-wrapper:hover {
    opacity: 1;
}
.base-message-wrapper__resend-icon {
    height: 15px;
    width: 15px;
}
.base-message-wrapper__content {
    max-width: 70%;
}
.base-message-wrapper__header {
    position: relative;
}
.base-message-wrapper__body-wrapper {
    align-items: flex-end;
    display: flex;
    flex: 1;
    position: relative;
}
.base-message {
    border-radius: 16px 16px 6px 16px;
    flex: 1;
    font-size: 14px;
    line-height: 17px;
    overflow: hidden;
    -webkit-touch-callout: none;
    text-align: left;
}
.base-message-clickable {
    cursor: pointer;
}
.base-message__clone {
    bottom: 0;
    max-width: calc(70% - 17px);
    z-index: 10;
    -webkit-user-select: none;
    user-select: none;
}
.counterpart-base-message {
    border-radius: 16px 16px 16px 6px;
    position: relative;
}
.image-with-loader {
    height: 150px;
    max-width: 100%;
    object-fit: cover;
}
.image-with-loader-placeholder {
    background: linear-gradient(246.82deg, #4a2b08 0, #140a02 100%) no-repeat center;
    height: 150px;
    width: 200px;
}
.announcement-message {
    font-size: 11px;
    line-height: 12px;
    margin-top: 30px;
    text-align: center;
}
.R {
    display: flex;
    justify-content: flex-end;
    position: relative;
}
.R .ba__menu-item:hover {
    background: #424248;
}
.R .ba__menu-item .ba__menu-item-icon {
    height: 18px;
    width: 18px;
}
.R--counterpart {
    order: 3;
}
.R--counterpart .R__desktop-menu {
    left: 12px;
    margin-left: 4px;
    transform: translateX(-6px);
}
.R--counterpart .R__desktop-menu--visible {
    transform: translateX(0);
}
.R__desktop-menu {
    bottom: 0;
    margin-right: 4px;
    opacity: 0;
    padding-bottom: 6px;
    pointer-events: none;
    position: absolute;
    right: 0;
    transform: translateX(6px);
    transition: all 200ms ease;
    z-index: 2;
}
.R__desktop-menu--visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateX(0);
}
.R__desktop-menu .css-popover-content-topleft,
.R__desktop-menu .css-popover-content-topright {
    top: -6px;
}
.R--mobile {
    z-index: 11;
}
.R--mobile.R--position--bottomleft .R__mobile-menu {
    left: -64px;
    right: auto;
    top: 0;
}
.R--mobile.R--position--bottomright .R__mobile-menu {
    left: -24px;
    right: auto;
    top: -4px;
}
.R--mobile.R--position--left {
    bottom: 0;
    left: 0;
    position: absolute;
}
.R--mobile.R--position--left .R__mobile-menu {
    bottom: 12px;
    left: 0;
    right: auto;
}
.R--mobile.R--position--right .R__mobile-menu {
    bottom: 0;
    left: -40px;
    right: auto;
}
.R--mobile.R--position--topleft {
    position: absolute;
    right: 0;
    top: 0;
}
.R--mobile.R--position--topleft .R__mobile-menu {
    bottom: 0;
    right: 34px;
}
.R--mobile.R--position--topright {
    left: 74px;
    position: absolute;
    top: 0;
}
.R--mobile.R--position--topright .R__mobile-menu {
    bottom: 0;
    left: 0;
    right: auto;
}
.R--mobile.R--position--middleright .R__mobile-menu {
    bottom: 12px;
    left: 10px;
    right: auto;
}
.R--mobile.R--position--middleleft .R__mobile-menu {
    bottom: 12px;
    right: 12px;
}
.R__mobile-menu {
    bottom: 0;
    opacity: 0;
    position: absolute;
    right: 34px;
    transform: translateY(-6px);
    transition: all 200ms ease;
}
.R__mobile-menu--visible {
    opacity: 1;
    transform: translateY(0);
}

.media-gallery--mobile-portrait{
    bottom: 60px;
}

.media-gallery--mobile-portrait .media-gallery__content-wrapper{
    left: 0px;
    position: absolute;
    background: #000;
    bottom: 0px; 
    right: 0px; 
    top: 0px;    
}

.media-gallery--mobile-portrait .comments-gallery__footer {
    padding-bottom: max(12px,env(safe-area-inset-bottom))
}

.media-gallery--mobile-portrait .ch__comments,.media-gallery--mobile-portrait .ch__user-tags {
    
}

.media-gallery--mobile-portrait .ch__user {
    bottom: 75px;
    left: 10px;
    position: fixed;
    top: auto;
    z-index: 4
}

.media-gallery--mobile-portrait .ch__user--video {
    bottom: 140px
}

.media-gallery--mobile-portrait .ch__controls {
    flex: 1;
    justify-content: space-between;
    left: -2px;
    position: relative;
    width: 100%;
    display: flex;
}

.media-gallery--mobile-portrait .tile-button {
    background: 0 0;
    border-radius: 0;
    font-weight: 700;
    height: 36px;
    padding: 0 8px
}

.media-gallery--mobile-portrait .tile-button:hover {
    background: 0 0
}

.media-gallery--mobile-portrait .tile-button__text {
    display: none
}

.media-gallery--mobile-portrait .tile-button__count {
    margin: 0 0 0 6px
}

.ch--has-title .media-gallery--mobile-portrait .ch__user {
    bottom: 130px
}

.media-gallery--mobile-landscape .ch__user {
    left: 10px;
    position: fixed;
    z-index: 4
}

.media-gallery--mobile-landscape .ch__controls {
    filter: drop-shadow(0 0 4px rgba(0,0,0,.8));
    flex-direction: column;
    height: 100%;
    justify-content: center
}

.media-gallery--mobile-landscape .tile-button {
    background: 0 0;
    border-radius: 0;
    color: #fff;
    flex-direction: row-reverse;
    font-weight: 700;
    height: 36px;
    padding: 0 8px
}

.media-gallery--mobile-landscape .tile-button__count {
    margin: 0 6px 0 0
}

.media-gallery--mobile-landscape .tile-button__text {
    display: none
}


.media-gallery--mobile-portrait .media-gallery__info {
    background: linear-gradient(180deg,rgba(0,0,0,.72)0,transparent 100%);
    box-sizing: border-box;
    display: flex;
    font-size: 16px;
    height: 175px;
    justify-content: center;
    left: 0;
    padding: 34px 0 0;
    top: 0;
    width: 100%
}

.media-gallery--mobile-portrait .media-gallery__close {
    opacity: .7;
    right: 4px;
    top: 24px
}

.media-gallery--mobile-portrait .media-gallery__content {
    bottom: 0;
    left: 0;
    right: 0;
    top: 0
}

.media-gallery--mobile-portrait .media-gallery__controls-panel {
    bottom: 24px;
    left: 10px;
    right: 10px
}

.media-gallery--mobile-portrait .media-gallery__bottom-shadow {
    height: 175px
}

.media-gallery--mobile-portrait .media-gallery__info-icon {
    display: none
}

.media-gallery--mobile-portrait .media-gallery__info-title {
    bottom: 80px;
    left: 16px;
    position: fixed
}

.media-gallery--mobile-portrait .video-player__controls {
    padding-bottom: 74px
}

.bv {
    flex-shrink: 0;
    position: relative;
    width: 100%
}

.bv--mobile {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.bv__row {
    display: flex;
    gap: 12px
}

.bv__row>a,
.bv__row>button,
.bv__row>div {
    flex-grow: 1;
    justify-content: center;
    text-align: center
}

@media (min-width:479px) {
    .bv__row {
        display: flex;
        gap: 12px
    }
    .bv__row>a,
    .bv__row>button,
    .bv__row>div {
        flex-basis: 50%
    }
}

.bv__favorite {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: absolute;
    right: 15px;
    top: 70px;
    z-index: 4
}

.bv__dropdown {
    color: #fff;
    font-size: 13px;
    min-width: 153px
}

.bv__dropdown-footer {
    border-top: 1px solid rgba(255, 255, 255, .05);
    margin: 12px 0 0;
    padding: 12px 0 0
}

.bv__dropdown-header {
    align-items: center;
    column-gap: 16px;
    display: flex;
    justify-content: space-between
}

.bv__edit-request-menu-button {
    align-items: center;
    gap: 12px
}

.bv__edit-request-menu-button.btn {
    padding: 0 16px
}

.bv__actions-settings {
    align-items: center;
    display: flex
}

.bv__actions-settings-icon--padded {
    margin: 0 8px 0 0
}

.bv__right {
    display: flex;
    gap: 12px;
    margin: 0 0 0 auto
}

.bv__title {
    align-items: center;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap
}

.bv__date {
    font-size: 14px;
    margin: 6px 0 0;
    opacity: .4;
    white-space: nowrap
}

.bv__date--warning {
    color: #ef7d00;
    opacity: 1
}

@media screen and (max-width:639px) {
    .bv {
        padding: 10px 0;
        width: 100%
    }
    .bv .action-buttons-container .user-fan-club-status-btn {
        height: 31px;
        justify-content: center;
        margin: 0 0 20px;
        width: 100%
    }
    .bv .splitter {
        display: none
    }
}

.bv__icon-wrapper {
    position: relative
}

.bv__icon-decorator {
    color: #2e1d3e;
    height: 12px;
    position: absolute;
    right: 7px;
    top: -3px;
    width: 12px
}

.bv .icon-diamond-colored,
.bv .icon-diamond-flat,
.bv .icon-diamond-rotate {
    height: 20px;
    margin: 0 10px 0 0;
    width: 20px
}

.action-buttons-container {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}

.action-buttons-container .button-dropdown__button {
    white-space: nowrap
}

.action-buttons-container .btn {
    display: flex;
    flex-shrink: 0
}

.action-buttons-container .btn .icon {
    height: 18px;
    width: 18px
}

.action-buttons-container .menu-button-dots .tile-button {
    background: 0 0;
    height: auto;
    min-width: auto;
    padding: 0
}

@media screen and (max-width:479px) {
    .action-buttons-container__right {
        display: flex;
        gap: 12px
    }
    .action-buttons-container .button-dropdown__button {
        font-size: 13px;
        padding: 0 10px
    }
    .action-buttons-container .btn {
        font-size: 13px;
        padding: 0 8px
    }
}

.bs {
    color: #fff;
    margin: 20px 0 12px;
    max-height: 84px;
    opacity: .8;
    overflow: hidden;
    position: relative;
    width: 67%;
    word-break: break-word;
    font-size: .875rem;
    line-height: 1.063rem
}

.bs--opened {
    max-height: none
}

.bs__text {
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    margin: 0;
    padding: 0
}

.bs__shadow-text {
    opacity: 0;
    pointer-events: none;
    position: absolute;
    visibility: hidden
}

@media screen and (max-width:1023px) {
    .bs {
        width: 100%
    }
}

.image-swiper {
    overflow: hidden;
    position: relative;
    user-select: none;
    width: 100%;
    border-radius: 12px;
}

.image-swiper::before {
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    visibility: hidden;
    z-index: 2
}

.image-swiper__root,
.image-swiper__root>body {
    overscroll-behavior-x: none
}

.image-swiper__root--disabled {
    overflow: hidden
}

.image-swiper__scroll {
    height: 100%;
    outline: 0;
    overflow: hidden;
    pointer-events: none;
    position: relative;
    width: 100%
}

.image-swiper__scroll-space {
    height: 1px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    visibility: hidden
}

.image-swiper__item {
    contain: strict;
    pointer-events: all;
    position: absolute;
    top: 0;
    z-index: 1
}

.image-swiper__item-image {
    border: 0;
    height: 100%;
    object-position: center;
    object-fit: cover;
    outline: 0;
    pointer-events: none;
    position: relative;
    width: 100%;
    max-height: 640px;    
}

.image-swiper__item-image--size--cover {
    object-fit: cover
}

.image-swiper__item-image--size--contain {
    object-fit: contain
}

.image-swiper:hover>.image-swiper__arrow--active {
    opacity: .6
}

.image-swiper__children {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.image-swiper__arrow {
    align-items: center;
    background: rgba(0, 0, 0, .6);
    border-radius: 50%;
    box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    cursor: pointer;
    display: flex;
    font-weight: 700;
    height: 30px;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity .3s, left .3s, right .3s;
    width: 30px;
    z-index: 3
}

.image-swiper__arrow--left {
    left: 20px
}

.image-swiper__arrow--left>svg {
    transform: rotate(180deg)
}

.image-swiper__arrow--right {
    right: 20px
}

.image-swiper__arrow--active {
    pointer-events: auto
}

.image-swiper__arrow>svg {
    display: block;
    height: inherit;
    pointer-events: none;
    width: inherit
}

.image-swiper__points {
    align-items: flex-end;
    background: linear-gradient(180deg, rgba(185, 185, 185, 0)0, rgba(0, 0, 0, .35) 100%);
    bottom: 0;
    display: flex;
    height: 100px;
    justify-content: center;
    left: 0;
    padding: 0 0 20px;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 3
}

.image-swiper__points-item {
    background: #fff;
    border-radius: 50%;
    height: 6px;
    margin: 0 2px;
    opacity: .5;
    position: relative;
    transition: opacity .6s, transform .6s;
    width: 6px
}

.image-swiper__points-item--active {
    opacity: 1;
    transform: scale(1.2)
}

@media (max-width:1024px) {
    .image-swiper__arrow {
        display: none
    }
    .image-swiper__points {
        padding-bottom: 12px
    }
}

.user-avatar-editable .dropdown-content::after {
    display: none
}

.user-avatar-editable .avatar-wrapper:not(.is-loading):hover .avatar-upload {
    display: flex
}

.btn-apply {
    background: #d97706;
    color: #fff;
    transition: background 250ms, color 250ms;
}

.bq {
    cursor: pointer;
    display: flex;
    gap: 12px;
    height: 40px;
    margin: 20px 0 0;
    max-width: 320px;
    position: relative;
    width: 100%
}

.bq__progress-title {
    align-items: center;
    display: flex;
    font-size: 14px;
    gap: 4px;
    justify-content: space-between;
    margin: 0 0 10px;
    text-shadow: 0 1px 20px rgba(0, 0, 0, .2)
}

.bq__title-text {
    color: #cfcfd0;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.bq__left {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    max-width: calc(100% - 56px)
}

.bw {
    color: #707071;
    column-gap: 24px;
    display: flex;
    flex-wrap: wrap;
    margin: 20px 0 0;
    overflow: hidden;
    row-gap: 10px
}

.bw__item {
    align-items: center;
    column-gap: 6px;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    position: relative
}

.bw__item::after {
    background: rgba(255, 255, 255, .2);
    border-radius: 50%;
    content: "";
    height: 4px;
    left: -13px;
    position: absolute;
    width: 4px
}

.bw__link {
    color: #a0a0a1
}

.bw__link:hover {
    color: #cfcfd0
}

.bu {
    position: relative
}

.bu__tooltip {
    width: 145px
}

.bu__tooltip .tooltip-inner {
    display: flex;
    flex-direction: column
}

.bu__button {
    align-items: center;
    background: #111113;
    border: 0;
    border-radius: 12px;
    color: #fff;
    cursor: pointer;
    display: flex;
    font-weight: 500;
    gap: 12px;
    height: 40px;
    justify-content: center;
    padding: 11px 20px;
    transition: background .3s;
    width: 100%
}

.bu__button:hover {
    background: #232325
}

@media screen and (max-width:767px) {
    .bu__button {
        padding: 11px
    }
    .image-swiper {
        border-radius: 0;
    }    
    .t--fill--locked {
        border-radius: 0;
    }    
}

.bu__action {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, .8);
    cursor: pointer;
    display: flex;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    min-height: 38px;
    padding: 7px 22px 7px 15px;
    transition: all ease .25s;
    white-space: nowrap;
    width: 145px
}

.bu__action .icon {
    fill: rgba(255, 255, 255, .8);
    margin-right: 10px
}

.bu__action.profile-cover-dropdown__action--active,
.bu__action:hover {
    background: #343437;
    color: #fff
}
.bp {
    height: 112px;
    margin: 0 0 48px;
    max-width: calc(100vw - 8px);
    overflow: hidden;
    width: 100%
}

.bp .scroll-bar-container__arrow {
    margin-top: -20px
}

.bp--style--mobile {
    height: 82px;
    margin: 0 0 40px
}

.bp--style--pinned {
    height: 116px;
    margin: 40px 0 0
}

.bp--style--pinned .scroll-bar-container__arrow {
    margin-top: -8px
}

.bp--style--pinned .avatar__img,
.bp--style--pinned-mobile .avatar__img {
    background-position: center top
}

.bp--style--pinned-mobile {
    height: 82px;
    margin: 40px 0 0
}

.bp__title {
    color: #a0a0a1;
    font-size: 11px;
    margin: 0 0 8px;
    text-transform: uppercase
}

.bp__controls {
    display: flex;
    gap: 1px
}

.bp__add {
    align-items: center;
    background: #111113;
    color: #a0a0a1;
    column-gap: 10px;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-size: 14px;
    height: 80px;
    justify-content: center;
    max-height: 100%;
    transition: background .3s;
    border-bottom-left-radius: 26px;
    border-top-left-radius: 26px
}

.bp__add:hover,
.bp__archive:hover {
    background: #1b1b1d
}

.bp__add--rounded {
    border-radius: 26px
}

.bp__archive {
    align-items: center;
    background: #111113;
    color: #a0a0a1;
    column-gap: 10px;
    cursor: pointer;
    display: flex;
    flex: 1;
    font-size: 14px;
    height: 80px;
    justify-content: center;
    max-height: 100%;
    transition: background .3s;
    border-bottom-right-radius: 26px;
    border-top-right-radius: 26px
}

.bp__list {
    display: flex;
    gap: 2px;
    padding-bottom: 12px
}

.feed_stories.bp__list{
    gap: 14px!important;
} 

.bp__item {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 92px;
    min-width: 92px;
    overflow: hidden;
    padding: 6px 0;
    position: relative;
    width: 92px
}

.bp__item .avatar {
    cursor: pointer
}

.bp__item--mobile {
    min-height: 56px;
    min-width: 56px;
    width: 56px
}

.bp__thumb-avatar {
    align-items: center;
    background: #111113;
    border-radius: 30.75%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    justify-content: center;
    transition: background .3s
}

.bp__thumb-avatar:hover {
    background: #1b1b1d
}

.bp__name {
    font-size: 12px;
    margin: 10px 0 0;
    text-align: center;
    width: 100%
}

.bp__name .displayname {
    display: block
}

.bp__icon {
    color: #fff;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateX(-50%) translateY(-50%)
}

.S img[src=""] {
    visibility: hidden
}
.S {
    overflow: hidden;
    position: relative
}

.S--clickable {
    cursor: pointer
}

.S--locked .image-swiper__points {
    background: 0 0
}

.S__label {
    align-items: center;
    background: rgba(0, 0, 0, .4);
    border-radius: 8px;
    color: #cfcfd0;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    height: 24px;
    padding: 0 8px;
    pointer-events: none;
    position: absolute;
    right: 12px;
    z-index: 2
}

.S__label--top {
    top: 12px
}

.S__label--bottom {
    bottom: 12px
}

.S__blur {
    background-size: 0;
    bottom: 0;
    contain: strict;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1
}

.S__blur::after,
.S__blur::before {
    background-image: inherit;
    background-repeat: no-repeat;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.S__blur::before {
    background-size: cover;
    filter: blur(16px);
    transform: scale(1.2)
}

.S__blur::after {
    background-position: center;
    background-size: contain
}

.S__tagged-users-count-badge {
    align-items: center;
    background: rgba(0, 0, 0, .4);
    border-radius: 8px;
    bottom: 16px;
    color: #cfcfd0;
    display: flex;
    flex-wrap: nowrap;
    font-size: 14px;
    font-weight: 700;
    gap: 8px;
    left: 16px;
    padding: 4px 8px;
    pointer-events: none;
    position: absolute;
    z-index: 2
}

.P {
    align-items: center;
    background: rgba(0, 0, 0, .4);
    border-radius: 8px;
    color: rgba(255, 255, 255, .8);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    gap: 8px;
    height: 28px;
    padding: 0 8px
}

.bc {
    background-color: #232325;
    border-radius: 8px 8px 0 0;
    box-shadow: 0 20px 30px rgba(0, 0, 0, 0.3);
    display: flex;
    flex-direction: column;
    padding-bottom: env(safe-area-inset-bottom);
    position: relative;
    transition: width 200ms;
    width: 250px;
}
@media (max-width: 639px) {
    .bc {
        border-radius: 0;
        bottom: var(--tap-bar-height);
        left: 0;
        position: fixed;
        right: 0;
        top: var(--pwa-notification-height);
    }
    .picture-squad-grid {
        column-gap: 1px;
        grid-template-columns: repeat(3, 1fr);
        row-gap: 1px;
    }
    .F {
        border-radius: 1px;
    }

    .dp__dropdown {
        width: 90vw;
    }

}

@media (max-width: 1024px) {
    .top-search-hidden {
        display: none;
    }

}
.no-show-tablets {
    display: block;
}


@media (max-width: 800px) {
    .no-show-tablets {
        display: none!important;
    }
    .mobile-menu {
        display: block!important;
    }
}
.bc:not(:first-child) {
    margin-left: 20px;
}
.bc__content {
    display: flex;
    flex-direction: column;
    height: 0;
    justify-content: flex-end;
    position: relative;
    transition: height 200ms;
}
.bc__content--expanded {
    height: 430px;
    max-height: calc(100vh - 100px);
}
@media (max-width: 639px) {
    .bc__content--expanded {
        flex: 1;
    }
}
@media screen and (max-width: 639px) {
    .bc__content--expanded {
        height: auto;
        max-height: none;
        overflow: hidden;
    }
}
.bc .chat-header-username {
    max-width: 160px;
}
.bc--expanded {
    overflow: inherit;
    width: 360px;
}
@media (max-width: 639px) {
    .bc--expanded {
        width: 100%;
    }
	.bc{
	    margin-left: 0px !important;
	} 
}
.bc--expanded .messenger-chat-header {
    border-color: transparent;
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
.bc--expanded .chat-header-username {
    max-width: 180px;
}
.bc__skeleton-wrapper {
    flex: 1;
    max-height: 100%;
}
.bb {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    margin: 0 8px;
    padding: 12px;
    position: relative;
    transition: background 0.3s;
}
.bb .icon-people {
    color: #fff;
    margin: 0 6px 0 0;
}
@media (pointer: fine) {
    .bb:hover,
    .bb:hover .avatar .online,
    .bb:hover .bb__tier {
        background: #343437;
    }
}
.bb__tier {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    bottom: -4px;
    display: flex;
    height: 22px;
    justify-content: center;
    position: absolute;
    right: -4px;
    transition: background 0.3s;
    width: 22px;
}
.bb__tier .icon-diamond-colored,
.bb__tier .icon-diamond-flat {
    height: 14px;
    width: 14px;
}
.bb__avatar-wrapper {
    margin: 0 12px 0 0;
    position: relative;
}
.bb .avatar {
    flex-shrink: 0;
    height: 44px;
    width: 44px;
}
.bb .avatar .online {
    background: #232325;
    height: 12px;
    left: -3px;
    top: -3px;
    width: 12px;
}
.bb__content {
    overflow: hidden;
}
.bb__name {
    align-items: center;
    display: flex;
}
.bb__name .username {
    font-weight: 700;
}
.bb__text {
    color: rgba(255, 255, 255, 0.6);
    margin: 5px 0 0;
    min-height: 16px;
    overflow: hidden;
    padding-right: 40px;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.bb__time {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    margin: 0 0 0 6px;
    opacity: 0.3;
}
.bb__menu {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    opacity: 0.4;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: opacity 0.3s;
    width: 32px;
}
@media screen and (max-width: 639px) {
    .bb__menu {
        height: 44px;
        margin-right: -8px;
        width: 44px;
    }
}
.bb__menu:hover {
    opacity: 1;
}
.bb__new {
    align-items: center;
    background: #ff5f5f;
    border-radius: 10px;
    color: #fff;
    display: flex;
    font-size: 11px;
    height: 20px;
    justify-content: center;
    min-width: 20px;
    padding: 0 4px;
    pointer-events: none;
    position: absolute;
    right: 30px;
}
.bb .personal-notifications-settings {
    bottom: unset;
    left: unset;
    right: -8px;
    top: 56px;
}
@media screen and (max-width: 639px) {
    .bb .personal-notifications-settings {
        bottom: unset;
        left: 7px;
        right: 7px;
        top: 56px;
        width: unset;
    }
}
.bb--menu--top .personal-notifications-settings {
    bottom: 56px;
    top: unset;
}
@media screen and (max-width: 639px) {
    .bb--menu--top .personal-notifications-settings {
        bottom: 56px;
        top: unset;
    }
}
.bb--menu--top .personal-notifications-settings-arrow-up {
    bottom: -5px;
    top: unset;
    transform: rotate(180deg);
}
.bb .personal-notifications-switcher-name {
    cursor: pointer;
    text-decoration: none;
}
.bb .personal-notifications-switcher-name:hover {
    color: #fff;
}


y {
    border-radius: 0 0 12px 12px;
    overflow: hidden;
    position: relative;
}
.y--clickable {
    cursor: pointer;
}
.y--locked .image-swiper__points {
    background: 0 0;
}
.y__label {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    color: #cfcfd0;
    display: flex;
    font-size: 12px;
    font-weight: 700;
    height: 24px;
    padding: 0 8px;
    pointer-events: none;
    position: absolute;
    right: 12px;
    z-index: 2;
}
.y__label--top {
    top: 12px;
}
.y__label--bottom {
    bottom: 12px;
}
.y__blur {
    background-size: 0;
    bottom: 0;
    contain: strict;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: -1;
}
.y__blur::after,
.y__blur::before {
    background-image: inherit;
    background-repeat: no-repeat;
    bottom: 0;
    content: "";
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}
.y__blur::before {
    background-size: cover;
    filter: blur(16px);
    transform: scale(1.2);
}
.y__blur::after {
    background-position: center;
    background-size: contain;
}
.y__tagged-users-count-badge {
    align-items: center;
    background: rgba(0, 0, 0, 0.4);
    border-radius: 8px;
    bottom: 16px;
    color: #cfcfd0;
    display: flex;
    flex-wrap: nowrap;
    font-size: 14px;
    font-weight: 700;
    gap: 8px;
    left: 16px;
    padding: 4px 8px;
    pointer-events: none;
    position: absolute;
    z-index: 2;
}

.D {
    padding: 20px 20px 0;
    position: relative;
    word-break: break-all;
}
.D--compact {
    display: flex;
}
.D__avatar {
    display: block;
    height: 80px;
    margin: 20px 10px 16px 0;
    width: 80px;
}
.D__avatar--size--small {
    height: 64px;
    width: 64px;
}
.D__avatar--size--medium {
    height: 80px;
    width: 80px;
}
.D__avatar > .avatar {
    height: inherit;
    width: inherit;
}
.D__username {
    display: flex;
    position: relative;
}
.D__cover {
    background-repeat: no-repeat;
    background-size: cover;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
.D__cover--size--small {
    height: 84px;
}
.D__cover--size--medium {
    height: 100px;
}
.D__cover--size--large {
    height: 120px;
}
.D__cover::before {
    background: linear-gradient(1deg, #0a0a0a 0, rgba(0, 0, 0, 0.55) 100%);
    content: "";
    display: block;
    height: inherit;
}
.D__cover--no-photo::before {
    background: radial-gradient(138.66% 168.3%at 72.8% 11.43%, #2c2057 0, #050506 77.21%), #050506;
}

.pepe {
    padding: 20px;
}
.p__benefits-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 5px 0;
}
.p__benefit {
    align-items: center;
    background: #232325;
    border-radius: 12px;
    color: rgba(255, 255, 255, 0.6);
    flex: 1 0 224px;
    font-size: 12px;
    line-height: 120%;
    min-height: 48px;
    padding: 10px 13px;
    width: 224px;
    display: flex;
    flex-direction: row;
}
.p__benefit .icon-check-1 {
    color: #d97706;
    height: 16px;
    min-width: 12px;
    width: 16px;
}
.p__benefit .icon-gift {
    fill: currentColor;
    margin-right: 14px;
}
@media (max-width: 540px) {
    .p__benefit {
        width: 100%;
    }
}
.p__icon {
    color: #d97706;
    margin-right: 12px;
}
.p__actions--sticked {
    backdrop-filter: blur(2px);
    background: rgba(27, 27, 29, 0.8);
    border-radius: 0 0 12px 12px;
    bottom: 0;
    left: 0;
    padding: 20px;
    position: absolute;
    width: 100%;
}
@media screen and (max-height: 760px) {
    .p__actions--sticked {
        border-top: 1px solid rgba(255, 255, 255, 0.05);
    }
}
.p__actions > .btn {
    margin-top: 10px;
    width: 100%;
}
.p__actions > .btn > .icon-diamond-colored,
.p__actions > .btn > .icon-diamond-flat {
    height: 16px;
    margin: 0 6px 0 0;
    width: 16px;
}
.p__actions > .btn:first-child:last-of-type {
    margin-top: 0;
}
.p__actions-description {
    color: #f8f8f8;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    margin: 12px 0 0;
    opacity: 0.4;
    text-align: center;
}
@media screen and (max-width: 479px) {
    .p {

    }
    .p__benefits-list {
        gap: 0;
        margin: 20px 0 0;
    }
    .p__benefit {
        border-radius: 0;
        min-height: auto;
    }
    .p__benefit:first-child {
        border-radius: 12px 12px 0 0;
    }
    .p__benefit:last-child {
        border-radius: 0 0 12px 12px;
    }
}

.o {
    border-radius: 12px;
    margin: 10px 0;
    padding: 12px 16px;
    position: relative;
}
.o--selectable {
    cursor: pointer;
    padding-left: 51px;
}
.o::before {
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: background 0.3s, border 0.3s;
}
.o--state--not-selected:hover::before {
    background: #232325;
    border-color: #49494a;
}
.o--state--not-selected:hover .checkbox-ds__box {
    border-color: #a0a0a1;
}
.o--state--selected {
    cursor: default;
}
.o--state--selected::before {
    background: rgba(215, 13, 17, 0.1);
    border: 2px solid #d97706;
}
.o__title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    line-height: 22px;
    margin: 0 0 6px;
    position: relative;
}
.o__description {
    color: #f8f8f8;
    font-size: 11px;
    font-weight: 500;
    line-height: 13px;
    opacity: 0.4;
}
.o__discount {
    align-items: center;
    background: #ef7d00;
    border-radius: 6px;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 24px;
    padding: 0 8px;
    position: absolute;
    right: 14px;
    top: 10px;
}
.o__discount--free {
    background: #21b062;
    text-transform: uppercase;
}
.o__checkbox {
    left: 16px;
    position: absolute;
    top: 12px;
}


.bLL {
    max-width: calc(100vw - 32px);
    width: 100%
}
.bLL__header {
    align-items: flex-end;
    display: flex;
    justify-content: space-between;
    margin: 0 0 32px
}

.bLL__tabs {
    color: #a0a0a1;
    display: flex;
    font-size: 24px;
    gap: 32px
}

.bLL__tab {
    cursor: pointer
}

.bLL__tab--active,.bL__tab:hover {
    color: #fff
}

.bLL__tab--active {
    pointer-events: none
}

.bLL__link {
    align-items: center;
    color: #d97706;
    display: flex;
    font-size: 16px;
    transition: color .3s;
    line-height: 21px;
}

@media (max-width: 639px) {
    .bLL__tabs {
        gap:24px
    }

    .bLL .scroll-bar-container__arrow,.bLL .scroll-bar-container__shadow {
        display: none
    }
    .bYz__wrapper-center{
        width: auto!important;
        top: -60px!important;
    }
    .bYz__wrapper-center{
        
    }
    .bYz__wrapper{
        max-width: 700px!important;
        min-width: 700px!important;
    }
    .bYz__item{
        height: 125px!important;
        min-width: 125px!important;
    }
}

.m {
    align-items: flex-end;
    background: #424248;
    border-radius: 16px;
    display: flex;
    height: 264px;
    max-height: 100%;
    min-height: 100%;
    overflow: hidden;
    padding: 12px;
    position: relative;
    transform: translateZ(0);
    -webkit-user-select: none;
    user-select: none
}

.m--squad {
    border-radius: 2px
}

.m--hover:hover>.m__cover--image {
    transform: scale(1.2)
}

.m--hover:hover .avatar {
    border-color: rgba(255,255,255,.6)
}

.m--hover:hover .avatar:hover {
    border-color: #fff
}

.m--hover:hover .m__description {
    opacity: 1;
    transform: translateY(0)
}

.m--clickable {
    cursor: pointer
}

.m--bordered::before {
    border: 3px solid #d97706;
    border-radius: inherit;
    bottom: 0;
    content: "";
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 1
}

.m__controls {
    align-items: center;
    bottom: 6px;
    color: rgba(255,255,255,.8);
    display: flex;
    gap: 12px;
    left: 8px;
    position: absolute;
    z-index: 2
}

.m__comments:hover,.m__controls>.likes-counter:hover {
    color: #fff
}

.m__comments {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255,255,255,.8);
    cursor: pointer;
    display: flex;
    font-weight: 700;
    gap: 5px;
    padding: 2px
}

.m__cover {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.m__cover--image {
    object-fit: cover;
    object-position: center;
    transition: transform .3s
}

.m__followers {
    align-items: center;
    color: rgba(255,255,255,.7);
    display: flex;
    font-size: 12px;
    margin: 2px 0 0
}

.m__top-right-block {
    pointer-events: none;
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 1
}

.m__top-right-block-icon {
    color: rgba(255,255,255,.8);
    height: 24px;
    width: 24px
}

@media screen and (max-width: 639px) {
    .m__top-right-block-icon {
        height:16px;
        width: 16px
    }
    .br__media-aspect-ratio {
        height: 240px;
    }   

}

.m__bottom-shadow {
    background: linear-gradient(180deg,transparent 0,rgba(0,0,0,.3) 100%);
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    bottom: 0;
    height: 56px;
    left: 0;
    pointer-events: none;
    position: absolute;
    right: 0;
    z-index: 1
}

.m__download {
    background: #232325;
    border-radius: 4px;
    cursor: pointer;
    left: 10px;
    position: absolute;
    top: 10px;
    transform: rotate(90deg)
}

.m--top-shadow::before {
    background: linear-gradient(180deg,rgba(0,0,0,.4)0,transparent 100%);
    content: "";
    height: 60px;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.m__top-avatar {
    left: 8px;
    position: absolute;
    right: 40px;
    top: 8px;
    z-index: 1
}

.m__description {
    align-items: flex-end;
    background: linear-gradient(180deg,transparent 0,rgba(0,0,0,.6) 100%);
    bottom: 0;
    display: flex;
    filter: drop-shadow(0 1px 10px rgba(0,0,0,.4));
    height: 200px;
    left: 0;
    opacity: 0;
    padding: 0 8px 40px;
    pointer-events: none;
    position: absolute;
    right: 0;
    transform: translateY(30px);
    transition: transform 150ms ease,opacity 100ms ease;
    z-index: 1
}

.m__description-text {
    -webkit-box-orient: vertical;
    color: rgba(255,255,255,.8);
    display: -webkit-box;
    font-size: 14px;
    font-weight: 400;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-all
}

.m__description-link {
    color: rgba(255,255,255,.8)
}

.loading-story:before {
  content: "";
  position: absolute;
  top: 0rem;
  right: 0rem;
  bottom: 0rem;
  left: 0rem;
  border-radius: 33.75%;
  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);
  background-size: 500px 100px;
  background-position: center left;
  animation: content-placeholder 1.5s ease infinite;
}

@keyframes content-placeholder {
  from {
    background-position: center right;
  }
  to {
    background-position: center left;
  }
}
.loading-story {
    background: #000;
}

.loading-popular:before {
  content: "";
  position: absolute;
  top: 0rem;
  right: 0rem;
  bottom: 0rem;
  left: 0rem;
  border-radius: 0;
  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);
  background-size: 800px 100px;
  background-position: center left;
  animation: content-placeholder 1.5s ease infinite;
}

.loading-popular {
    background: #000;
}

.loading-feed:before {
  content: "";
  position: absolute;
  top: 0rem;
  right: 0rem;
  bottom: 0rem;
  left: 0rem;
  border-radius: 0;
  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);
  background-size: 2000px 100px;
  background-position: center left;
  animation: content-placeholder 1.5s ease infinite;
  border-radius: 5px;
}

.loading-media {
    background: #000;
}

.loading-media:before {
  content: "";
  position: absolute;
  top: 0rem;
  right: 0rem;
  bottom: 0rem;
  left: 0rem;
  border-radius: 0;
  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);
  background-size: 800px 100px;
  background-position: center left;
  animation: content-placeholder 1.5s ease infinite;
  border-radius: 5px;
}

.loading-feed {
    background: #000;
}


.loading-live:before {
  content: "";
  position: absolute;
  top: 0rem;
  right: 0rem;
  bottom: 0rem;
  left: 0rem;
  border-radius: 0;
  background: linear-gradient(to right, transparent 0, transparent 30%, rgb(60 60 60 / 80%) 50%, transparent 70%, transparent 100%) rgb(52 52 52 / 60%);
  background-size: 2000px 100px;
  background-position: center left;
  animation: content-placeholder 1.5s ease infinite;
  border-radius: 0px;
}

.loading-live {
    background: #000;
}

.fslightbox-source {
    border-radius: 10px !important;
}

.fade-in-bottom {
    -webkit-animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
            animation: fade-in-bottom 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;
}

@-webkit-keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}
@keyframes fade-in-bottom {
  0% {
    -webkit-transform: translateY(50px);
            transform: translateY(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateY(0);
            transform: translateY(0);
    opacity: 1;
  }
}

.fade-in-right {
    -webkit-animation: fade-in-right 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550) ;
            animation: fade-in-right 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550) ;
}

@-webkit-keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}
@keyframes fade-in-right {
  0% {
    -webkit-transform: translateX(50px);
            transform: translateX(50px);
    opacity: 0;
  }
  100% {
    -webkit-transform: translateX(0);
            transform: translateX(0);
    opacity: 1;
  }
}



.bU {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 20px 0
}

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

.bU__st-link-content {
    overflow: hidden;
    padding: 0 8px 0 4px;
    position: relative
}

.bU__st-link-content:after {
    background: linear-gradient(270deg, #1b1b1d 0, rgba(27, 27, 29, 0) 100%);
    bottom: 0;
    content: "";
    display: block;
    position: absolute;
    right: -5px;
    top: 0;
    width: 13px
}

.bU__live {
    align-items: center;
    background: #ef7d00;
    border-radius: 6px;
    color: #fff;
    column-gap: 4px;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 20px;
    padding: 0 8px 0 4px;
    position: relative;
    white-space: nowrap
}

.bU__live:hover {
    background: #ef7d00
}

.bU__links,
.bU__st {
    display: flex;
    gap: 8px
}

.bU__link {
    align-items: center;
    background: #1b1b1d;
    border-radius: 12px;
    display: flex;
    height: 32px;
    justify-content: center;
    min-width: 32px;
    overflow: hidden;
    width: 32px
}

.bU__link:hover {
    background: #232325
}

.bU__link--st {
    color: #cfcfd0;
    max-width: min(360px, 100%);
    padding: 0 6px;
    position: relative;
    width: auto
}

.bU__link--st:hover .bU__st-link-content::before {
    background: linear-gradient(270deg, #232325 0, rgba(27, 27, 29, 0) 100%)
}

.g {
    display: grid;
    gap: 10px;
    grid-template-columns: 2.5fr 1fr;
    grid-template-rows: repeat(2, 1fr);
    height: 360px
}

.g__item {
    align-items: center;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: relative
}

.g__item--main {
    grid-row: 2 span
}

.g__img {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    width: 100%
}

.g__shadow {
    align-items: center;
    background: rgba(0, 0, 0, .4);
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.g__join,
.g__lock {
    align-items: center;
    display: flex;
    flex-direction: column;
    position: relative
}

.g__lock {
    color: rgba(255, 255, 255, .6);
    font-size: 14px;
    gap: 6px
}

.g__join {
    color: rgba(255, 255, 255, .8);
    gap: 16px;
    text-align: center;
    z-index: 1
}

.g__view-button {
    align-items: center;
    background: 0 0;
    border: 0;
    color: rgba(255, 255, 255, .6);
    cursor: pointer;
    display: flex;
    font-size: 12px;
    gap: 6px;
    padding: 0;
    transition: color .3s
}

.g__view-button:hover {
    color: #cfcfd0
}

.landing {
    display: flex;
    justify-content: center;
    position: relative;
    scroll-behavior: smooth;
}
.landing__main-arrow {
    bottom: 12px;
    cursor: pointer;
    left: 50%;
    margin-left: -18px;
    position: fixed;
    transition: opacity 1s;
}
.landing__main-arrow--hidden {
    opacity: 0;
    pointer-events: none;
}
.landing__content {
    max-width: 1400px;
    padding: 0 100px;
}
.landing__section {
    min-height: 100vh;
    padding-top: var(--pwa-sticky-header-height);
}
.landing__section-login {
    display: flex;
    justify-content: space-between;
    min-height: max(100vh, 800px);
}
.landing__section-flex,
.landing__section-flex-center {
    align-items: center;
    display: flex;
    justify-content: space-between;
}
.landing__section-flex-center {
    justify-content: center;
}
.landing__login-wrapper {
    display: flex;
    flex: 1;
    gap: 40px;
    justify-content: space-between;
    margin: 40px 0 80px;
    position: relative;
}
.landing__real-title {
    font-size: 44px;
    font-weight: 700;
    line-height: 50px;
    margin: 0 0 666px;
    max-width: 610px;
}
.landing__footer-gradient {
    background: radial-gradient(74.17% 69.92%at 50% -6.37%, #3f1962 0, transparent 100%);
    bottom: 0;
    height: 155vh;
    pointer-events: none;
    position: absolute;
    transform: rotate(-180deg);
    width: 100%;
    z-index: -1;
}
.landing__profile-card-wrapper {
    flex: 1;
    margin: 100px auto 84px;
    transform: translateY(-60px);
    width: 100%;
}
@media screen and (max-width: 1023px) {
    .landing {
        display: block;
    }
    .landing__content {
        padding: 0 40px;
    }
    .landing__section-login {
        width: auto;
    }
}
@media screen and (min-width: 768px) {
    .landing__nav_center {
        justify-content: flex-end;
    }
}
@media screen and (max-width: 767px) {
    .landing__nav-left {
        flex: 1 1 50%;
    }
    .landing__logo-wrapper {
        width: 100%;
    }
    .landing__login-wrapper {
        align-items: center;
        flex-direction: column;
        margin: 80px 0 0;
    }
    .landing__real-title {
        font-size: 24px;
        line-height: 30px;
        margin-bottom: 300px;
        text-align: center;
    }
}
@media screen and (max-width: 639px) {
    .landing {
        margin: unset;
    }
    .landing__content {
        padding: 0 20px;
    }
    .landing__header {
        justify-content: space-between;
        padding-right: 10px;
    }
    .landing__nav-center {
        justify-content: flex-end;
    }
    .landing__section {
        min-height: unset;
    }
    .landing__section-flex {
        align-items: flex-start;
        flex-direction: column;
        justify-content: flex-start;
    }
    .landing__section-login {
        flex-direction: column-reverse;
    }
    .landing__profile-card-wrapper {
        transform: translateY(0);
    }
}

.bY {
    display: flex;
    font-size: 14px;
    justify-content: center;
    line-height: 100%;
    margin: 80px 0 0;
    position: absolute;
    width: 100%;
}
.bY__wrapper-center {
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100vw;
}
.bY__wrapper-center::before {
    background: linear-gradient(90deg, #050506 0, rgba(5, 5, 6, 0) 100%);
    content: "";
    width: 160px;
    z-index: 1;
}
.bY__wrapper-center::after {
    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 160px;
    z-index: 1;
}
.bY__wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    height: 666px;
    padding: 30px 0 0;
}
.bY__item-bottom {
    background: linear-gradient(360deg, rgba(0, 0, 0, 0.45) 0, rgba(0, 0, 0, 0.42) 26.38%, transparent 100%);
    bottom: 0;
    color: #fff;
    left: 0;
    min-height: 40px;
    padding: 12px;
    position: absolute;
    text-align: center;
    width: 100%;
}
.bY__item {
    background: #424248;
    border-radius: 32px;
    height: 192px;
    min-width: 192px;
    overflow: hidden;
    position: relative;
    transform: translateZ(0);
    width: 192px;
}
.bY__item:hover > .bYz__image {
    transform: scale(1.2);
}

.bY__username {
    align-items: center;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    gap: 4px;
    justify-content: center;
    max-width: 100%;
    white-space: nowrap;
}
.bY__name {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bY__counters {
    align-items: center;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 4px;
    justify-content: center;
    margin: 6px 0 0;
}
.bY__image {
    background: no-repeat center;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform 0.3s;
    width: 100%;
}
@media screen and (max-width: 767px) {
    .bYz__wrapper-center {
        justify-content: flex-start;
    }
    .bYz__wrapper {
        transform: translateX(-150px);
    }
}
.bW__content {
    text-align: center;
}
.bW__footer {
    display: flex;
    justify-content: center;
    margin: 40px 0 0;
}
.bW__title {
    font-size: 44px;
    font-weight: 700;
    line-height: 50px;
}
@media screen and (max-width: 767px) {
    .bW__title {
        font-size: 24px;
        font-weight: 700;
        line-height: 30px;
    }
}
.auth-form {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
}
.auth-form__fading-input {
    max-height: 100px;
}
.auth-form__fading-input:not(:last-child) {
    margin-bottom: 16px;
}
.auth-form__title {
    font-size: 1.375rem;
    line-height: 1.679rem;
    font-weight: 500;
    margin-bottom: 24px;
    text-align: center;
}
.auth-form__social-login {
    column-gap: 12px;
    display: grid;
}
.auth-form__social-login .icon {
    margin-right: 10px;
}
.auth-form__divider {
    margin: 24px 0;
    padding: 0 76px;
    text-align: center;
    font-size: 0.75rem;
    line-height: 0.938rem;
}
.auth-form__divider-text {
    opacity: 0.4;
}
.auth-form__hint {
    font-size: 0.688rem;
    line-height: 1rem;
    color: #707071;
    font-weight: 400;
    margin-top: 10px;
    text-align: center;
}
.auth-form__hint a {
    color: #707071;
    text-decoration: underline;
}
.auth-form__hint a:hover {
    color: #cfcfd0;
    text-decoration: none;
}
.auth-form__join {
    margin-top: 16px;
}
.auth-form__form-switcher {
    color: #a0a0a1;
    margin-top: 32px;
    text-align: center;
    font-size: 0.813rem;
    line-height: 1rem;
}
.auth-form__form-switcher .btn {
    border-radius: 0;
    color: #f59e0b;
    vertical-align: baseline;
    font-size: 0.813rem;
    line-height: 1rem;
}
@media screen and (max-width: 639px) {
    .auth-form__title {
        font-size: 1.375rem;
        line-height: 1.679rem;
    }
}
.auth-form .recaptcha {
    display: flex;
    justify-content: center;
    margin: 20px auto 0;
}

bX {
    flex: 1;
    position: relative;
    width: 100%;
}
.bX__size {
    aspect-ratio: 5/4;
    display: block;
    visibility: hidden;
    width: 100%;
}
.bX__shadow-box {
    border-radius: 50%;
    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);
    pointer-events: none;
    position: absolute;
}
.bX__shadow-box--face--1 {
    left: 20%;
    padding-top: 31%;
    top: 74%;
    width: 31%;
}
.bX__shadow-box--face--2 {
    left: 30%;
    padding-top: 44%;
    top: 10%;
    width: 48%;
}
.bX__face {
    position: absolute;
}
.bX__face--face--1 {
    left: 14%;
    top: 73%;
    width: 38%;
}
.bX__face--face--2 {
    left: 30%;
    top: 5%;
    width: 60%;
}
.bX__face--chat {
    position: absolute;
}
.bX__face--chat--1 {
    left: 14%;
    top: 0;
    width: 41%;
}
.bX__face--chat--2 {
    left: 53%;
    top: 100%;
    width: 47%;
}
.bX__face--shadow {
    border-radius: 20px;
    box-shadow: 0 0 200px rgba(163, 73, 252, 0.6);
}
.bX__smile {
    left: 87%;
    position: absolute;
    top: 95%;
    width: 8%;
}
@media screen and (max-width: 767px) {
    .bX {
        margin-top: 20px;
    }
}
.abilitie-tip {
    flex: 1;
    margin: 20px 0 20px auto;
    max-width: 600px;
    overflow: hidden;
    position: relative;
}
.abilitie-tip::after {
    bottom: 70px;
    box-shadow: 0 0 150px 182px rgba(138, 24, 252, 0.3);
    content: "";
    height: 1px;
    left: 50%;
    pointer-events: none;
    position: absolute;
    top: 50%;
    width: 1px;
    z-index: 10;
}
.abilitie-tip__message {
    align-items: center;
    display: flex;
    height: 100%;
    justify-content: center;
    left: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 11;
}
.abilitie-tip__message > .login-message-wrapper {
    opacity: 0;
    transform: scale(0);
    transition: opacity 0.5s, transform 0.5s;
}
.abilitie-tip__message::before {
    background: rgba(0, 0, 0, 0.4);
    content: "";
    height: 100%;
    left: 0;
    opacity: 0;
    position: absolute;
    top: 0;
    transition: opacity 0.3s;
    width: 100%;
}
.abilitie-tip__message--visible {
    pointer-events: auto;
}
.abilitie-tip__message--visible > .login-message-wrapper {
    opacity: 1;
    transform: scale(1);
}
.abilitie-tip__message--visible > .login-message-wrapper .login-message__inline-emoji {
    animation: animation-ability-tip 2.5s ease;
}
.abilitie-tip__message--visible::before {
    opacity: 1;
}
@media screen and (max-width: 1023px) {
    .abilitie-tip .tip-modal__content .radio-pill-controls {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media screen and (max-width: 639px) {
    .abilitie-tip {
        width: 100%;
    }
}
@media screen and (max-width: 767px) {
    .abilitie-tip {
        margin: 30px auto;
        max-width: 100%;
    }
}

.bYz {
    display: flex;
    font-size: 14px;
    justify-content: center;
    line-height: 100%;
    margin: 0px 0 0;
    position: absolute;
    width: 100%;
}
.bYz__wrapper-center {
    display: flex;
    justify-content: center;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100vw;
}
.bYz__wrapper-center::before {
    background: linear-gradient(90deg, #050506 0, rgba(5, 5, 6, 0) 100%);
    content: "";
    width: 220px;
    z-index: 1;
    pointer-events: none;
}
.bYz__wrapper-center::after {
    background: linear-gradient(270deg, #050506 0, rgba(5, 5, 6, 0) 100%);
    content: "";
    height: 100%;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    width: 220px;
    z-index: 1;
}
.bYz__wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    height: 766px;
    padding: 30px 0 0;
}
.bYz__item-bottom {
    background: linear-gradient(360deg, rgba(0, 0, 0, 0.45) 0, rgba(0, 0, 0, 0.42) 26.38%, transparent 100%);
    bottom: 0;
    color: #fff;
    left: 0;
    min-height: 40px;
    padding: 12px;
    position: absolute;
    text-align: center;
    width: 100%;
}
.bYz__item {
    background: #424248;
    border-radius: 32px;
    height: 202px;
    min-width: 202px;
    overflow: hidden;
    position: relative;
    transform: translateZ(0);
}
.bYz__item:hover > .bYz__image {
    transform: scale(1.2);
}
.bYz__item:nth-child(even) {
    transform: translateY(-30px);
}
.bYz__username {
    align-items: center;
    display: flex;
    font-size: 16px;
    font-weight: 500;
    gap: 4px;
    justify-content: center;
    max-width: 100%;
    white-space: nowrap;
}
.bYz__name {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}
.bYz__counters {
    align-items: center;
    color: rgba(255, 255, 255, 0.8);
    display: flex;
    font-size: 12px;
    font-weight: 500;
    gap: 4px;
    justify-content: center;
    margin: 6px 0 0;
}
.bYz__image {
    background: no-repeat center;
    background-size: cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform 0.3s;
    width: 100%;
}
@media screen and (max-width: 767px) {
    .bYz__wrapper-center {
        justify-content: flex-start;
    }
    .bYz__wrapper {
        transform: translateX(-150px);
    }
}
.bWz__content {
    text-align: center;
}
.bWz__footer {
    display: flex;
    justify-content: center;
    margin: 40px 0 0;
}
.bWz__title {
    font-size: 44px;
    font-weight: 700;
    line-height: 50px;
}
@media screen and (max-width: 767px) {
    .bWz__title {
        font-size: 24px;
        font-weight: 700;
        line-height: 30px;
    }
}

.bTz {
    margin-bottom: 32px;
}
.bTz__wrapper {
    contain: strict;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
}
.bTz__list {
    align-items: center;
    display: flex;
}
.bTz__item {
    margin-right: 20px;
    min-width: 190px;
    width: 190px;
}
.bTz__shadow {
    bottom: 0;
    pointer-events: none;
    position: absolute;
    top: 0;
    width: 190px;
}
.bTz__shadow--right {
    background: linear-gradient(to right, transparent 0, #000 100%);
    right: 0;
}
.bTz__shadow--left {
    background: linear-gradient(to left, transparent 0, #000 100%);
    left: 0;
}
.bTz__scroll-container {
    display: flex;
    overflow: auto;
    position: relative;
}
@media screen and (max-width: 767px) {
    .bTz__shadow {
        width: 100px;
    }
}

.eb {
    align-items: center;
    background: #232325;
    bottom: 0;
    color: rgba(255,255,255,.8);
    display: flex;
    justify-content: center;
    left: 0;
    min-height: 60px;
    padding: 10px 12px;
    position: fixed;
    width: 100%;
    z-index: 11;
    font-size: .813rem;
    line-height: 1.125rem
}

.eb__icon-cookie {
    flex-shrink: 0
}

.eb__description {
    line-height: normal;
    margin: 0 12px 0 15px
}

@media screen and (max-width: 639px) {
    .eb__description {
        font-size:11px
    }
}

@media screen and (max-width: 479px) {
    .eb__description {
        font-size:10px
    }
}

@media screen and (max-width: 320px) {
    .eb__description {
        font-size:9px
    }
}

.eb__learn-more {
    color: #fff;
    opacity: 1
}

@media (max-width: 479px) {
    .eb {
        bottom:calc(60px + env(safe-area-inset-bottom))
    }
}

.dominant-color, .dominant-color-2, .dominant-color-3 {
    position: absolute;
    top: 0;
    width: 100%;
    height: 409px;
    opacity: .72;
    background: linear-gradient(to bottom, rgba(18, 8, 16, 0), #050506);
    transition: all .3s ease-in-out;
}

.dominant-color {
    background-color: rgb(8, 52, 168);
}

.dominant-color-2 {
    background-color: rgb(102, 219, 186);
}

.dominant-color-3 {
    background-color: rgb(115 5 5 / 22%);
}

.login-bg{
    background: #050506!important;
}


.live-badge{
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background: #ef7d00;
    color: #fff;
    border-radius: 0.4em;
    text-transform: uppercase;
    font-size: .7em;
    font-weight: 600;
    letter-spacing: .2em;
    padding: 0.35em 0.5em 0.2em 0.68em;
    transform-origin: center bottom;
    display: block;    
}

.btn-suscribe {
  position: relative;
  background: linear-gradient(-90deg, #EE7752, #E73C7E, #23A6D5, #23D5AB, #EE7752);
  background-size: 400% 100%;
  text-transform: uppercase;
  font-weight: 700;
  border: none;
  border-radius: 2.25em;
  font-size: 13px;
  letter-spacing: 1px;
  padding: 0;
  margin: 0;
  animation: Gradient 4s ease infinite;
  text-decoration: none;
}

.btn-suscribe div {
  color: white;
  padding: 0.35em 1.618em;
  border-radius: inherit;
  background-size: inherit;
  background-image: inherit;
  animation: Gradient 4s ease infinite;
  position: relative;
  z-index: 1;
  mix-blend-mode: overlay;
  font-family: 'Inter';
  font-size: 14px;
  
}

@keyframes Gradient {
    50% {
        background-position: 140% 50%;
    transform: skew(-2deg);
    }
}

.btn-suscribe::after {
  content: '';
  position: absolute;
  background-size: inherit;
  background-image: inherit;
  animation: inherit;
  left: 0px;
  right: 0px;
  top: 2px;
  height: 100%;
  filter: blur(1rem);
}

.r__favorite {
    display: flex;
    flex-direction: column;
    gap: 8px;
    position: absolute;
    right: 10px;
    top: 20px;
    z-index: 4;
}

.eU {
    align-items: stretch;
    display: flex;
    height: calc(100vh - 100px - var(--tap-bar-height) - env(safe-area-inset-bottom));
    margin-bottom: -40px;
    overflow: hidden;
    position: relative;
    border-radius: 20px;
    min-width: 960px;
    max-width: 960px;
}

.eU__left-part {
    background: #0c0c0c;
    display: flex;
    flex: 0 1 340px;
    flex-direction: column;
    position: relative;
    width: min(50%, 340px)
}

.eU__left-part--mobile {
    flex: 1;
    width: 100%
}

.eU__right-part {
    background: #0c0c0c;
    border-left: 1px solid #141414;
    flex: 1;
    min-width: 50%;
    position: relative
}

.eU__content-scroll {
    display: flex;
    flex: 1;
    flex-direction: column;
    max-height: 100%;
    padding-bottom: var(--chats-footer-height)
}

.eU__header {
    align-items: center;
    border-bottom: 1px solid transparent;
    color: #fff;
    display: flex;
    flex-wrap: nowrap;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    gap: 20px;
    height: 64px;
    line-height: 120%;
    padding: 20px
}

.eU__header--scrolled {
    border-bottom-color: #29292b
}

.eU__header-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.eU__header-text {
    align-items: flex-start;
    background: #343437;
    border-radius: 8px;
    color: #a0a0a1;
    display: flex;
    font-size: 14px;
    font-style: normal;
    font-weight: 500;
    gap: 8px;
    line-height: 140%;
    margin: 12px 18px;
    padding: 10px 22px;
    cursor: pointer!important;
}

.eU__back-button.btn {
    background: #343437;
    border-radius: 50%;
    color: #fff;
    display: inline-grid;
    height: 24px;
    place-items: center;
    width: 24px
}

.eU__chats-filter {
    margin: 0 8px 8px
}

.eU__message-detail-header {
    align-items: center;
    border-bottom: 1px solid #29292b;
    display: flex;
    font-size: 20px;
    font-style: normal;
    font-weight: 700;
    gap: 4px;
    height: 64px;
    line-height: 120%;
    padding: 20px
}

.eU__message-detail-scroll {
    height: 100%;
    width: 100%
}

.eU__message-detail-content {
    margin: 0 auto;
    max-width: 800px;
    padding-top: 20px
}

.eU__empty-state {
    color: #cfcfd0;
    font-size: 14px;
    font-weight: 500;
    left: 50%;
    line-height: 140%;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 40px);
    z-index: 1
}

.eU__close-btn {
    color: #707071;
    display: grid;
    height: 40px;
    place-items: center;
    position: absolute;
    right: 0;
    top: 10px;
    width: 40px
}


.bDc {
    align-items: center;
    border-radius: 8px;
    cursor: pointer;
    display: flex;
    margin: 0 8px;
    padding: 12px;
    position: relative;
    transition: background .3s
}

.bDc--mode--page {
    margin-bottom: 4px
}

.bDc--selected,
.bDc--selected .bDc__tier,
.bDc--selected .user-status-icon {
    background: #181818
}

@media (pointer:fine) {
    .bDc:hover,
    .bDc:hover .bDc__tier,
    .bDc:hover .user-status-icon {
        background: #181818
    }
}

.bDc .icon-people {
    color: #fff;
    margin: 0 6px 0 0
}

.bDc__tier {
    align-items: center;
    background: #232325;
    border-radius: 50%;
    bottom: -4px;
    display: flex;
    height: 22px;
    justify-content: center;
    position: absolute;
    right: -4px;
    transition: background .3s;
    width: 22px
}

.bDc__tier .icon-diamond-colored,
.bDc__tier .icon-diamond-flat {
    height: 14px;
    width: 14px
}

.bDc__avatar-wrapper {
    margin: 0 12px 0 0;
    position: relative
}

.bDc .avatar {
    flex-shrink: 0;
    height: 44px;
    width: 44px
}

.bDc .user-status-icon {
    background: #232325;
    height: 12px;
    left: -3px;
    top: -3px;
    width: 12px
}

.bDc__content {
    flex: 1;
    max-width: 75%;
    overflow: hidden
}

.bDc__name {
    align-items: center;
    display: flex
}

.bDc__name .username {
    font-weight: 700
}

.bDc__text {
    color: #a0a0a1;
    margin: 5px 0 0;
    min-height: 16px;
    overflow: hidden;
    padding-right: 5px;
    text-overflow: ellipsis;
    white-space: nowrap;
    text-align: left;
    font-size: 0.8rem;
}

.bDc__time {
    font-size: 12px;
    font-weight: 500;
    letter-spacing: normal;
    line-height: normal;
    color: #5f5f61;
    flex: auto;
    margin: 0 0 0 6px;
    text-align: right;
}

.bDc__menu {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 32px;
    justify-content: center;
    opacity: .4;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: opacity .3s;
    width: 32px
}

@media screen and (max-width:639px) {
    .bDc__menu {
        height: 44px;
        margin-right: -8px;
        width: 44px
    }
    .bDc__new {
        right: 10px !important;
    }  
    .bDc__content {
        max-width:100% !important;
    }        
}

.bDc__menu:hover {
    opacity: 1
}

.bDc__new {
    align-items: center;
    background: #fb0000f7;
    border-radius: 10px;
    color: #fff;
    display: flex;
    font-size: 10px;
    height: 15px;
    justify-content: center;
    min-width: 15px;
    padding: 0 4px;
    pointer-events: none;
    position: absolute;
    right: 20px;
    top: 35px;
}


.bDc .personal-notifications-settings {
    bottom: unset;
    left: unset;
    right: -8px;
    top: 56px
}

@media screen and (max-width:639px) {
    .bDc .personal-notifications-settings {
        bottom: unset;
        left: 7px;
        right: 7px;
        top: 56px;
        width: unset
    }
}

.bDc--menu--top .personal-notifications-settings {
    bottom: 56px;
    top: unset
}

@media screen and (max-width:639px) {
    .bDc--menu--top .personal-notifications-settings {
        bottom: 56px;
        top: unset
    }
}

.bDc--menu--top .personal-notifications-settings-arrow-up {
    bottom: -5px;
    top: unset;
    transform: rotate(180deg)
}

.bDc .personal-notifications-switcher-name {
    cursor: pointer;
    text-decoration: none
}

.bDc .personal-notifications-switcher-name:hover {
    color: #fff
}

.bCa {
    background-color: #0c0c0c;
    border-bottom: 1px solid #141414;
    border-radius: 8px 8px 0 0;
    min-height: 48px;
    position: relative;
    -webkit-user-select: none;
    user-select: none
}

.bCa--mode--page {
    min-height: 64px
}

.bCa--mode--page .bCa__left-block {
    padding-left: 12px;
    justify-content: center;
}

.bCa--collapsed {
    border: 1px solid #515151
}

.bCa--fixed {
    bottom: calc(100% - 62px);
    left: 0;
    position: fixed;
    right: 0;
    z-index: 1
}

.bCa__content {
    align-items: center;
    display: flex;
    height: 100%;
    min-height: 40px
}

.bCa__placeholder {
    height: 62px
}

.bCa__name .displayname__name {
    font-weight: 700;
    line-height: 125%;
    max-width: 164px
}

.bCa__name--collapsed .displayname__name {
    max-width: 126px
}

.bCa__back-block {
    position: absolute;
    left: 10px;
    top: 20px;
    display: none;
}

.bCa__back-block svg{
    width: 20px;
}

.bCa__left-block {
    align-items: center;
    display: flex;
    flex-grow: 1;
    flex-shrink: 0;
    padding-left: 6px
}

.bCa__right-block {
    align-items: flex-start;
    backdrop-filter: blur(2px);
    background: rgba(27, 27, 29, .6);
    border-radius: 12px 12px 0 0;
    bottom: calc(100% - 10px);
    box-shadow: 0 20px 30px 0 rgba(0, 0, 0, .3);
    display: flex;
    justify-content: flex-end;
    padding: 0 0 10px;
    position: absolute;
    right: 0;
    width: 100%;
    z-index: -1
}

.bCa__avatar-wrapper {
    height: 32px;
    margin-right: 11px;
    position: relative;
    width: 32px
}

.bCa__header-button.btn {
    color: #707071
}

.bCa__header-button.btn:hover {
    color: #a0a0a1
}

.bCa__header-button--action-btn {
    height: 40px;
    width: 40px
}

.bCa .unread-messages {
    background-color: var(--primary-light);
    border-radius: 50%;
    height: 8px;
    margin: 0 6px;
    width: 8px
}

.bCa__collapse-button {
    margin-right: 10px;
    opacity: .5;
    transition: opacity 200ms
}

.bCa__call-btn {
    background: 0 0;
    border: 0;
    cursor: pointer;
    padding: 0
}

@media (max-width:639px) {
    .bCa__right-block {
        position: static;
        z-index: 1
    }
}

.bsc {
    border-radius: 8px 8px 0 0;
    box-shadow: 0 20px 30px rgba(0, 0, 0, .3);
    display: flex;
    flex-direction: column !important;
    padding-bottom: env(safe-area-inset-bottom);
    position: relative;
    transition: width 200ms;
    width: 300px
}

.bsc--mode--page {
    border-radius: 0;
    box-shadow: none;
    height: 100%;
    width: 100%
}

.bsc--mode--page.bsc--expanded {
    width: 100%!important
}

.bsc--mode--page .bsc__content--expanded {
    flex: 1;
    width: 100%
}

.bsc--expanded {
    overflow: inherit;
    width: 360px
}

@media (max-width:639px) {
    .bsc--expanded {
        width: 100%
    }
    .bsc--mode--modal {
        border-radius: 0;
        bottom: var(--tap-bar-height);
        left: 0;
        position: fixed;
        right: 0;
        top: 0
    }
}

.bsc:not(:first-child) {
    margin-left: 0px
}

.bsc__content {
    display: flex;
    flex-direction: column;
    height: 0;
    justify-content: flex-end;
    position: relative;
    transition: height 200ms
}

.bsc__content--expanded {
    height: 430px;
    max-height: calc(100vh - 100px)
}

@media (max-width:639px) {
    .bsc__content--expanded {
        flex: 1
    }
}

@media screen and (max-width:639px) {
    .bsc__content--expanded {
        height: auto;
        max-height: none;
        overflow: hidden
    }
    .bsc__content--cookie-expanded {
        max-height: calc(100vh - 160px)
    }
}

.bsc .chat-header-username {
    max-width: 160px
}

.bsc__skeleton-wrapper {
    flex: 1;
    max-height: 100%
}

.bzz {
    flex: 1
}

.bzz__list {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    margin: 0 auto;
    max-width: max(800px, 25vw);
    width: 100%
}

.bzz__message-list-overlay {
    -webkit-backdrop-filter: blur(0);
    backdrop-filter: blur(0);
    bottom: 0;
    left: 0;
    pointer-events: none;
    position: fixed;
    right: 0;
    top: 0;
    transition: backdrop-filter 50ms linear;
    z-index: 2
}

.bzz__message-list-overlay--visible {
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    pointer-events: auto
}

.bGc {
    background: #151516
}

.bGc--own {
    background: rgba(91, 65, 255, .2)
}

.bGc__gallery {
    background: #232325;
    height: 260px;
    min-height: 220px;
    min-width: 300px;
    position: relative
}

.bGc__gallery--uncovered {
    height: 220px
}

.bGc__icon {
    color: #cfcfd0;
    left: 8px;
    pointer-events: none;
    position: absolute;
    top: 8px
}

.bGc__footer {
    padding: 10px 12px 26px;
    text-align: left
}

.bGc__counters {
    color: rgba(255, 255, 255, .4);
    font-size: 12px;
    font-weight: 500;
    line-height: 15px;
    margin-top: 2px
}

.bGc__body {
    margin: 5px 0 0;
    padding-top: 5px;
    word-break: break-word
}

.bGc__right-bottom {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: normal;
    line-height: 12px;
    text-transform: uppercase;
    align-items: center;
    background-color: rgba(0, 0, 0, .4);
    border-radius: 4px;
    color: rgba(248, 248, 248, .8);
    display: flex;
    justify-content: center;
    padding: 4px 8px;
    position: absolute;
    right: 8px;
    top: calc(100% - 8px);
    transform: translateY(-100%)
}

.bGc__play-icon {
    color: #fff;
    position: absolute;
    right: 8px;
    top: 8px
}


.bFc {
    background: #232325;
    height: 260px;
    overflow: inherit
}

.bFc__play {
    align-items: center;
    background-color: #000;
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 34px;
    justify-content: center;
    width: 34px
}

.bEc {
    display: grid;
    gap: 2px;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    height: 100%;
    width: 100%
}

.bEc__item {
    align-items: center;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    justify-content: center
}

.bIc {
    align-items: center;
    background: rgba(0, 0, 0, .6);
    border: 0;
    border-radius: 20px;
    color: #fff;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    justify-content: center;
    left: 50%;
    max-width: 85%;
    min-width: 118px;
    padding: 10px 20px;
    pointer-events: none;
    position: absolute;
    text-align: center;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: background .3s
}

.bIc__icon {
    fill: currentColor;
    height: 20px;
    margin: 0
}

.bIc__icon--unlocked {
    color: #34b353
}

.bIc__label {
    margin-top: 8px
}

.bIc__price {
    font-weight: 700
}

.bIc__original-price {
    color: #b5b6b7;
    font-weight: 700;
    text-decoration: line-through
}

.qc {
    align-items: center;
    background: #151516;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 12px;
    padding: 16px
}

.qc__wrapper {
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: flex-end
}

.qc__or {
    font-size: 12px;
    line-height: 20px;
    margin: 6px 0;
    opacity: .6
}

.qc__blocked-icon.icon {
    height: 45px;
    width: 45px
}

.qc__stub-title {
    font-size: 17px;
    margin: 16px 0;
    text-align: center
}

.qc__stub-description {
    font-size: 14px;
    line-height: 20px;
    margin: 0 0 12px;
    opacity: .6;
    text-align: center
}

.qc__message-icon-wrapper {
    align-items: center;
    background: url('')no-repeat;
    background-size: contain;
    display: flex;
    height: 56px;
    justify-content: center;
    margin: 0 auto;
    width: 56px
}

.qc__message-icon {
    display: block;
    height: 20px;
    width: 20px
}

.qc__unlock {
    animation: opacity-zoom-fade-hide 1.5s;
    bottom: 50%;
    display: flex;
    justify-content: center;
    left: 0;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    width: 100%;
    z-index: 1
}

.qc__unlock-icon {
    height: 30px;
    width: 30px
}

.gcc,
.qc__button-group {
    align-items: center;
    display: flex;
    gap: 10px
}

.qc__button-group .btn {
    padding: 0 16px
}

.bAc {
    align-items: center;
    border-top: 1px solid #141414;
    display: flex;
    flex: 0 0 60px;
    position: relative;
    touch-action: none;
    padding-bottom: 10px;
}

.bAc--hidden,

.bAc--mobile {
    background: #232325;
    bottom: calc(var(--tap-bar-height) + env(safe-area-inset-bottom));
    left: 0;
    position: fixed;
    width: 100%
}

.bAc__shatter {
    align-items: center;
    cursor: pointer;
    display: flex;
    font-size: 12px;
    gap: 3px;
    height: 100%;
    left: 12px;
    position: absolute;
    right: 12px;
    top: 0
}

.bAc__ghost {
    min-height: 40px
}

.bAc .chat-controls-input {
    max-height: 80px;
    padding: 6px 0
}

.bAc__content {
    align-items: center;
    display: flex;
    flex: 1;
    height: 100%
}

.bAc__input-wrapper {
    align-items: center;
    background: #111113;
    border: 1px solid transparent;
    border-radius: 12px;
    display: flex;
    flex: 1;
    margin: 8px;
    min-height: 40px;
    padding: 0 12px;
    position: relative
}

.bAc__input-buttons {
    align-items: center;
    display: flex
}

.bAc .messenger-upload-button-wrapper {
    color: #a0a0a1;
    height: 100%;
    margin-right: 0;
    opacity: 1;
    width: 40px
}

.bAc .smiles-dropdown {
    margin: 0
}

.bAc .smiles-dropdown .trigger {
    color: #fff;
    height: 30px;
    width: auto
}

.bAc .smiles-dropdown .trigger .icon,
.bAc .smiles-dropdown .trigger:hover .icon {
    fill: #fff;
    opacity: .6;
    position: static
}

.bAc__control-button {
    display: grid;
    height: 100%;
    place-items: center;
    width: 40px
}

.bAc__control-button__label {
    align-items: center;
    background: #8a18fc;
    border-radius: 6px;
    color: #fff;
    display: flex;
    font-size: 13px;
    font-weight: 700;
    height: 20px;
    padding: 0 8px
}

.bAc__send-button {
    cursor: default
}

.bAc__send-button--non-empty-input {
    cursor: pointer
}

.bAc__send-button--non-empty-input .send-icon {
    opacity: 1
}

.bAc__send-button--non-empty-input:hover .send-icon {
    transform: scale(1.1, 1.1)
}

.bAc .control-icon {
    color: #fff;
    fill: currentColor;
    height: 20px;
    margin: 0;
    opacity: .6;
    width: 20px
}

.bAc .smiles-dropdown .smiles-list {
    bottom: 40px;
    top: auto
}

@media (max-width:639px) {
    .bAc .smiles-dropdown .smiles-list {
        left: auto;
        right: 0
    }

    .messages-container{
        top:0;
        border-radius: 0;
        height: 100vh;
        width: 100%;

    }
    .eU {
        border-radius: 0;
        height: 100%;
        min-width: 100%;
        width: 100%;
        padding-bottom: 50px;
    }

    .eU__left-part {
        width: 100%;
        flex: 0 0 100%;
    }
    .eU__right-part {
        width: 100%;
        flex: 0 0 100%;
    }    
}


:root {
    --header-cta-height: 80px;
}

/*CTA*/
.header-cta {
    padding: 20px;
    min-height: var(--header-cta-height);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    background: url("https://my.club/blog/assets/header-banner.webp") no-repeat;
    background-size: cover;
    position: fixed;
    top: 50px;
    transform: translateY(-100%);

    left: 0;
    right: 0;
    box-sizing: border-box;
    z-index: 10;
    transition: all 200ms ease;
    box-shadow: 0 1px 20px rgba(0, 0, 0, 0.6);
}

.header-cta--visible {
    transform: translateY(0);
}

.header-cta__texts {
    align-items: center;
    flex: 1;
    display: flex;
    gap: 20px;
}

.header-cta__logo {
    align-items: center;
    display: flex;
    width: 104px;
    min-width: 104px;
}

.header-cta__logo-image {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.header-cta__text {
    font-weight: 700;
    font-size: 20px;
    line-height: 120%;
    color: #FFFFFF;
    text-align: center;
    margin: 0 auto;
    text-shadow: 0 1px 20px rgba(0, 0, 0, 0.4);
}

.header-cta__action {
    min-width: 150px;
}

.header-cta__button {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    padding: 0 20px;
    gap: 10px;
    height: 40px;
    background: #b4189e;
    border-radius: 12px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 600;
    border: none;
    cursor: pointer;
    box-sizing: border-box;
    transition: all 250ms ease;
}

.header-cta__button:hover {
    background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), #FC8A18;
}


.header-cta__button > span {
    white-space: nowrap;
}

.header-cta__button-icon {
    width: 14px;
    height: 14px;
    color: rgba(255, 255, 255, 0.6);
}

@media (max-width: 640px) {
    :root {
        --header-cta-height: 120px;
    }

    .header-cta {
        border-radius: 0 0 12px 12px;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: 10px;
    }

    .header-cta__action {
        width: 100%;
        flex: 1;
    }

    .header-cta__texts {
        align-items: flex-start;
        gap: 20px;
        flex-direction: row-reverse;
        justify-content: space-between;
        width: 100%;
    }

    .header-cta__text {
        text-align: left;
        font-family: 'Helvetica Neue', Helvetica, Roboto, Arial, sans-serif;
        font-style: normal;
        font-weight: 700;
        font-size: 16px;
        line-height: 125%;
        margin: 0;
    }

    .header-cta__button {
        max-width: 100%;
    }

    .header-cta__logo {
        width: 70px;
        min-width: 70px;
    }

    .header-cta__button {
        height: 32px;
        font-size: 13px;
    }
}


.mobile-menu {
    transform: translateY(100px);
    transition: all 200ms ease;
}

.mobile-menu-visible {
    transform: translateY(0);
}

.mobile-menu-invisible {
    transform: translateY(100px);
}

.only-premium-message-username{
    font-weight: bold;
}

.ew {
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding: 20px;
}

@media (max-width:639px) {
    .ew {
        padding: 20px
    }
}

.cf {
    align-items: center;
    background-color: #19191a;
    border-radius: 10px;
    display: flex;
    flex: 1;
    gap: 16px;
    width: 100%
}

.cf--size--reqular {
    padding: 16px
}

.cf--size--reqular-long {
    min-height: 64px;
    padding: 10px 20px
}

.cf--size--small {
    padding: 12px
}

.cf--align--space-between {
    justify-content: space-between
}

.cf--align--left {
    justify-content: flex-start
}

.cf--clickable {
    cursor: pointer
}

.cf--clickable:hover {
    background-color: #343437
}

.cf__left-part {
    display: grid;
    grid-auto-flow: row;
    grid-row-gap: 4px
}

.cf__left-part--grow {
    flex: 1
}

.cf__right-part {
    align-items: center;
    display: flex;
    justify-content: flex-end
}

.cf__right-part--overflow-hidden {
    overflow: hidden
}

.cf__right-part--grow {
    flex: 1
}

.ev__wrapper {
    align-items: center;
    display: flex;
    flex: 1;
    gap: 20px;
    justify-content: space-between;
    width: 100%
}

.icons-hidden{
    display: none;
}


.fs {
    animation: opacity-fade-show .3s;
    background: #232325;
    border-radius: 16px;
    bottom: 10px;
    box-shadow: 0 20px 30px rgba(0, 0, 0, .3);
    display: flex;
    flex-direction: column;
    height: unset;
    left: auto !important;
    max-height: 100%;
    position: fixed;
    right: 30px;
    top: 64px;
    width: 382px;
    z-index: 106
}

.fs--cookie {
    bottom: 70px
}

.fs--is-hiding {
    animation: opacity-fade-hide .3s
}

.fs__verify {
    align-items: center;
    background: #1b1b1d;
    border-radius: 12px;
    display: flex;
    font-size: 14px;
    gap: 12px;
    line-height: 140%;
    margin: 0 8px 4px;
    padding: 12px 42px 12px 12px;
    position: relative
}

.fs__verify-icon {
    align-self: flex-start
}

.fs__verify-close {
    color: #707071;
    cursor: pointer;
    font-size: 0;
    padding: 6px;
    position: absolute;
    right: 4px;
    top: 4px
}

.fs__verify-close:hover {
    color: #a0a0a1
}

.fs .scroll-bar-container {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: none;
    max-width: none;
    overflow-x: hidden;
    width: auto
}

.fs__title {
    align-items: center;
    border-bottom: 1px solid transparent;
    color: #fff;
    display: flex;
    font-size: 20px;
    font-weight: 700;
    height: 65px;
    line-height: 24px;
    margin: 0;
    padding: 20px;
    transition: border-bottom-color .5s
}

.fs__title--scrolled {
    border-bottom-color: #29292b
}

.fs__title button {
    border-radius: 2px;
    height: 24px;
    min-width: 24px;
    width: 24px;
    color: #fff;
    margin-right: 12px
}

.fs__title button:hover {
    background: rgba(248, 248, 248, .1)
}

.fs__title .icon {
    flex-shrink: 0;
    height: 16px;
    margin: 0;
    width: 16px
}

@media (max-width:639px) {
    .fs {
        border-radius: 0;
        height: 100%;
        right: 0;
        top: 0;
        width: 100%
    }
    .fs h2 {
        display: none
    }
}

@media screen and (max-width:639px) {
    .fs {
        height: calc(100% - var(--tap-bar-height) - env(safe-area-inset-bottom))
    }
}

.dt__tabs {
    align-items: center;
    display: flex;
    gap: 20px;
    justify-content: flex-start
}

.dt__tabs-item {
    color: #707071;
    cursor: pointer;
    display: flex;
    overflow: hidden;
    text-overflow: ellipsis
}

.dt__tabs-item--active {
    color: #fff;
    pointer-events: none
}

.dt__tabs-item--with-unread:after {
    background: #ef7d00;
    border-radius: 50%;
    content: "";
    display: block;
    flex: 0 0 10px;
    height: 10px;
    position: relative;
    right: 0;
    top: 0;
    width: 10px
}

@media screen and (max-width:639px) {
    .dt__tabs-item {
        font-size: 16px
    }
}

.dt__tabs-item-content {
    font-size: 20px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.dp {
    flex-shrink: 0;
    position: relative;
    width: 100%
}

.dp--mobile {
    display: flex;
    flex-direction: column;
    gap: 12px
}

.dp__row {
    display: flex;
    gap: 12px
}

.dp__row>a,
.dp__row>button,
.dp__row>div {
    flex-grow: 1;
    justify-content: center;
    text-align: center
}

@media (min-width:479px) {
    .dp__row {
        display: flex;
        gap: 12px
    }
    .dp__row>a,
    .dp__row>button,
    .dp__row>div {
        flex-basis: 50%
    }
}

.dp__favorite {
    display: flex;
    flex-direction: column;
    gap: 12px;
    position: absolute;
    right: 15px;
    top: 70px;
    z-index: 7
}

.dp__dropdown {
    color: #fff;
    font-size: 13px;
    min-width: 350px
}

.dp__dropdown-footer {
    border-top: 1px solid rgba(255, 255, 255, .05);
    margin: 12px 0 0;
    padding: 12px 0 0
}

.dp__dropdown-header {
    align-items: center;
    column-gap: 16px;
    display: flex;
    justify-content: space-between
}

.dp__edit-request-menu-button {
    align-items: center;
    gap: 12px
}

.dp__edit-request-menu-button.btn {
    padding: 0 16px
}

.dp__actions-settings {
    align-items: center;
    display: flex
}

.dp__actions-settings-icon--padded {
    margin: 0 8px 0 0
}

.dp__right {
    display: flex;
    gap: 12px;
    margin: 0 0 0 auto
}

.dp__title {
    align-items: center;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    white-space: nowrap
}

.dp__date {
    font-size: 14px;
    margin: 6px 0 0;
    opacity: .4;
    white-space: nowrap
}

.dp__date--warning {
    color: #ef7d00;
    opacity: 1
}

.dp__join-club-block {
    display: flex
}

.dp__join-club-button.btn {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.dp__dot-button.menu-button-dots__menu-button {
    background: #8a18fc;
    border-left: 1px solid rgba(0, 0, 0, .1);
    border-radius: 0 12px 12px 0;
    filter: none;
    padding: 0 10px;
    position: relative
}

.dp__dot-button.menu-button-dots__menu-button:hover {
    background: #d97706
}

.dp__dot-button--style--ai-primary.menu-button-dots__menu-button {
    background: #a0f0e6;
    color: #050506
}

.dp__dot-button--style--ai-primary.menu-button-dots__menu-button:hover {
    background: #a0f0e6
}

.discover-tabs{
    margin-top: 20px!important;
}

@media screen and (max-width:639px) {
    .dp {
        padding: 0;
        width: 100%
    }
    .dp .action-buttons-container .user-fan-club-status-btn {
        height: 31px;
        justify-content: center;
        margin: 0 0 20px;
        width: 100%
    }
    .dp .splitter {
        display: none
    }
    .discover-tabs{
        margin-top: 0px!important;
    }    
}

.dp__icon-wrapper {
    position: relative
}

.dp__icon-decorator {
    color: #2e1d3e;
    height: 12px;
    position: absolute;
    right: 7px;
    top: -3px;
    width: 12px
}

.dp .icon-diamond-colored,
.dp .icon-diamond-flat,
.dp .icon-diamond-rotate {
    height: 20px;
    margin: 0 10px 0 0;
    width: 20px
}

.subscribeBtnDisabled{
    background: #1e1d1d!important;
}

.payments__options{
    position: relative;
    width: 100%;
    height: 550px;
    background:#0a0a0a;;
}

.payments__iframe{
    width: 100%;height: 100%; border: none; margin: 0; padding: 0;border-radius: 10px;border: none;
}

.select select{
    text-indent: 5px!important;
}

.select select option{
    background: #111113;
    color:#dfdfdf99;
    text-indent: 5px!important;      
}


.documents {
    column-gap: 20px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 10px
}

.m__field-row--long {
    grid-column: span 2
}

.m__row-split {
    background: rgba(255, 255, 255, .05);
    grid-column: span 2;
    height: 1px;
    margin: 6px 0 0
}

.m__field-label {
    flex-basis: 40%;
    line-height: 30px;
    text-align: left;
    white-space: nowrap;
    font-size: .75rem
}

.m__field-input {
    flex-basis: 60%;
    font-size: .75rem
}

.m__field-tooltip {
    margin-left: 10px
}

.m__field-input-optional {
    align-items: center;
    display: flex
}

.m__field-delete-button {
    background: 0 0;
    border: 0;
    color: #707071;
    cursor: pointer;
    margin: 0 11px;
    outline: 0;
    padding: 0
}

@media (max-width:639px) {
    .documents {
        display: block
    }
}

.documents-selection {
    display: flex;
    flex-wrap: wrap;
    gap: 20px
}

.e__item {
    align-items: center;
    background: #232325;
    border: 0;
    border-radius: 10px;
    cursor: pointer;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
    overflow: hidden;
    padding: 0 20px;
    position: relative;
    transition: background .3s;
    width: 100%
}

.e__item--size--small {
    min-height: 148px
}

.e__item--size--reqular {
    min-height: 240px
}

.e__item:hover {
    background: #343437
}

.e__icon {
    align-items: center;
    display: flex;
    justify-content: center
}

.e__icon::before {
    background: radial-gradient(50% 50%at 50% 50%, rgba(189, 16, 1, .2)0, rgba(27, 27, 29, 0) 100%);
    content: "";
    height: 192px;
    position: absolute;
    width: 192px
}

.e__text {
    color: #fff;
    font-size: 16px;
    font-weight: 600
}

@media (max-width:639px) {
    .documents-selection {
        flex-direction: column
    }
    .e__item {
        min-height: 148px
    }
}

.hideFlex{
    display:none!important;
}


.ageRestricted {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background: rgba(0,0,0,.8);
    bottom: 0;
    display: flex;
    justify-content: center;
    left: 0;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    z-index: 10000
}

.ageRestricted__scroll {
    padding: 0 20px;
    width: 100%
}

.ageRestricted__content {
    margin: 0 auto;
    max-width: 440px;
    min-height: 100vh;
    padding: 120px 0 60px;
    width: 100%
}

.ageRestricted__header {
    align-items: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0 auto 40px;
    max-width: 240px
}

.ageRestricted__separator {
    background: rgba(255,255,255,.1);
    height: 1px;
    width: 100%
}

.ageRestricted__reject-button.btn {
    background: 0 0;
    color: #fff;
}

.bm4 {
    background-color: #1b1b1d;
    border-radius: 12px;
    display: flex;
    flex-direction: column;
    max-width: 100%;
    overflow: hidden;
    width: 500px
}

.bm4--size--large {
    width: 760px
}

.bm4__body {
    display: flex;
    flex: 1;
    flex-direction: column
}

.bm4__footer {
    border-top: 1px solid rgba(255, 255, 255, .05);
    max-height: 80px;
    padding: 20px
}

.bm4__footer--sticky {
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    background: rgba(27, 27, 29, .9);
    bottom: 0;
    position: absolute;
    width: 100%;
    z-index: 2
}

.blr {
    align-items: center;
    border-bottom: 2px solid rgba(255, 255, 255, .05);
    display: flex;
    justify-content: flex-start;
    padding: 20px
}

.blr__left {
    height: 48px;
    margin-right: 14px;
    width: 48px
}

.blr__avatar.avatar {
    height: 48px;
    width: 48px
}

.blr__title {
    font-size: 16px;
    font-weight: 700
}

.blr__sub-text {
    color: #707071;
    font-size: 12px
}

.blr__sub-text--last::before {
    content: " • "
}

.blr__avatar {
    height: 48px;
    width: 48px
}

.ft,
.ft__content {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column
}

.ft__content {
    justify-content: center;
    padding: 20px;
    width: 100%
}

.ft__svg-icon {
    margin-bottom: 16px
}

.ft__extra-name {
    color: #fff;
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 20px
}

.ft__description {
    color: #a0a0a1;
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 20px;
    max-width: 340px;
    text-align: center
}

.ft__add-details {
    align-items: center;
    color: #c4e568;
    column-gap: 12px;
    cursor: pointer;
    display: flex;
    font-size: 14px
}

.ft__text-form {
    display: flex;
    position: relative;
    width: 100%
}

.ft__text-form-controls {
    align-items: center;
    bottom: 10px;
    column-gap: 4px;
    display: flex;
    position: absolute;
    right: 5px
}

.ft__text-form-close {
    align-items: center;
    background: rgba(255, 255, 255, .1);
    border-radius: 50%;
    color: #a0a0a1;
    cursor: pointer;
    display: flex;
    height: 20px;
    justify-content: center;
    position: absolute;
    right: 14px;
    top: 10px;
    width: 20px
}

.ft__text-form-close:hover {
    color: #fff
}

.ft__attach-media {
    bottom: 10px;
    left: 5px;
    position: absolute
}

.ft__attach-media button{
    background: none;
    color: #a4a4a4;
    padding: 0 5px;
}

.ft .chat-controls-input--form {
    height: 120px;
}

.ft__vat {
    color: #707071;
    font-size: 12px;
    margin-bottom: 20px
}

.ft__details {
    margin: 0 auto;
    max-width: 420px;
    width: 100%
}

.ft__media-list {
    margin-top: 20px;
    width: 100%
}

.bc__media-preview,
.peso {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    border-radius: 14px
}

.peso {
    background-color: #343437;
    border-radius: 10px;
    height: 76px;
    margin-right: 5px;
    position: relative;
    width: 76px;
    -webkit-user-select: none;
    user-select: none
}

.p--has-error .p__indicators,
.p--in-moderation .p__indicators,
.p--uploading .p__indicators {
    opacity: 1;
    pointer-events: auto
}

.p--draggable {
    cursor: grab
}

.p--hover .p__drag-cover-content {
    opacity: 1;
    transform: translateY(0)
}

.p__badge {
    left: 4px;
    pointer-events: none;
    position: absolute;
    top: 4px
}

.p__time {
    align-items: center;
    background: rgba(0, 0, 0, .8);
    border-radius: 4px;
    bottom: 4px;
    color: #a0a0a1;
    display: flex;
    font-size: 10px;
    height: 14px;
    padding: 0 3px;
    pointer-events: none;
    position: absolute;
    right: 4px
}

.p__add-button {
    align-items: center;
    background-color: none;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    height: 44px;
    justify-content: center;
    position: absolute;
    transition: all ease .25s;
    width: 44px;
    z-index: 1
}


.p__remove-button {
    align-items: center;
    background-color: #5b5b5b;
    border: 3px solid #1b1b1d;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    height: 24px;
    justify-content: center;
    position: absolute;
    right: -8px;
    top: -12px;
    transition: all ease .25s;
    width: 24px;
    z-index: 1
}

.p__remove-button .icon {
    color: #fff;
    fill: #fff;
    margin: 0
}

.p__remove-button:hover {
    background-color: #af262f
}

.p__indicators {
    align-items: center;
    background-color: rgba(0, 0, 0, .8);
    border-radius: inherit;
    bottom: 0;
    container-type: inline-size;
    display: flex;
    justify-content: center;
    left: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: opacity .5s
}

.p__uploading {
    animation: donut-spin 1.2s linear infinite
}

.p__processing {
    color: #fff;
    font-size: 10px;
    font-weight: 500;
    word-break: break-word
}

@container (max-width: 60px) {
    .p__processing {
        font-size: 8px
    }
}

.p__processing--in-moderation {
    color: #fccf49
}

.p__error-icon {
    left: 5px;
    position: absolute;
    top: 5px
}

.p__error-icon .icon {
    color: #e12947;
    fill: #e12947;
    height: 14px;
    margin: 0;
    width: 14px
}

.p__try-again {
    cursor: pointer
}

.p__try-again .icon {
    color: #fff;
    fill: #fff;
    height: 26px;
    margin: 0;
    transition: all ease .25s;
    width: 26px
}

.p__try-again:hover .icon {
    opacity: .7
}

.p__cover-badge {
    border-bottom-right-radius: 8px;
    border-top-left-radius: 8px;
    color: #fff;
    height: 40px;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 40px;
    z-index: 1
}

.p__cover-badge:before {
    border-color: #daff73 transparent transparent #daff73;
    border-style: solid;
    border-width: 20px;
    content: "";
    display: block;
    left: 0;
    position: absolute;
    top: 0
}

.p__cover-badge-icon {
    align-items: center;
    cursor: pointer;
    display: inline-flex;
    justify-content: center;
    margin-left: 4px;
    margin-top: 4px;
    position: relative;
    z-index: 1
}

.p__drag-cover {
    border-radius: 0 0 10px 10px;
    bottom: 0;
    display: flex;
    height: 30%;
    left: 0;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    right: 0
}

.p__drag-cover-content {
    align-items: center;
    background: rgba(5, 5, 6, .8);
    color: #fff;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    opacity: 0;
    transform: translateY(30%);
    transition: transform 250ms ease, opacity 250ms ease;
    width: 100%
}

.p__drag-cover-content::after,
.p__drag-cover-content::before {
    background: #fff;
    border-radius: 12px;
    content: "";
    display: block;
    height: 2px;
    width: 12px
}

.p__drag-cover-content::before {
    margin-bottom: 4px
}

.p__drag-cover-content--teaser {
    opacity: 1;
    transform: translateY(0)
}

.p__drag-cover-content--teaser::after,
.p__drag-cover-content--teaser::before {
    display: none
}

.za {
    align-items: stretch;
    background: #111113;
    border-radius: 12px;
    display: flex;
    flex: 1 0 284px;
    gap: 16px;
    min-height: 128px;
    min-width: 284px;
    padding: 20px 16px 20px 20px;
    transition: background .3s
}

.za--style--accent {
    background: rgba(218, 255, 115, .1)
}

.za--style--accent .za__title {
    color: #c4e568
}

.za--hovered {
    cursor: pointer
}

.za--hovered:hover {
    background: #1b1b1d
}

.za--hovered:hover.za--style--accent {
    background: rgba(218, 255, 115, .2)
}

.za--hovered:hover .gb__chevron-icon {
    color: #cfcfd0
}

.za__left-part {
    flex: 1
}

.za__right-part {
    align-items: center;
    display: flex;
    flex: 0 1 24px;
    flex-direction: column;
    justify-content: space-between;
    width: 24px
}

.za__right-part--center {
    justify-content: center
}

.za__title {
    color: #707071;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 15px;
    text-transform: uppercase
}

.za__body {
    color: #fff;
    display: grid;
    font-size: 36px;
    font-weight: 500;
    margin-bottom: 8px
}

.za__body-content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.za__body-highlight {
    color: #fff;
    font-size: 2rem;
    line-height: 2.5rem
}

.za__description {
    align-items: flex-start;
    color: #707071;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    gap: 10px
}

.za__indicator {
    color: #21b062
}

.za__indicator--spaced {
    margin-right: 8px
}

.za__indicator--negative {
    color: #ef7d00
}

.za__chevron-icon {
    color: #707071
}

.za__help-tooltip {
    color: #707071;
    white-space: normal
}

.za__help-tooltip.help-tooltip:hover {
    color: #a0a0a1
}

.modal-body--padding--large {
    padding: 60px
}

.modal-body--padding--large-s {
    padding: 60px 60px 10px
}

.modal-body--padding--large-ss {
    padding: 40px 40px 20px
}


.modal-body--padding--regular-top {
    padding: 24px 20px
}

.modal-body--padding--small {
    padding: 20px
}

.Esa {
    align-items: stretch;
    background: #111113;
    border-radius: 12px;
    display: flex;
    flex: 1 0 284px;
    gap: 16px;
    min-height: 128px;
    min-width: 284px;
    padding: 20px 16px 20px 20px;
    transition: background .3s;
}

.Esa.selected{
    border:2px solid #fb0102;
}

.Esa--style--accent {
    background: rgba(218, 255, 115, .1)
}

.Esa--style--accent .Esa__title {
    color: #c4e568
}

.Esa--hovered {
    cursor: pointer
}

.Esa--hovered:hover {
    background: #1b1b1d
}

.Esa--hovered:hover.Esa--style--accent {
    background: rgba(218, 255, 115, .2)
}

.Esa--hovered:hover .gf__chevron-icon {
    color: #cfcfd0
}

.Esa__left-part {
    flex: 1
}

.Esa__right-part {
    align-items: center;
    display: flex;
    flex: 0 1 24px;
    flex-direction: column;
    justify-content: space-between;
    width: 24px
}

.Esa__right-part--center {
    justify-content: center
}

.Esa__title {
    color: #707071;
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 15px;
    text-transform: uppercase
}

.Esa__body {
    color: #fff;
    display: grid;
    font-size: 36px;
    font-weight: 500;
    margin-bottom: 8px
}

.Esa__body-content {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.Esa__body-highlight {
    color: #fff;
    font-size: 2rem;
    line-height: 2.5rem
}

.Esa__description {
    align-items: flex-start;
    color: #707071;
    display: flex;
    font-size: 12px;
    font-weight: 400;
    gap: 10px
}

.Esa__indicator {
    color: #21b062
}

.Esa__indicator--spaced {
    margin-right: 8px
}

.Esa__indicator--negative {
    color: #ef7d00
}

.Esa__chevron-icon {
    color: #707071
}

.Esa__help-tooltip {
    color: #707071;
    white-space: normal
}

.Esa__help-tooltip.help-tooltip:hover {
    color: #a0a0a1
}

.D__tiles {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    min-width: 900px
}

@media screen and (max-width:1023px) {
    .D__tiles {
        column-gap: 20px;
        min-width: 100%;
        flex: 0 2;
    }
    .Esa{
        flex: 1 0 200px;
        min-width: 200px;
    }
}

.searchable-head,
.Exa {
    align-items: center;
    -webkit-user-select: none;
    user-select: none
}

.Exa {
    cursor: pointer;
    display: inline-flex;
    gap: 8px;
    text-align: right;
    white-space: nowrap
}

.Exa__icons-container {
    align-items: center;
    display: flex;
    flex-direction: column;
    gap: 2px;
    justify-content: center
}

.Exa__icon-sort {
    color: rgba(255, 255, 255, .2);
    height: 5px;
    margin-left: 5px;
    width: 10px
}

.Exa__icon-sort--up {
    transform: rotate(180deg)
}

.Exa:hover .Exa__icon-sort,
.Exa__icon-sort--active {
    color: rgba(255, 255, 255, .6)
}
.earnings-block-scroll {
    overflow: auto
}

.documents-container {
    display: flex;
    flex-direction: column;
    margin: -20px 0 0
}

.rr {
    border-bottom: 1px solid #29292b;
    display: flex;
    gap: 12px;
    padding: 20px 0
}

.rr--compact {
    flex-wrap: wrap
}

.rr:last-child {
    border-bottom: 0
}

.rr__left,
.rr__right {
    flex: 1
}

.rr__left--compact,
.rr__right--compact {
    flex: none;
    width: 100%
}

.rr__left--compact {
    display: flex;
    justify-content: space-between
}

.rr__right-inner {
    display: flex;
    gap: 10px
}

.rr__header {
    align-items: center;
    display: flex;
    font-size: 16px;
    gap: 12px
}

.rr__number {
    align-items: center;
    background: #29292b;
    border-radius: 8px;
    color: #a0a0a1;
    display: flex;
    font-size: 14px;
    height: 24px;
    justify-content: center;
    width: 24px
}

.rr__description {
    color: #a0a0a1;
    font-size: 12px;
    line-height: 20px;
    padding: 6px 0 0
}

.rr__example {
    align-items: flex-end;
    background: #343437;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    height: 120px;
    margin: 20px 0 0;
    overflow: hidden;
    padding: 10px;
    position: relative;
    text-align: center;
    width: 90px
}

.rr__example--compact {
    margin: 0
}

.rr__example::before {
    background: rgba(0, 0, 0, .4);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.rr__example:hover .rr__img {
    transform: scale(1.1)
}

.rr__img {
    height: 100%;
    left: 0;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
    transition: transform .3s;
    width: 100%
}

.rr__example-expand {
    align-items: center;
    backdrop-filter: blur(2px);
    background: rgba(5, 5, 6, .4);
    border-radius: 50%;
    color: #fff;
    display: flex;
    height: 22px;
    justify-content: center;
    position: absolute;
    right: 4px;
    top: 4px;
    transition: background .3s;
    width: 22px;
    z-index: 1
}

.rr__example-text {
    position: absolute;
    z-index: 1;
    font-size: 0.7rem;
}

@media (max-width:639px) {
    .rr {
        flex-direction: column
    }
    .rr__left {
        display: flex;
        gap: 20px;
        justify-content: space-between
    }
    .rr__example {
        margin: 0
    }
}

.tat {
    background: #343437 center no-repeat;
    background-origin: border-box;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 12px;
    cursor: pointer;
    display: flex;
    flex: 1;
    flex-direction: column;
    justify-content: center;
    min-height: 160px;
    overflow: hidden;
    position: relative
}

.tat--size--small {
    min-height: 60px
}

.tat--size--regular {
    min-height: 160px
}

.tat--disabled {
    pointer-events: none
}

.tat:hover {
    background-color: #424248
}

.tat--rejected,
.tat--rejected:hover {
    background: #000
}

.tat--error {
    border: 1px solid #5e152a
}

.tat--pending {
    opacity: .5;
    pointer-events: none
}

.tat--with-image::before {
    background: rgba(0, 0, 0, .8);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.tat--with-image-complete::before {
    background: rgb(32 179 77 / 29%);
    content: "";
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 1
}

.tat__item {
    align-items: center;
    display: flex;
    flex: 1;
    justify-content: center;
    padding: 16px;
    position: relative;
    z-index: 1
}

.tat__item::before {
    background: rgba(255, 255, 255, .05);
    content: "";
    height: 1px;
    left: 32px;
    position: absolute;
    right: 32px;
    top: 0
}

.tat__item:first-child::before {
    display: none
}

.tat__content {
    display: flex;
    flex-wrap: wrap;
    font-size: 12px;
    gap: 10px;
    justify-content: center;
    text-align: center
}

.tat__content-header {
    align-items: center;
    display: flex;
    gap: 10px
}

@media (max-width:639px) {
    .tat {
        min-height: 60px
    }
}

.chat-assist-badge {
    font-size: 10px;
    text-transform: uppercase;
    opacity: .7;
    margin-right: 6px;
    letter-spacing: .04em;
}

/* ==== themes/red/css/landing.css ==== */
/* ==========================================================================
   Landing page — hero + vitrine de creators
   Prefixo `lp-` para nao colidir com styles.css (37k linhas, legado Belloo).
   Objetivo: a hero tem que ficar bem apresentada com 2 creators OU com 200.
   ========================================================================== */

.lp {
    --lp-bg: #050506;
    --lp-accent: #ef7d00;
    --lp-accent-2: #f59e0b;
    --lp-ink: #ffffff;
    --lp-ink-2: rgba(255, 255, 255, 0.66);
    --lp-ink-3: rgba(255, 255, 255, 0.42);
    --lp-line: rgba(255, 255, 255, 0.1);
    --lp-surface: rgba(255, 255, 255, 0.04);
    --lp-radius: 24px;

    position: relative;
    isolation: isolate;
}

/* --------------------------------------------------------------------------
   Fundo: brilho ambar + campo de estrelas (o nome da casa)
   -------------------------------------------------------------------------- */

.lp-backdrop {
    left: 50%;
    margin-left: -50vw;
    overflow: hidden;
    pointer-events: none;
    position: absolute;
    top: -140px;
    width: 100vw;
    height: 1180px;
    z-index: -1;
    background:
        radial-gradient(30% 34% at 74% 30%, rgba(239, 125, 0, 0.15), transparent 68%),
        radial-gradient(46% 30% at 22% 6%, rgba(245, 158, 11, 0.055), transparent 70%);
    -webkit-mask-image: linear-gradient(180deg, #000 0, #000 58%, transparent 100%);
    mask-image: linear-gradient(180deg, #000 0, #000 58%, transparent 100%);
}

.lp-backdrop::before {
    background-image:
        radial-gradient(1.6px 1.6px at 34px 46px, rgba(255, 255, 255, 0.5), transparent),
        radial-gradient(1.2px 1.2px at 168px 128px, rgba(255, 255, 255, 0.3), transparent),
        radial-gradient(1.9px 1.9px at 268px 62px, rgba(255, 255, 255, 0.38), transparent),
        radial-gradient(1.1px 1.1px at 96px 208px, rgba(255, 255, 255, 0.26), transparent),
        radial-gradient(1.4px 1.4px at 340px 186px, rgba(255, 255, 255, 0.22), transparent);
    background-size: 400px 260px;
    content: "";
    inset: 0;
    opacity: 0.7;
    position: absolute;
    animation: lp-twinkle 7s ease-in-out infinite alternate;
}

@keyframes lp-twinkle {
    from { opacity: 0.45; }
    to { opacity: 0.85; }
}

/* --------------------------------------------------------------------------
   Hero
   -------------------------------------------------------------------------- */

.lp-hero {
    align-items: center;
    display: grid;
    gap: 24px 72px;
    grid-template-columns: minmax(0, 1fr) 384px;
    padding: 72px 0 8px;
}

.lp-hero__copy {
    max-width: 620px;
}

.lp-eyebrow {
    align-items: center;
    background: var(--lp-surface);
    border: 1px solid var(--lp-line);
    border-radius: 999px;
    color: var(--lp-ink-2);
    display: inline-flex;
    font-size: 13px;
    font-weight: 600;
    gap: 8px;
    letter-spacing: 0.01em;
    line-height: 1;
    padding: 8px 14px;
}

.lp-eyebrow__dot {
    background: var(--lp-accent);
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(239, 125, 0, 0.18);
    height: 7px;
    width: 7px;
}

.lp-title {
    font-size: clamp(34px, 4.2vw, 58px);
    font-weight: 800;
    letter-spacing: -0.022em;
    line-height: 1.05;
    margin: 22px 0 0;
}

.lp-title em {
    background: linear-gradient(96deg, var(--lp-accent) 8%, var(--lp-accent-2) 92%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    font-style: normal;
}

.lp-lead {
    color: var(--lp-ink-2);
    font-size: 17px;
    line-height: 1.6;
    margin: 20px 0 0;
    max-width: 520px;
}

.lp-cta {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin: 30px 0 0;
}

.lp-btn {
    align-items: center;
    border: 1px solid transparent;
    border-radius: 14px;
    cursor: pointer;
    display: inline-flex;
    font-family: inherit;
    font-size: 15px;
    font-weight: 700;
    gap: 9px;
    justify-content: center;
    line-height: 1;
    padding: 15px 24px;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease, border-color 0.18s ease;
    white-space: nowrap;
}

.lp-btn:hover { transform: translateY(-1px); }
.lp-btn:active { transform: translateY(0); }

.lp-btn--primary {
    background: linear-gradient(92deg, var(--lp-accent) 0, var(--lp-accent-2) 100%);
    box-shadow: 0 10px 30px -12px rgba(239, 125, 0, 0.85);
    color: #150c02;
}

.lp-btn--primary:hover {
    box-shadow: 0 16px 38px -12px rgba(239, 125, 0, 0.95);
    color: #150c02;
}

.lp-btn--ghost {
    background: var(--lp-surface);
    border-color: var(--lp-line);
    color: var(--lp-ink);
}

.lp-btn--ghost:hover {
    background: rgba(255, 255, 255, 0.075);
    border-color: rgba(255, 255, 255, 0.2);
    color: var(--lp-ink);
}

.lp-btn .icon {
    height: 18px;
    min-width: 18px;
    width: 18px;
}

/* Selos de confianca */

.lp-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 26px;
    list-style: none;
    margin: 30px 0 0;
    padding: 0;
}

.lp-trust__item {
    align-items: center;
    color: var(--lp-ink-2);
    display: flex;
    font-size: 14px;
    font-weight: 500;
    gap: 9px;
}

.lp-trust__item .icon {
    color: var(--lp-accent);
    height: 18px;
    min-width: 18px;
    width: 18px;
}

/* --------------------------------------------------------------------------
   Card do formulario (borda em gradiente que acompanha a altura real)
   -------------------------------------------------------------------------- */

.lp-formcard {
    /* Borda em gradiente que acompanha a altura real do card — o SVG fixo de
       368x564 do tema antigo sobrava embaixo do formulario. */
    background:
        linear-gradient(196deg, rgba(255, 255, 255, 0.055) 0, rgba(255, 255, 255, 0) 46%) padding-box,
        linear-gradient(#0b0b0e, #0b0b0e) padding-box,
        linear-gradient(168deg, rgba(239, 125, 0, 0.85) 0, rgba(255, 255, 255, 0.1) 42%, rgba(255, 255, 255, 0.06) 100%) border-box;
    border: 1px solid transparent;
    border-radius: 28px;
    box-shadow: 0 40px 90px -40px rgba(0, 0, 0, 0.95), 0 0 70px -30px rgba(239, 125, 0, 0.35);
    justify-self: end;
    padding: 32px 26px 28px;
    position: relative;
    width: 100%;
}

.lp-formcard .auth-form__title {
    font-size: 23px;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0 0 6px;
    text-align: center;
}

.lp-formcard__sub {
    color: var(--lp-ink-3);
    font-size: 13px;
    line-height: 1.45;
    margin: 0 0 20px;
    text-align: center;
}

.lp-formcard .auth-form__consent {
    color: var(--lp-ink-3);
    font-size: 12px;
    line-height: 1.45;
    margin: 16px 0 4px;
}

.lp-formcard .auth-form__consent label {
    align-items: flex-start;
    cursor: pointer;
    display: flex;
    gap: 9px;
}

.lp-formcard .auth-form__consent label + label { margin-top: 9px; }
.lp-formcard .auth-form__consent input { margin-top: 3px; }
.lp-formcard .auth-form__consent strong { color: #fff; }
.lp-formcard .auth-form__consent a { color: var(--lp-accent); }

.lp-formcard .auth-form__join {
    background: linear-gradient(92deg, var(--lp-accent) 0, var(--lp-accent-2) 100%) !important;
    border-radius: 14px;
    box-shadow: 0 10px 28px -14px rgba(239, 125, 0, 0.9);
    color: #150c02 !important;
    font-weight: 700;
    margin-top: 16px;
    width: 100%;
}

.lp-formcard .auth-form__form-switcher {
    color: var(--lp-ink-3);
    font-size: 14px;
    margin-top: 18px;
    text-align: center;
}

/* --------------------------------------------------------------------------
   Vitrine de creators — adapta de 1 card ate dezenas
   -------------------------------------------------------------------------- */

.lp-showcase { margin: 72px 0 110px; }

.lp-showcase__head {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    gap: 8px 24px;
    justify-content: space-between;
    margin: 0 0 22px;
}

.lp-showcase__title {
    font-size: 22px;
    font-weight: 700;
    letter-spacing: -0.01em;
    margin: 0;
}

.lp-showcase__subtitle {
    color: var(--lp-ink-3);
    font-size: 14px;
    margin: 6px 0 0;
}

.lp-showcase__link {
    align-items: center;
    color: var(--lp-accent);
    display: inline-flex;
    font-size: 14px;
    font-weight: 600;
    gap: 6px;
}

.lp-showcase__link:hover { color: var(--lp-accent-2); }

.lp-showcase__link .icon {
    height: 14px;
    min-width: 14px;
    width: 14px;
}

.lp-grid {
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
}

/* Poucos creators: nao estica os cards, agrupa a esquerda com largura fixa. */
.lp-grid--sparse {
    grid-template-columns: repeat(auto-fill, 208px);
}

.lp-card {
    aspect-ratio: 1 / 1;
    background: #16161a;
    border: 1px solid var(--lp-line);
    border-radius: var(--lp-radius);
    display: block;
    overflow: hidden;
    position: relative;
    transition: transform 0.24s ease, border-color 0.24s ease, box-shadow 0.24s ease;
}

.lp-card:hover {
    border-color: rgba(239, 125, 0, 0.55);
    box-shadow: 0 18px 40px -22px rgba(0, 0, 0, 0.9), 0 0 0 1px rgba(239, 125, 0, 0.18);
    transform: translateY(-4px);
}

.lp-card__img {
    background: #1c1c21 no-repeat center / cover;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    transition: transform 0.4s ease;
    width: 100%;
}

.lp-card:hover .lp-card__img { transform: scale(1.06); }

/* Creator ainda sem foto de perfil: inicial em vez do placeholder cinza claro. */
.lp-card__img--empty {
    align-items: center;
    background:
        radial-gradient(90% 80% at 50% 12%, rgba(239, 125, 0, 0.16), transparent 70%),
        linear-gradient(168deg, #24242b 0, #131317 100%);
    display: flex;
    justify-content: center;
}

.lp-card__img--empty span {
    color: rgba(255, 255, 255, 0.22);
    font-size: 64px;
    font-weight: 800;
    letter-spacing: -0.02em;
    line-height: 1;
    transform: translateY(-8px);
}

.lp-card__veil {
    background: linear-gradient(180deg, transparent 38%, rgba(0, 0, 0, 0.28) 60%, rgba(0, 0, 0, 0.82) 100%);
    inset: 0;
    position: absolute;
}

.lp-card__foot {
    bottom: 0;
    left: 0;
    padding: 14px;
    position: absolute;
    right: 0;
}

.lp-card__name {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 15px;
    font-weight: 600;
    gap: 5px;
    line-height: 1.2;
    min-width: 0;
}

.lp-card__name span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lp-card__name .icon {
    height: 15px;
    min-width: 15px;
    width: 15px;
}

.lp-card__meta {
    color: rgba(255, 255, 255, 0.62);
    font-size: 12px;
    margin: 4px 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Card-convite: transforma o vazio em funil de captacao de creator */

.lp-card--invite {
    align-items: center;
    background:
        radial-gradient(120% 90% at 50% 0, rgba(239, 125, 0, 0.14), transparent 68%),
        rgba(255, 255, 255, 0.02);
    border: 1px dashed rgba(239, 125, 0, 0.4);
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
    text-align: center;
}

.lp-card--invite:hover {
    background:
        radial-gradient(120% 90% at 50% 0, rgba(239, 125, 0, 0.22), transparent 68%),
        rgba(255, 255, 255, 0.03);
    border-color: rgba(239, 125, 0, 0.75);
}

.lp-card__badge {
    align-items: center;
    background: rgba(239, 125, 0, 0.12);
    border: 1px solid rgba(239, 125, 0, 0.3);
    border-radius: 16px;
    color: var(--lp-accent);
    display: flex;
    height: 46px;
    justify-content: center;
    margin: 0 0 14px;
    width: 46px;
}

.lp-card__badge .icon {
    height: 22px;
    min-width: 22px;
    width: 22px;
}

.lp-card__invite-title {
    color: #fff;
    font-size: 16px;
    font-weight: 700;
}

.lp-card__invite-text {
    color: var(--lp-ink-3);
    font-size: 12.5px;
    line-height: 1.45;
    margin: 7px 0 0;
}

/* --------------------------------------------------------------------------
   Responsivo
   -------------------------------------------------------------------------- */

@media screen and (max-width: 1100px) {
    .lp-hero {
        gap: 44px;
        grid-template-columns: minmax(0, 1fr);
        padding-top: 48px;
    }
    .lp-hero__copy {
        margin: 0 auto;
        text-align: center;
    }
    .lp-lead { margin-left: auto; margin-right: auto; }
    .lp-cta, .lp-trust { justify-content: center; }
    .lp-formcard {
        justify-self: center;
        max-width: 420px;
    }
    .lp-backdrop { height: 900px; }
    .lp-backdrop::after { display: none; }
}

@media screen and (max-width: 767px) {
    .lp-hero { padding-top: 28px; }
    .lp-lead { font-size: 15.5px; }
    .lp-trust { gap: 10px 18px; }
    .lp-trust__item { font-size: 13px; }
    .lp-showcase { margin: 56px 0 80px; }
    .lp-grid {
        gap: 12px;
        grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    }
    .lp-grid--sparse { grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); }
    .lp-btn { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .lp-backdrop::before { animation: none; }
    .lp-card, .lp-card__img, .lp-btn { transition: none; }
}

/* --------------------------------------------------------------------------
   Mockup de celular em CSS (secao "Na Palma da Sua Mao")
   Substitui themes/red/images/mobile.png — print do script original com logo
   BellooRed, interface em ingles, preco em USD e fotos de terceiros.
   -------------------------------------------------------------------------- */

.lp-phone {
    display: flex;
    justify-content: center;
    padding: 20px 0;
    position: relative;
}

.lp-phone::before {
    background: radial-gradient(50% 50% at 50% 45%, rgba(239, 125, 0, 0.22), transparent 70%);
    content: "";
    height: 100%;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 150%;
    z-index: 0;
}

.lp-phone__frame {
    background: linear-gradient(160deg, #34363f 0, #16171b 55%, #2a2c34 100%);
    border-radius: 46px;
    box-shadow: 0 40px 90px -30px rgba(0, 0, 0, 0.95), inset 0 0 0 1px rgba(255, 255, 255, 0.07);
    padding: 10px;
    position: relative;
    width: 306px;
    z-index: 1;
}

.lp-phone__screen {
    background: #08080a;
    border-radius: 37px;
    color: #fff;
    display: flex;
    flex-direction: column;
    font-size: 12px;
    height: 646px;
    overflow: hidden;
    position: relative;
}

.lp-phone__screen::before {
    background: #0d0d10;
    border-radius: 0 0 12px 12px;
    content: "";
    height: 20px;
    left: 50%;
    position: absolute;
    top: 0;
    transform: translateX(-50%);
    width: 104px;
    z-index: 3;
}

.lp-phone__bar {
    align-items: center;
    display: flex;
    flex: none;
    justify-content: space-between;
    padding: 26px 14px 10px;
}

.lp-phone__brand {
    align-items: center;
    color: #fff;
    display: flex;
    font-size: 14px;
    font-weight: 700;
    gap: 5px;
    letter-spacing: -0.01em;
}

.lp-phone__brand .icon {
    color: var(--lp-accent, #ef7d00);
    height: 15px;
    min-width: 15px;
    width: 15px;
}

.lp-phone__avatar--me {
    background: linear-gradient(150deg, #4a4a55, #26262d);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 50%;
    display: block;
    height: 24px;
    width: 24px;
}

.lp-phone__cover {
    background:
        radial-gradient(70% 90% at 22% 8%, rgba(239, 125, 0, 0.5), transparent 62%),
        radial-gradient(80% 80% at 88% 78%, rgba(163, 73, 252, 0.32), transparent 60%),
        linear-gradient(155deg, #2a1b0d 0, #141017 100%);
    flex: none;
    height: 122px;
    position: relative;
}

.lp-phone__live {
    background: #e01e2b;
    border-radius: 5px;
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: 0.06em;
    padding: 3.5px 6px;
    position: absolute;
    right: 12px;
    top: 12px;
}

.lp-phone__pic {
    align-items: center;
    background: linear-gradient(150deg, #3a3a44 0, #1b1b21 100%);
    border: 2.5px solid #08080a;
    border-radius: 18px;
    bottom: -26px;
    color: rgba(255, 255, 255, 0.35);
    display: flex;
    font-size: 26px;
    font-weight: 800;
    height: 64px;
    justify-content: center;
    left: 14px;
    position: absolute;
    width: 64px;
}

/* min-height:0 + overflow:hidden deixam o conteudo ser cortado como numa tela
   real de app, mantendo a barra de navegacao colada no rodape do aparelho. */
.lp-phone__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
    padding: 34px 14px 8px;
}

.lp-phone__name {
    align-items: center;
    display: flex;
    font-size: 16px;
    font-weight: 700;
    gap: 4px;
    letter-spacing: -0.01em;
}

.lp-phone__name .icon {
    height: 13px;
    min-width: 13px;
    width: 13px;
}

.lp-phone__handle {
    color: rgba(255, 255, 255, 0.42);
    font-size: 11.5px;
    margin-top: 1px;
}

.lp-phone__status {
    align-items: center;
    color: rgba(255, 255, 255, 0.62);
    display: flex;
    font-size: 10.5px;
    gap: 5px;
    margin-top: 8px;
}

.lp-phone__status i {
    background: #35d07f;
    border-radius: 50%;
    box-shadow: 0 0 0 3px rgba(53, 208, 127, 0.16);
    height: 6px;
    width: 6px;
}

.lp-phone__actions {
    display: flex;
    gap: 7px;
    margin-top: 13px;
}

.lp-phone__btn {
    align-items: center;
    background: rgba(255, 255, 255, 0.07);
    border-radius: 10px;
    color: #fff;
    display: flex;
    font-size: 11.5px;
    font-weight: 700;
    gap: 6px;
    justify-content: center;
    padding: 10px 12px;
}

.lp-phone__btn .icon {
    height: 13px;
    min-width: 13px;
    width: 13px;
}

.lp-phone__btn--primary {
    background: linear-gradient(92deg, #ef7d00 0, #f59e0b 100%);
    color: #150c02;
    flex: 1;
}

.lp-phone__stories {
    display: grid;
    gap: 7px;
    grid-template-columns: repeat(4, 1fr);
    margin-top: 14px;
}

.lp-phone__stories span {
    aspect-ratio: 1 / 1;
    background: linear-gradient(150deg, #2c2c34 0, #17171c 100%);
    border-radius: 12px;
    box-shadow: 0 0 0 1.5px rgba(239, 125, 0, 0.55);
}

.lp-phone__tabs {
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    display: flex;
    gap: 16px;
    margin-top: 16px;
}

.lp-phone__tabs span {
    color: rgba(255, 255, 255, 0.4);
    font-size: 11px;
    font-weight: 600;
    padding-bottom: 8px;
}

.lp-phone__tabs .is-active {
    border-bottom: 2px solid var(--lp-accent, #ef7d00);
    color: #fff;
}

.lp-phone__grid {
    display: grid;
    gap: 5px;
    grid-template-columns: repeat(3, 1fr);
    margin-top: 10px;
}

.lp-phone__grid span {
    align-items: center;
    aspect-ratio: 1 / 1;
    background: linear-gradient(155deg, #24242b 0, #141418 100%);
    border-radius: 8px;
    display: flex;
    justify-content: center;
}

.lp-phone__grid .is-locked {
    background:
        radial-gradient(80% 80% at 50% 40%, rgba(239, 125, 0, 0.14), transparent 70%),
        linear-gradient(155deg, #1d1a17 0, #121114 100%);
}

.lp-phone__grid .is-locked .icon {
    color: rgba(239, 125, 0, 0.75);
    height: 14px;
    min-width: 14px;
    width: 14px;
}

.lp-phone__nav {
    align-items: center;
    background: #0d0d10;
    border-top: 1px solid rgba(255, 255, 255, 0.06);
    display: flex;
    flex: none;
    justify-content: space-around;
    padding: 11px 0 16px;
}

.lp-phone__nav span .icon {
    color: rgba(255, 255, 255, 0.32);
    height: 17px;
    min-width: 17px;
    width: 17px;
}

.lp-phone__nav .is-active .icon { color: var(--lp-accent, #ef7d00); }

@media screen and (max-width: 767px) {
    .lp-phone__frame { width: 274px; }
    .lp-phone__screen { height: 606px; }
}

.locale-switch {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin: 0 8px;
    padding: 3px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
}
.locale-switch__link {
    min-width: 36px;
    padding: 6px 8px;
    border-radius: 999px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1;
    text-align: center;
    text-decoration: none;
}
.locale-switch__link.is-active {
    background: #ef7d00;
    color: #111114;
}
.locale-switch--age {
    margin: 0 0 16px;
}
@media (pointer: coarse) {
    .locale-switch__link {
        min-width: 44px;
        padding: 10px 12px;
    }
}

.locale-menu {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    margin: 0 8px;
}
.locale-menu__trigger {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    min-height: 40px;
    padding: 0 8px 0 10px;
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.04);
    color: rgba(255, 255, 255, 0.86);
    font: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    transition: background-color 160ms ease, border-color 160ms ease;
}
.locale-menu__trigger:hover,
.locale-menu.is-open .locale-menu__trigger {
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.08);
}
.locale-menu__trigger:active {
    background: rgba(255, 255, 255, 0.12);
}
.locale-menu__trigger:focus-visible,
.locale-menu__option:focus-visible {
    outline: 2px solid #ef7d00;
    outline-offset: 2px;
}
.locale-menu__globe,
.locale-menu__chevron,
.locale-menu__check {
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.locale-menu__globe {
    width: 18px;
    height: 18px;
}
.locale-menu__chevron {
    width: 16px;
    height: 16px;
    opacity: 0.6;
    transition: transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
}
.locale-menu.is-open .locale-menu__chevron {
    transform: rotate(180deg);
}
.locale-menu__list {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 1000;
    min-width: 208px;
    margin: 0;
    padding: 6px;
    list-style: none;
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 16px;
    background: #141417;
    box-shadow:
        0 1px 2px rgba(0, 0, 0, 0.4),
        0 8px 24px rgba(0, 0, 0, 0.45),
        0 24px 48px rgba(0, 0, 0, 0.35);
    transform-origin: top right;
    animation: locale-menu-in 160ms cubic-bezier(0.23, 1, 0.32, 1);
}
.locale-menu__list[hidden] {
    display: none;
}
.locale-menu__option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 44px;
    padding: 0 12px;
    border-radius: 10px;
    color: rgba(255, 255, 255, 0.86);
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    -webkit-tap-highlight-color: transparent;
}
.locale-menu__option:hover,
.locale-menu__option:active {
    background: rgba(255, 255, 255, 0.07);
    color: #fff;
}
.locale-menu__option.is-active {
    color: #fff;
    font-weight: 700;
}
.locale-menu__check {
    width: 18px;
    height: 18px;
    color: #ef7d00;
    stroke-width: 2.4;
    visibility: hidden;
}
.locale-menu__option.is-active .locale-menu__check {
    visibility: visible;
}
@keyframes locale-menu-in {
    from {
        opacity: 0;
        transform: translateY(-4px) scale(0.97);
    }
}
@media (prefers-reduced-motion: reduce) {
    .locale-menu__list,
    .locale-menu__chevron {
        animation: none;
        transition: none;
    }
}
@media (max-width: 479px) {
    .locale-menu {
        margin: 0 0 0 4px;
    }
    /* Rótulos longos (en/es) não podem alargar o hero além da tela. */
    .lp-hero__copy {
        min-width: 0;
    }
    .lp-btn {
        white-space: normal;
        text-align: center;
    }
}
.legal-official-note {
    margin: 0 0 16px;
    color: rgba(255, 255, 255, 0.72);
    font-size: 14px;
    line-height: 1.5;
}

/* Menu da conta no cabeçalho mobile: ocupa a largura com margem e vai até a
   barra de navegação inferior, para Painel admin e Sair ficarem alcançáveis. */
.header-user-menu--mobile.header-dropdown .header-dropdown-content-wrapper {
    position: fixed;
    top: 64px;
    right: 12px;
    left: 12px;
}
.header-user-menu--mobile.header-dropdown .header-dropdown-content-wrapper:before {
    display: none;
}
.header-user-menu--mobile.header-dropdown .scroll-bar-container {
    max-width: none;
    max-height: calc(100vh - 64px - 76px - env(safe-area-inset-bottom, 0px));
    max-height: calc(100dvh - 64px - 76px - env(safe-area-inset-bottom, 0px));
    overscroll-behavior: contain;
}
.header-user-menu--mobile.header-dropdown .header-dropdown-content {
    min-width: 0;
}

/* ==== themes/red/css/theme.css ==== */
/* Campos de formulário usam a fonte da marca (Open Sans), como o resto do app.
   input/select/textarea/button não herdam fonte por padrão, e o legado apontava
   o textarea para Rubik, que não é carregada. */
input,
select,
textarea,
button {
	font-family: inherit;
}


.top-search-hidden{
	background: none;
}
.top-search-hidden::before {
	padding-bottom: 0%;
}


.profile-bg-cover{
  background-size: cover !important;
  background-position: 50% !important;
  background-repeat: no-repeat !important;
}

.image-bg-cover{
  background-size: cover !important;
  background-position: 50% !important;
  background-repeat: no-repeat !important;
}

.profile-banner-edit-button {
  backdrop-filter: blur(12px);
  border: 1px solid rgba(255, 255, 255, .14);
  box-shadow: 0 6px 20px rgba(0, 0, 0, .24);
  cursor: pointer;
  display: inline-flex;
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  position: absolute;
  right: 24px;
  top: 24px;
  z-index: 10;
}
.profile-cover-wrapper .br__media {
  pointer-events: auto;
}
.profile-banner-edit-button * {
  pointer-events: none;
}
.profile-banner-edit-button .icon {
  height: 18px;
  width: 18px;
}
.profile-banner-edit-button:hover {
  border-color: rgba(255, 255, 255, .24);
  box-shadow: 0 8px 24px rgba(0, 0, 0, .32);
}
@media screen and (max-width: 639px) {
  .profile-banner-edit-button {
    right: 16px;
    top: 16px;
  }
}

.chat-messages{
  height: 75vh;
  max-height: 550px;
}
.chat-conversations{
  height: 80vh;
  max-height: 670px;
  overflow-y: scroll;
  
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
/* Track */
::-webkit-scrollbar-track {
  border-radius: 100vh;
  background: none;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: rgba(0,0,0,.2);
  border-radius: 10px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: rgba(0,0,0,.4);
}

.chat-conversations-container{
  height: 100%;
  overflow-y: hidden;

}
.chat-container{
  margin-bottom: 20px !important;
}
@media screen and (max-width: 768px) {
  .chat-conversations{
    height: 100%;
    overflow-y: scroll;
  }
  .chat-conversations-container{
    height: 95%;
    overflow-y: hidden;
  }
  .chat-container{
    margin-bottom: 0px !important;
  }
}

.profile-image-editor {
  align-items: center;
  background: rgba(0, 0, 0, .78);
  display: none;
  inset: 0;
  justify-content: center;
  padding: 16px;
  position: fixed;
  z-index: 10000;
}
.profile-image-editor.is-visible {
  display: flex;
}
.profile-image-editor__dialog {
  background: #202023;
  border-radius: 14px;
  box-shadow: 0 18px 70px rgba(0, 0, 0, .45);
  max-width: 460px;
  padding: 20px;
  width: 100%;
}
.profile-image-editor__header {
  align-items: center;
  display: flex;
  justify-content: space-between;
}
.profile-image-editor__header h2 {
  color: #fff;
  font-size: 20px;
  margin: 0;
}
.profile-image-editor__close {
  background: transparent;
  border: 0;
  color: #fff;
  cursor: pointer;
  font-size: 28px;
  line-height: 1;
  padding: 0 4px;
}
.profile-image-editor__hint {
  color: rgba(255, 255, 255, .68);
  font-size: 13px;
  margin: 8px 0 14px;
}
.profile-image-editor__stage {
  background: #0d0d0e;
  border-radius: 50%;
  height: min(72vw, 360px);
  margin: 0 auto 18px;
  max-height: 360px;
  max-width: 360px;
  overflow: hidden;
  position: relative;
  touch-action: none;
  width: min(72vw, 360px);
}
.profile-image-editor__stage--cover {
  aspect-ratio: 2 / 1;
  border-radius: 12px;
  height: auto;
  max-height: 220px;
  max-width: 420px;
  width: min(84vw, 420px);
}
.profile-image-editor__stage--feed {
  aspect-ratio: 16 / 9;
  border-radius: 12px;
  height: auto;
  max-height: 240px;
  max-width: 426px;
  width: min(84vw, 426px);
}
.profile-image-editor__stage canvas {
  display: block;
  height: 100%;
  width: 100%;
}
.profile-image-editor__mask {
  border: 2px solid rgba(255, 255, 255, .8);
  border-radius: 50%;
  inset: 0;
  pointer-events: none;
  position: absolute;
}
.profile-image-editor__stage--cover .profile-image-editor__mask,
.profile-image-editor__stage--feed .profile-image-editor__mask {
  border-radius: 12px;
}
.profile-image-editor__zoom {
  color: #fff;
  display: block;
  font-size: 13px;
}
.profile-image-editor__zoom input {
  accent-color: #ef7d00;
  display: block;
  margin-top: 8px;
  width: 100%;
}
.profile-image-editor__actions {
  display: flex;
  gap: 10px;
  justify-content: flex-end;
  margin-top: 20px;
}
@media screen and (max-width: 480px) {
  .profile-image-editor__dialog {
    padding: 16px;
  }
  .profile-image-editor__actions button {
    flex: 1;
  }
}

/* Botão de ícone do cabeçalho mobile (Atividade), com área de toque de 44px. */
.header-icon-button {
	align-items: center;
	border-radius: 999px;
	color: rgba(255, 255, 255, 0.8);
	display: inline-flex;
	height: 44px;
	justify-content: center;
	margin-right: 4px;
	-webkit-tap-highlight-color: transparent;
	width: 44px;
}
.header-icon-button:active {
	background: rgba(255, 255, 255, 0.08);
}
.header-icon-button .icon {
	height: 22px;
	width: 22px;
}

/* Barra inferior: os itens dividem a largura por igual e nunca passam da tela. */
.da__navigation .da__menu-item-button {
	flex: 1 1 0;
	min-width: 0;
	padding: 6px 2px;
}
@media (max-width: 359px) {
	.da__navigation {
		font-size: 10px;
		letter-spacing: -0.01em;
	}
	.da__navigation .da__menu-item-button {
		padding: 6px 0;
	}
}

/* Painel de Atividade: no mobile cobre a tela, então precisa de um botão de fechar. */
.fs__title {
	justify-content: space-between;
}
.fs__close {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 999px;
	color: rgba(255, 255, 255, 0.8);
	cursor: pointer;
	display: inline-flex;
	height: 44px;
	justify-content: center;
	margin-right: -10px;
	width: 44px;
}
.fs__close:hover,
.fs__close:active {
	background: rgba(255, 255, 255, 0.08);
	color: #fff;
}
.fs__close .icon {
	height: 18px;
	width: 18px;
}

/* Abas do feed (Top / Em alta / Novos) no mesmo controle segmentado de
   Descobrir e Publicações (.pill-control). */
.bLL__header {
	align-items: center;
	gap: 12px;
}
.bLL__tabs {
	background: #1c1c1c;
	border-radius: 12px;
	color: #fff;
	flex: 0 1 420px;
	font-size: 14px;
	font-weight: 500;
	gap: 0;
	min-width: 0;
}
.bLL__tab {
	align-items: center;
	border-radius: 8px;
	display: flex;
	flex: 1;
	height: 32px;
	justify-content: center;
	margin: 4px;
	opacity: 0.6;
	padding: 0 12px;
	transition: opacity 0.3s;
	white-space: nowrap;
}
.bLL__tab:hover {
	opacity: 1;
}
.bLL__tab--active {
	background: #343437;
	opacity: 1;
}
.bLL__link {
	flex: 0 0 auto;
	font-size: 14px;
	min-height: 44px;
}

/* Documentos legais (Termos, Privacidade, Cookies, DMCA, 2257):
   título > seção > texto, na tipografia da marca. */
.legal-doc {
	color: rgba(255, 255, 255, 0.78);
	font-size: 15px;
	line-height: 1.7;
	margin: 0 auto;
	max-width: 760px;
	padding: 24px 0 64px;
}
.legal-doc h4 {
	color: #fff;
	font-size: clamp(26px, 4vw, 34px);
	font-weight: 800;
	letter-spacing: -0.02em;
	line-height: 1.15;
	margin: 0 0 8px;
}
.legal-doc h5 {
	color: #fff;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.35;
	margin: 36px 0 12px;
}
.legal-doc p,
.legal-doc li {
	margin: 0 0 14px;
}
.legal-doc ul,
.legal-doc ol {
	margin: 0 0 14px;
	padding-left: 22px;
}
.legal-doc strong {
	color: #fff;
}
.legal-doc a {
	color: #ef7d00;
	text-decoration: underline;
	text-underline-offset: 2px;
}

/* Checkbox e radio nativos na cor de destaque da marca. */
input[type="checkbox"],
input[type="radio"] {
	accent-color: #ef7d00;
}

/* ==== themes/red/css/age-gate.css ==== */
/* Adult notice: the platform's black and amber identity. */
.age-verification {
    position: fixed;
    inset: 0;
    z-index: 10001;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: #080808;
    color: #f5f5f5;
    font-family: 'Open Sans', sans-serif;
}
.age-verification *, .age-verification *::before, .age-verification *::after { box-sizing: border-box; }
.age-verification__viewport {
    display: flex;
    min-height: 100%;
    padding: 28px 24px;
}
.age-verification__card {
    width: 100%;
    max-width: 700px;
    margin: auto;
    padding: 48px 38px 32px;
    border: 1px solid #303030;
    border-radius: 2px;
    background: #050505;
    box-shadow: 0 0 48px rgba(255, 255, 255, .055);
    text-align: center;
}
.age-verification__brand { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 28px; }
.age-verification__brand img { display: block; }
.age-verification__brand > span { font-size: 26px; line-height: 1.1; font-weight: 800; letter-spacing: .12em; text-align: left; }
.age-verification__brand small { display: block; margin-top: 6px; font-size: 9px; font-weight: 600; letter-spacing: .26em; color: #f59e0b; }
.age-verification h2 { margin: 0; color: #fff; font-size: clamp(27px, 4vw, 34px); font-weight: 700; letter-spacing: -.025em; line-height: 1.25; }
.age-verification__notice { display: inline-block; margin: 20px 0 18px; padding: 7px 22px; border: 1px solid #6a6a6a; border-radius: 999px; color: #d5d5d5; font-size: 11px; font-weight: 600; line-height: 1.5; }
.age-verification__description { max-width: 600px; margin: 0 auto; color: #ddd; font-size: 16px; line-height: 1.65; }
.age-verification__description strong { color: #fff; font-weight: 700; }
.age-verification__message { margin: 12px auto 0; max-width: 560px; color: #f5a623; font-size: 13px; font-weight: 500; line-height: 1.6; }
.age-verification__actions { display: grid; gap: 10px; max-width: 310px; margin: 30px auto 0; }
.age-verification__actions button { width: 100%; min-height: 44px; margin: 0; padding: 11px 18px; border: 1px solid #717171; border-radius: 999px; font: inherit; font-size: 12px; font-weight: 600; line-height: 1.6; cursor: pointer; transition: background-color .15s, border-color .15s; }
.age-verification .age-verification__primary { background: rgba(239, 125, 0, .06); border-color: #ef7d00; color: #f5f5f5; }
.age-verification .age-verification__primary:hover:not(:disabled) { background: #ef7d00; color: #080808; }
.age-verification__primary:disabled { opacity: .6; cursor: not-allowed; }
.age-verification .age-verification__exit { background: transparent; color: #ddd; }
.age-verification__exit:hover { background: #181818; border-color: #aaa; }
.age-verification__parental { margin: 34px auto 0; max-width: 570px; }
.age-verification__parental h3 { margin: 0 0 8px; color: #ddd; font-size: 15px; font-weight: 700; line-height: 1.5; }
.age-verification__parental p { margin: 0; color: #aaa; font-size: 13px; line-height: 1.7; }
.age-verification__footer { margin-top: 22px; font-size: 13px; line-height: 1.6; }
.age-verification__footer nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; color: #777; }
.age-verification__footer a { color: #f5a623; text-decoration: none; }
.age-verification__footer a:hover { text-decoration: underline; text-underline-offset: 3px; }
.age-verification__footer p { margin: 28px 0 0; color: #858585; font-size: 10px; }
.age-verification__footer p span { padding: 0 6px; }
.age-verification :focus-visible { outline: 2px solid #f5a623; outline-offset: 5px; }
.age-verification h2:focus { outline: none; }
@media (max-width: 520px) {
    .age-verification__viewport { padding: 16px 12px; }
    .age-verification__card { padding: 30px 20px 24px; }
    .age-verification__brand { margin-bottom: 24px; }
    .age-verification__description { font-size: 14px; }
    .age-verification__actions { margin-top: 24px; }
    .age-verification__parental { margin-top: 28px; }
}
@media (prefers-reduced-motion: reduce) {
    .age-verification__actions button { transition: none; }
}

/* ==== themes/red/css/live-room.css ==== */
.live-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.streamingWrapper,
.streamingWrapperMobile {
    position: relative;
    min-height: 62vh;
}

.live-photo-stage {
    width: 100%;
    min-height: 62vh;
    height: 100%;
    background-color: #111;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.live-camera {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #111;
}

.live-gift-float {
    position: absolute;
    left: 16px;
    bottom: 72px;
    z-index: 5;
    display: flex;
    align-items: center;
    gap: 8px;
    max-width: calc(100% - 32px);
    padding: 8px 12px;
    border-radius: 999px;
    background: rgba(10, 10, 12, 0.86);
    color: #fff;
    pointer-events: none;
    animation: liveGiftRise 4s ease-out forwards;
}

.live-gift-float img {
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.live-gift-float span {
    font-size: 13px;
    line-height: 1.3;
}

@keyframes liveGiftRise {
    0% { transform: translateY(12px); opacity: 0; }
    12% { opacity: 1; }
    100% { transform: translateY(-180px); opacity: 0; }
}

.live-support {
    position: fixed;
    inset: 0;
    z-index: 400;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    background: rgba(0, 0, 0, 0.45);
}

.live-support[hidden] {
    display: none;
}

.live-broadcast__row {
    display: flex;
    gap: 8px;
    align-items: center;
}

.live-broadcast__row input {
    flex: 1;
    min-width: 0;
    margin-top: 0;
}

.live-output-list {
    list-style: none;
    margin: 0 0 12px;
    padding: 0;
}

.live-output-list li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 8px 0;
    border-bottom: 1px solid #2a2a30;
}

.live-output-list strong,
.live-output-list span {
    display: block;
}

.live-output-list span {
    color: #a1a1aa;
    font-size: 12px;
    word-break: break-all;
}

#liveOutputSubmit {
    margin-top: 8px;
}

.live-support__sheet {
    width: min(520px, 100%);
    max-height: 92vh;
    overflow: auto;
    padding: 16px 16px 20px;
    border-radius: 16px 16px 0 0;
    background: #16161a;
    color: #f4f4f5;
    box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.45);
}

.live-support__head,
.live-support__tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.live-support__tabs {
    margin: 12px 0;
}

.live-support__tabs button,
.live-support__close,
.live-support__gift,
.live-support__pix-btn {
    border: 0;
    cursor: pointer;
    color: #fff;
    background: #2a2a30;
}

.live-support__tabs button,
.live-support__close {
    border-radius: 999px;
    padding: 8px 14px;
}

.live-support__tabs button.is-active {
    background: #e11d48;
}

.live-support__note,
.live-support__balance {
    margin: 0 0 12px;
    color: #c4c4cc;
    font-size: 13px;
    line-height: 1.45;
}

.live-support__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    gap: 8px;
}

.live-support__gift,
.live-support__pix-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-height: 92px;
    padding: 10px 8px;
    border-radius: 12px;
    text-align: center;
}

.live-support__gift img {
    width: 42px;
    height: 42px;
    object-fit: contain;
}

.live-support__gift strong,
.live-support__pix-btn strong {
    font-size: 13px;
}

.live-support__gift span,
.live-support__pix-btn span {
    color: #d4d4d8;
    font-size: 12px;
}

.live-support__note-field {
    display: block;
    margin: 12px 0 4px;
    color: #d4d4d8;
    font-size: 13px;
}

.live-support__note-field input {
    display: block;
    width: 100%;
    margin-top: 6px;
    padding: 10px 12px;
    border: 1px solid #3f3f46;
    border-radius: 10px;
    background: #0e0e10;
    color: #fff;
}

.live-support__frame {
    display: block;
    width: 100%;
    height: 560px;
    margin-top: 12px;
    border: 0;
    border-radius: 12px;
    background: #0e0e10;
}

.liveMobileMain .livecommentscontainer {
    max-height: 28vh;
    overflow-y: auto;
}

.liveMobileMain #live-message-mobile {
    min-height: 36px;
    max-height: 72px;
    overflow-y: auto;
}

.live-mobile-viewers {
    margin-left: 6px;
    color: #fff;
}

@media (min-width: 771px) {
    .live-support {
        align-items: center;
        padding: 24px;
    }

    .live-support__sheet {
        border-radius: 16px;
    }
}

/* QA 16/10/2026 (item 5, mobile): alvos de toque de 44 px nas abas e fechar. */
.live-support__tabs button,
.live-support__close {
    min-height: var(--ds-tap, 44px);
}

/* ==== themes/red/css/live-broadcast.css ==== */
/* Folha de transmissão pela câmera do navegador e estados da sala da dona.
   Reaproveita o fundo e o bottom sheet de .live-support (live-room.css) e os
   tokens --ds-* (styles.css / docs/design-system.md). */

.live-sheet__preview {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9;
    background: #000;
    border-radius: var(--ds-radius, 12px);
    overflow: hidden;
    margin: 12px 0;
}
.live-sheet__preview video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.live-sheet__preview.is-mirrored video {
    transform: scaleX(-1);
}
.live-sheet__preview-empty {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ds-text-muted, #9aa0a6);
    font-size: 14px;
    text-align: center;
    padding: 16px;
}

.live-sheet__controls {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
}
.live-sheet__control {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    min-width: 44px;
    padding: 0 14px;
    border: 1px solid var(--ds-border, #2a2d31);
    border-radius: var(--ds-radius-sm, 8px);
    background: var(--ds-surface-2, #1c1f23);
    color: var(--ds-text, #e8eaed);
    cursor: pointer;
}
.live-sheet__control .icon {
    width: 20px;
    height: 20px;
}
.live-sheet__control.is-off {
    color: var(--ds-text-muted, #9aa0a6);
}

.live-sheet__meter {
    height: 6px;
    border-radius: 3px;
    background: var(--ds-surface-3, #2a2d31);
    overflow: hidden;
    margin: 8px 0;
}
.live-sheet__meter-fill {
    height: 100%;
    width: 0;
    background: var(--ds-success, #2ecc71);
    transition: width 90ms linear;
}

.live-sheet__obs {
    display: inline-block;
    margin-top: 10px;
    background: none;
    border: 0;
    padding: 6px 0;
    color: var(--ds-text-muted, #9aa0a6);
    text-decoration: underline;
    cursor: pointer;
    font-size: 13px;
}

/* Estado da transmissão sobre o palco da sala */
.live-status {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 5;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    color: #fff;
    background: rgba(0, 0, 0, 0.55);
}
.live-status::before {
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: currentColor;
}
.live-status--live { color: var(--ds-error, #ff4d4f); }
.live-status--reconnecting { color: var(--ds-warning, #ffb020); }
.live-status--offline { color: var(--ds-text-muted, #9aa0a6); }

.live-unmute {
    position: absolute;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    z-index: 6;
    min-height: 44px;
    padding: 0 20px;
    border: 0;
    border-radius: 999px;
    background: var(--ds-primary, #ef7d00);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}

.live-end {
    min-height: 44px;
}

@media (max-width: 599px) {
    .live-sheet__preview {
        aspect-ratio: auto;
        height: min(56vh, 420px);
    }
    .live-sheet__controls {
        justify-content: space-between;
    }
}

/* ==== themes/red/css/feedback.css ==== */
/*
 * feedback.css — diálogo e toast padronizados (QA 16/10/2026, itens 4 e 5).
 *
 * Erro: diálogo centralizado no desktop, bottom sheet no mobile, com ícone,
 * título, motivo e ação opcional. Sucesso/informação: toast com ícone.
 * Estado vazio e esqueleto: classes compartilhadas por todas as listas.
 * Tokens em docs/design-system.md (:root em styles.css).
 */

/* ── Diálogo ─────────────────────────────────────────────────────────── */
.ds-dialog {
    position: fixed; inset: 0; z-index: 1200;
    display: flex; align-items: center; justify-content: center;
    padding: 16px;
    background: rgba(0, 0, 0, .72);
    -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
    animation: ds-fade-in 160ms ease-out;
}
.ds-dialog[hidden] { display: none; }
.ds-dialog__card {
    width: 100%; max-width: 420px;
    background: var(--ds-surface, #111113);
    color: var(--ds-text, #f4f4f5);
    border: 1px solid var(--ds-border, #2a2a2e);
    border-radius: var(--ds-radius, 12px);
    box-shadow: 0 24px 64px rgba(0, 0, 0, .55);
    padding: 24px 20px 20px;
    text-align: center;
    animation: ds-pop 180ms ease-out;
}
.ds-dialog__icon {
    width: 56px; height: 56px; margin: 0 auto 14px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 26px; font-weight: 700; line-height: 1;
}
.ds-dialog--error .ds-dialog__icon { background: var(--ds-error-bg, #3a0f12); color: var(--ds-error, #ff5a5f); border: 2px solid var(--ds-error, #ff5a5f); }
.ds-dialog--success .ds-dialog__icon { background: var(--ds-success-bg, #0a3d20); color: var(--ds-success, #21b062); border: 2px solid var(--ds-success, #21b062); }
.ds-dialog--info .ds-dialog__icon { background: rgba(255, 255, 255, .08); color: var(--ds-primary-hover, #ffb020); border: 2px solid var(--ds-primary, #ef7d00); }
.ds-dialog__title { font-size: 18px; font-weight: 700; margin: 0 0 6px; line-height: 1.3; }
.ds-dialog__text { font-size: 14px; line-height: 1.55; color: var(--ds-text-muted, #a0a0a1); margin: 0; white-space: pre-line; }
.ds-dialog__actions { display: flex; flex-direction: column; gap: 8px; margin-top: 20px; }
.ds-dialog__actions .btn { width: 100%; min-height: 44px; font-size: 14px; font-weight: 700; }
.ds-dialog__actions .btn-apply { background: var(--ds-primary, #ef7d00); }
.ds-dialog__actions .btn-apply:hover { background: var(--ds-primary-hover, #ffb020); }
.ds-dialog__actions .btn-light { color: rgba(255, 255, 255, .75); }

@media (max-width: 600px) {
    .ds-dialog { align-items: flex-end; padding: 0; }
    .ds-dialog__card {
        max-width: none;
        border-radius: 20px 20px 0 0;
        border-bottom: 0;
        padding: 24px 20px calc(20px + env(safe-area-inset-bottom));
        animation: ds-slide-up 200ms ease-out;
    }
}

/* ── Toast ───────────────────────────────────────────────────────────── */
.toast-notification__wrapper.toast-notification__wrapper--success { border-left: 4px solid var(--ds-success, #21b062); }
.toast-notification__wrapper.toast-notification__wrapper--info { border-left: 4px solid var(--ds-primary, #ef7d00); }
.toast-notification__wrapper.toast-notification__wrapper--error { border-left: 4px solid var(--ds-error, #ff5a5f); }
.toast-notification__icon-wrapper--kind { display: flex; align-items: center; min-width: 32px; width: 32px; font-size: 20px; }
.toast-notification__icon-wrapper--kind.is-success { color: var(--ds-success, #21b062); }
.toast-notification__icon-wrapper--kind.is-info { color: var(--ds-primary-hover, #ffb020); }
.toast-notification__icon-wrapper--kind.is-error { color: var(--ds-error, #ff5a5f); }

/* ── Estado vazio ────────────────────────────────────────────────────── */
.ds-empty {
    grid-column: 1 / -1;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    text-align: center; padding: 56px 20px; gap: 8px;
    color: var(--ds-text-muted, #a0a0a1);
}
.ds-empty__icon { font-size: 36px; line-height: 1; opacity: .85; }
.ds-empty__title { font-size: 16px; font-weight: 700; color: var(--ds-text, #f4f4f5); margin: 0; }
.ds-empty__text { font-size: 14px; line-height: 1.5; margin: 0; max-width: 360px; }
.ds-empty .btn { margin-top: 8px; min-height: 40px; }

@keyframes ds-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes ds-pop { from { transform: scale(.96); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes ds-slide-up { from { transform: translateY(24px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ==== themes/default/css/vendor/sweetalert.css ==== */
body.stop-scrolling {
  height: 100%;
  overflow: hidden; }

.sweet-overlay {
  background-color: black;
  /* IE8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
  /* IE8 */
  background-color: rgba(0, 0, 0, 0.4);
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  display: none;
  z-index:9999999999;}

.sweet-alert {
  background-color: white;
  font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  width: 478px;
  padding: 17px;
  border-radius: 5px;
  text-align: center;
  position: fixed;
  left: 50%;
  top: 50%;
  margin-left: -256px;
  margin-top: -200px;
  overflow: hidden;
  display: none;
  z-index:99999999999;}
  @media all and (max-width: 540px) {
    .sweet-alert {
      width: auto;
      margin-left: 0;
      margin-right: 0;
      left: 15px;
      right: 15px; } }
  .sweet-alert h2 {
    color: #575757;
    font-size: 30px;
    text-align: center;
    font-weight: 600;
    text-transform: none;
    position: relative;
    margin: 25px 0;
    padding: 0;
    line-height: 40px;
    display: block; }
  .sweet-alert p {
    color: #797979;
    font-size: 16px;
    text-align: center;
    font-weight: 300;
    position: relative;
    text-align: inherit;
    float: none;
    margin: 0;
    padding: 0;
    line-height: normal; }
  .sweet-alert fieldset {
    border: none;
    position: relative; }
  .sweet-alert .sa-error-container {
    background-color: #f1f1f1;
    margin-left: -17px;
    margin-right: -17px;
    overflow: hidden;
    padding: 0 10px;
    max-height: 0;
    webkit-transition: padding 0.15s, max-height 0.15s;
    transition: padding 0.15s, max-height 0.15s; }
    .sweet-alert .sa-error-container.show {
      padding: 10px 0;
      max-height: 100px;
      webkit-transition: padding 0.2s, max-height 0.2s;
      transition: padding 0.25s, max-height 0.25s; }
    .sweet-alert .sa-error-container .icon {
      display: inline-block;
      width: 24px;
      height: 24px;
      border-radius: 50%;
      background-color: #ea7d7d;
      color: white;
      line-height: 24px;
      text-align: center;
      margin-right: 3px; }
    .sweet-alert .sa-error-container p {
      display: inline-block; }
  .sweet-alert .sa-input-error {
    position: absolute;
    top: 29px;
    right: 26px;
    width: 20px;
    height: 20px;
    opacity: 0;
    -webkit-transform: scale(0.5);
    transform: scale(0.5);
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: all 0.1s;
    transition: all 0.1s; }
    .sweet-alert .sa-input-error::before, .sweet-alert .sa-input-error::after {
      content: "";
      width: 20px;
      height: 6px;
      background-color: #f06e57;
      border-radius: 3px;
      position: absolute;
      top: 50%;
      margin-top: -4px;
      left: 50%;
      margin-left: -9px; }
    .sweet-alert .sa-input-error::before {
      -webkit-transform: rotate(-45deg);
      transform: rotate(-45deg); }
    .sweet-alert .sa-input-error::after {
      -webkit-transform: rotate(45deg);
      transform: rotate(45deg); }
    .sweet-alert .sa-input-error.show {
      opacity: 1;
      -webkit-transform: scale(1);
      transform: scale(1); }
  .sweet-alert input {
    width: 100%;
    box-sizing: border-box;
    border-radius: 3px;
    border: 1px solid #d7d7d7;
    height: 43px;
    margin-top: 10px;
    margin-bottom: 17px;
    font-size: 18px;
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.06);
    padding: 0 12px;
    display: none;
    -webkit-transition: all 0.3s;
    transition: all 0.3s; }
    .sweet-alert input:focus {
      outline: none;
      box-shadow: 0px 0px 3px #c4e6f5;
      border: 1px solid #b4dbed; }
      .sweet-alert input:focus::-moz-placeholder {
        transition: opacity 0.3s 0.03s ease;
        opacity: 0.5; }
      .sweet-alert input:focus:-ms-input-placeholder {
        transition: opacity 0.3s 0.03s ease;
        opacity: 0.5; }
      .sweet-alert input:focus::-webkit-input-placeholder {
        transition: opacity 0.3s 0.03s ease;
        opacity: 0.5; }
    .sweet-alert input::-moz-placeholder {
      color: #bdbdbd; }
    .sweet-alert input:-ms-input-placeholder {
      color: #bdbdbd; }
    .sweet-alert input::-webkit-input-placeholder {
      color: #bdbdbd; }
  .sweet-alert.show-input input {
    display: block; }
  .sweet-alert .sa-confirm-button-container {
    display: inline-block;
    position: relative; }
  .sweet-alert .la-ball-fall {
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -27px;
    margin-top: 4px;
    opacity: 0;
    visibility: hidden; }
  .sweet-alert button {
    background-color: #8CD4F5;
    color: white;
    border: none;
    box-shadow: none;
    font-size: 17px;
    font-weight: 500;
    -webkit-border-radius: 4px;
    border-radius: 5px;
    padding: 10px 32px;
    margin: 26px 5px 0 5px;
    cursor: pointer; }
    .sweet-alert button:focus {
      outline: none;
      box-shadow: 0 0 2px rgba(128, 179, 235, 0.5), inset 0 0 0 1px rgba(0, 0, 0, 0.05); }
    .sweet-alert button:hover {
      background-color: #7ecff4; }
    .sweet-alert button:active {
      background-color: #5dc2f1; }
    .sweet-alert button.cancel {
      background-color: #C1C1C1; }
      .sweet-alert button.cancel:hover {
        background-color: #b9b9b9; }
      .sweet-alert button.cancel:active {
        background-color: #a8a8a8; }
      .sweet-alert button.cancel:focus {
        box-shadow: rgba(197, 205, 211, 0.8) 0px 0px 2px, rgba(0, 0, 0, 0.0470588) 0px 0px 0px 1px inset !important; }
    .sweet-alert button[disabled] {
      opacity: .6;
      cursor: default; }
    .sweet-alert button.confirm[disabled] {
      color: transparent; }
      .sweet-alert button.confirm[disabled] ~ .la-ball-fall {
        opacity: 1;
        visibility: visible;
        transition-delay: 0s; }
    .sweet-alert button::-moz-focus-inner {
      border: 0; }
  .sweet-alert[data-has-cancel-button=false] button {
    box-shadow: none !important; }
  .sweet-alert[data-has-confirm-button=false][data-has-cancel-button=false] {
    padding-bottom: 40px; }
  .sweet-alert .sa-icon {
    width: 80px;
    height: 80px;
    border: 4px solid gray;
    -webkit-border-radius: 40px;
    border-radius: 40px;
    border-radius: 50%;
    margin: 20px auto;
    padding: 0;
    position: relative;
    box-sizing: content-box; }
    .sweet-alert .sa-icon.sa-error {
      border-color: #F27474; }
      .sweet-alert .sa-icon.sa-error .sa-x-mark {
        position: relative;
        display: block; }
      .sweet-alert .sa-icon.sa-error .sa-line {
        position: absolute;
        height: 5px;
        width: 47px;
        background-color: #F27474;
        display: block;
        top: 37px;
        border-radius: 2px; }
        .sweet-alert .sa-icon.sa-error .sa-line.sa-left {
          -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
          left: 17px; }
        .sweet-alert .sa-icon.sa-error .sa-line.sa-right {
          -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
          right: 16px; }
    .sweet-alert .sa-icon.sa-warning {
      border-color: #F8BB86; }
      .sweet-alert .sa-icon.sa-warning .sa-body {
        position: absolute;
        width: 5px;
        height: 47px;
        left: 50%;
        top: 10px;
        -webkit-border-radius: 2px;
        border-radius: 2px;
        margin-left: -2px;
        background-color: #F8BB86; }
      .sweet-alert .sa-icon.sa-warning .sa-dot {
        position: absolute;
        width: 7px;
        height: 7px;
        -webkit-border-radius: 50%;
        border-radius: 50%;
        margin-left: -3px;
        left: 50%;
        bottom: 10px;
        background-color: #F8BB86; }
    .sweet-alert .sa-icon.sa-info {
      border-color: #C9DAE1; }
      .sweet-alert .sa-icon.sa-info::before {
        content: "";
        position: absolute;
        width: 5px;
        height: 29px;
        left: 50%;
        bottom: 17px;
        border-radius: 2px;
        margin-left: -2px;
        background-color: #C9DAE1; }
      .sweet-alert .sa-icon.sa-info::after {
        content: "";
        position: absolute;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        margin-left: -3px;
        top: 19px;
        background-color: #C9DAE1; }
    .sweet-alert .sa-icon.sa-success {
      border-color: #A5DC86; }
      .sweet-alert .sa-icon.sa-success::before, .sweet-alert .sa-icon.sa-success::after {
        content: '';
        -webkit-border-radius: 40px;
        border-radius: 40px;
        border-radius: 50%;
        position: absolute;
        width: 60px;
        height: 120px;
        background: white;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg); }
      .sweet-alert .sa-icon.sa-success::before {
        -webkit-border-radius: 120px 0 0 120px;
        border-radius: 120px 0 0 120px;
        top: -7px;
        left: -33px;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: 60px 60px;
        transform-origin: 60px 60px; }
      .sweet-alert .sa-icon.sa-success::after {
        -webkit-border-radius: 0 120px 120px 0;
        border-radius: 0 120px 120px 0;
        top: -11px;
        left: 30px;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform-origin: 0px 60px;
        transform-origin: 0px 60px; }
      .sweet-alert .sa-icon.sa-success .sa-placeholder {
        width: 80px;
        height: 80px;
        border: 4px solid rgba(165, 220, 134, 0.2);
        -webkit-border-radius: 40px;
        border-radius: 40px;
        border-radius: 50%;
        box-sizing: content-box;
        position: absolute;
        left: -4px;
        top: -4px;
        z-index: 2; }
      .sweet-alert .sa-icon.sa-success .sa-fix {
        width: 5px;
        height: 90px;
        background-color: white;
        position: absolute;
        left: 28px;
        top: 8px;
        z-index: 1;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg); }
      .sweet-alert .sa-icon.sa-success .sa-line {
        height: 5px;
        background-color: #A5DC86;
        display: block;
        border-radius: 2px;
        position: absolute;
        z-index: 2; }
        .sweet-alert .sa-icon.sa-success .sa-line.sa-tip {
          width: 25px;
          left: 14px;
          top: 46px;
          -webkit-transform: rotate(45deg);
          transform: rotate(45deg); }
        .sweet-alert .sa-icon.sa-success .sa-line.sa-long {
          width: 47px;
          right: 8px;
          top: 38px;
          -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg); }
    .sweet-alert .sa-icon.sa-custom {
      background-size: contain;
      border-radius: 0;
      border: none;
      background-position: center center;
      background-repeat: no-repeat; }

/*
 * Animations
 */
@-webkit-keyframes showSweetAlert {
  0% {
    transform: scale(0.7);
    -webkit-transform: scale(0.7); }
  45% {
    transform: scale(1.05);
    -webkit-transform: scale(1.05); }
  80% {
    transform: scale(0.95);
    -webkit-transform: scale(0.95); }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1); } }

@keyframes showSweetAlert {
  0% {
    transform: scale(0.7);
    -webkit-transform: scale(0.7); }
  45% {
    transform: scale(1.05);
    -webkit-transform: scale(1.05); }
  80% {
    transform: scale(0.95);
    -webkit-transform: scale(0.95); }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1); } }

@-webkit-keyframes hideSweetAlert {
  0% {
    transform: scale(1);
    -webkit-transform: scale(1); }
  100% {
    transform: scale(0.5);
    -webkit-transform: scale(0.5); } }

@keyframes hideSweetAlert {
  0% {
    transform: scale(1);
    -webkit-transform: scale(1); }
  100% {
    transform: scale(0.5);
    -webkit-transform: scale(0.5); } }

@-webkit-keyframes slideFromTop {
  0% {
    top: 0%; }
  100% {
    top: 50%; } }

@keyframes slideFromTop {
  0% {
    top: 0%; }
  100% {
    top: 50%; } }

@-webkit-keyframes slideToTop {
  0% {
    top: 50%; }
  100% {
    top: 0%; } }

@keyframes slideToTop {
  0% {
    top: 50%; }
  100% {
    top: 0%; } }

@-webkit-keyframes slideFromBottom {
  0% {
    top: 70%; }
  100% {
    top: 50%; } }

@keyframes slideFromBottom {
  0% {
    top: 70%; }
  100% {
    top: 50%; } }

@-webkit-keyframes slideToBottom {
  0% {
    top: 50%; }
  100% {
    top: 70%; } }

@keyframes slideToBottom {
  0% {
    top: 50%; }
  100% {
    top: 70%; } }

.showSweetAlert[data-animation=pop] {
  -webkit-animation: showSweetAlert 0.3s;
  animation: showSweetAlert 0.3s; }

.showSweetAlert[data-animation=none] {
  -webkit-animation: none;
  animation: none; }

.showSweetAlert[data-animation=slide-from-top] {
  -webkit-animation: slideFromTop 0.3s;
  animation: slideFromTop 0.3s; }

.showSweetAlert[data-animation=slide-from-bottom] {
  -webkit-animation: slideFromBottom 0.3s;
  animation: slideFromBottom 0.3s; }

.hideSweetAlert[data-animation=pop] {
  -webkit-animation: hideSweetAlert 0.2s;
  animation: hideSweetAlert 0.2s; }

.hideSweetAlert[data-animation=none] {
  -webkit-animation: none;
  animation: none; }

.hideSweetAlert[data-animation=slide-from-top] {
  -webkit-animation: slideToTop 0.4s;
  animation: slideToTop 0.4s; }

.hideSweetAlert[data-animation=slide-from-bottom] {
  -webkit-animation: slideToBottom 0.3s;
  animation: slideToBottom 0.3s; }

@-webkit-keyframes animateSuccessTip {
  0% {
    width: 0;
    left: 1px;
    top: 19px; }
  54% {
    width: 0;
    left: 1px;
    top: 19px; }
  70% {
    width: 50px;
    left: -8px;
    top: 37px; }
  84% {
    width: 17px;
    left: 21px;
    top: 48px; }
  100% {
    width: 25px;
    left: 14px;
    top: 45px; } }

@keyframes animateSuccessTip {
  0% {
    width: 0;
    left: 1px;
    top: 19px; }
  54% {
    width: 0;
    left: 1px;
    top: 19px; }
  70% {
    width: 50px;
    left: -8px;
    top: 37px; }
  84% {
    width: 17px;
    left: 21px;
    top: 48px; }
  100% {
    width: 25px;
    left: 14px;
    top: 45px; } }

@-webkit-keyframes animateSuccessLong {
  0% {
    width: 0;
    right: 46px;
    top: 54px; }
  65% {
    width: 0;
    right: 46px;
    top: 54px; }
  84% {
    width: 55px;
    right: 0px;
    top: 35px; }
  100% {
    width: 47px;
    right: 8px;
    top: 38px; } }

@keyframes animateSuccessLong {
  0% {
    width: 0;
    right: 46px;
    top: 54px; }
  65% {
    width: 0;
    right: 46px;
    top: 54px; }
  84% {
    width: 55px;
    right: 0px;
    top: 35px; }
  100% {
    width: 47px;
    right: 8px;
    top: 38px; } }

@-webkit-keyframes rotatePlaceholder {
  0% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); }
  5% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); }
  12% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg); }
  100% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg); } }

@keyframes rotatePlaceholder {
  0% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); }
  5% {
    transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg); }
  12% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg); }
  100% {
    transform: rotate(-405deg);
    -webkit-transform: rotate(-405deg); } }

.animateSuccessTip {
  -webkit-animation: animateSuccessTip 0.75s;
  animation: animateSuccessTip 0.75s; }

.animateSuccessLong {
  -webkit-animation: animateSuccessLong 0.75s;
  animation: animateSuccessLong 0.75s; }

.sa-icon.sa-success.animate::after {
  -webkit-animation: rotatePlaceholder 4.25s ease-in;
  animation: rotatePlaceholder 4.25s ease-in; }

@-webkit-keyframes animateErrorIcon {
  0% {
    transform: rotateX(100deg);
    -webkit-transform: rotateX(100deg);
    opacity: 0; }
  100% {
    transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    opacity: 1; } }

@keyframes animateErrorIcon {
  0% {
    transform: rotateX(100deg);
    -webkit-transform: rotateX(100deg);
    opacity: 0; }
  100% {
    transform: rotateX(0deg);
    -webkit-transform: rotateX(0deg);
    opacity: 1; } }

.animateErrorIcon {
  -webkit-animation: animateErrorIcon 0.5s;
  animation: animateErrorIcon 0.5s; }

@-webkit-keyframes animateXMark {
  0% {
    transform: scale(0.4);
    -webkit-transform: scale(0.4);
    margin-top: 26px;
    opacity: 0; }
  50% {
    transform: scale(0.4);
    -webkit-transform: scale(0.4);
    margin-top: 26px;
    opacity: 0; }
  80% {
    transform: scale(1.15);
    -webkit-transform: scale(1.15);
    margin-top: -6px; }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1);
    margin-top: 0;
    opacity: 1; } }

@keyframes animateXMark {
  0% {
    transform: scale(0.4);
    -webkit-transform: scale(0.4);
    margin-top: 26px;
    opacity: 0; }
  50% {
    transform: scale(0.4);
    -webkit-transform: scale(0.4);
    margin-top: 26px;
    opacity: 0; }
  80% {
    transform: scale(1.15);
    -webkit-transform: scale(1.15);
    margin-top: -6px; }
  100% {
    transform: scale(1);
    -webkit-transform: scale(1);
    margin-top: 0;
    opacity: 1; } }

.animateXMark {
  -webkit-animation: animateXMark 0.5s;
  animation: animateXMark 0.5s; }

@-webkit-keyframes pulseWarning {
  0% {
    border-color: #F8D486; }
  100% {
    border-color: #F8BB86; } }

@keyframes pulseWarning {
  0% {
    border-color: #F8D486; }
  100% {
    border-color: #F8BB86; } }

.pulseWarning {
  -webkit-animation: pulseWarning 0.75s infinite alternate;
  animation: pulseWarning 0.75s infinite alternate; }

@-webkit-keyframes pulseWarningIns {
  0% {
    background-color: #F8D486; }
  100% {
    background-color: #F8BB86; } }

@keyframes pulseWarningIns {
  0% {
    background-color: #F8D486; }
  100% {
    background-color: #F8BB86; } }

.pulseWarningIns {
  -webkit-animation: pulseWarningIns 0.75s infinite alternate;
  animation: pulseWarningIns 0.75s infinite alternate; }

@-webkit-keyframes rotate-loading {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

@keyframes rotate-loading {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }

/* Internet Explorer 9 has some special quirks that are fixed here */
/* The icons are not animated. */
/* This file is automatically merged into sweet-alert.min.js through Gulp */
/* Error icon */
.sweet-alert .sa-icon.sa-error .sa-line.sa-left {
  -ms-transform: rotate(45deg) \9; }

.sweet-alert .sa-icon.sa-error .sa-line.sa-right {
  -ms-transform: rotate(-45deg) \9; }

/* Success icon */
.sweet-alert .sa-icon.sa-success {
  border-color: transparent\9; }

.sweet-alert .sa-icon.sa-success .sa-line.sa-tip {
  -ms-transform: rotate(45deg) \9; }

.sweet-alert .sa-icon.sa-success .sa-line.sa-long {
  -ms-transform: rotate(-45deg) \9; }

/*!
 * Load Awesome v1.1.0 (http://github.danielcardoso.net/load-awesome/)
 * Copyright 2015 Daniel Cardoso <@DanielCardoso>
 * Licensed under MIT
 */
.la-ball-fall,
.la-ball-fall > div {
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

.la-ball-fall {
  display: block;
  font-size: 0;
  color: #fff; }

.la-ball-fall.la-dark {
  color: #333; }

.la-ball-fall > div {
  display: inline-block;
  float: none;
  background-color: currentColor;
  border: 0 solid currentColor; }

.la-ball-fall {
  width: 54px;
  height: 18px; }

.la-ball-fall > div {
  width: 10px;
  height: 10px;
  margin: 4px;
  border-radius: 100%;
  opacity: 0;
  -webkit-animation: ball-fall 1s ease-in-out infinite;
  -moz-animation: ball-fall 1s ease-in-out infinite;
  -o-animation: ball-fall 1s ease-in-out infinite;
  animation: ball-fall 1s ease-in-out infinite; }

.la-ball-fall > div:nth-child(1) {
  -webkit-animation-delay: -200ms;
  -moz-animation-delay: -200ms;
  -o-animation-delay: -200ms;
  animation-delay: -200ms; }

.la-ball-fall > div:nth-child(2) {
  -webkit-animation-delay: -100ms;
  -moz-animation-delay: -100ms;
  -o-animation-delay: -100ms;
  animation-delay: -100ms; }

.la-ball-fall > div:nth-child(3) {
  -webkit-animation-delay: 0ms;
  -moz-animation-delay: 0ms;
  -o-animation-delay: 0ms;
  animation-delay: 0ms; }

.la-ball-fall.la-sm {
  width: 26px;
  height: 8px; }

.la-ball-fall.la-sm > div {
  width: 4px;
  height: 4px;
  margin: 2px; }

.la-ball-fall.la-2x {
  width: 108px;
  height: 36px; }

.la-ball-fall.la-2x > div {
  width: 20px;
  height: 20px;
  margin: 8px; }

.la-ball-fall.la-3x {
  width: 162px;
  height: 54px; }

.la-ball-fall.la-3x > div {
  width: 30px;
  height: 30px;
  margin: 12px; }

/*
 * Animation
 */
@-webkit-keyframes ball-fall {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-145%);
    transform: translateY(-145%); }
  10% {
    opacity: .5; }
  20% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); }
  80% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0); }
  90% {
    opacity: .5; }
  100% {
    opacity: 0;
    -webkit-transform: translateY(145%);
    transform: translateY(145%); } }

@-moz-keyframes ball-fall {
  0% {
    opacity: 0;
    -moz-transform: translateY(-145%);
    transform: translateY(-145%); }
  10% {
    opacity: .5; }
  20% {
    opacity: 1;
    -moz-transform: translateY(0);
    transform: translateY(0); }
  80% {
    opacity: 1;
    -moz-transform: translateY(0);
    transform: translateY(0); }
  90% {
    opacity: .5; }
  100% {
    opacity: 0;
    -moz-transform: translateY(145%);
    transform: translateY(145%); } }

@-o-keyframes ball-fall {
  0% {
    opacity: 0;
    -o-transform: translateY(-145%);
    transform: translateY(-145%); }
  10% {
    opacity: .5; }
  20% {
    opacity: 1;
    -o-transform: translateY(0);
    transform: translateY(0); }
  80% {
    opacity: 1;
    -o-transform: translateY(0);
    transform: translateY(0); }
  90% {
    opacity: .5; }
  100% {
    opacity: 0;
    -o-transform: translateY(145%);
    transform: translateY(145%); } }

@keyframes ball-fall {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-145%);
    -moz-transform: translateY(-145%);
    -o-transform: translateY(-145%);
    transform: translateY(-145%); }
  10% {
    opacity: .5; }
  20% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  80% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0); }
  90% {
    opacity: .5; }
  100% {
    opacity: 0;
    -webkit-transform: translateY(145%);
    -moz-transform: translateY(145%);
    -o-transform: translateY(145%);
    transform: translateY(145%); } }

/* ==== themes/default/css/crossplatform.css ==== */
.jump {
  animation: jump 1.5s infinite ease;
}
@keyframes jump {
  0% {
    top: 0;
  }
  50% {
    top: -40px;
  }
  100% {
    top: 0;
  }
}
.coin {
  margin: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  height: 150px;
  width: 150px;
}

.font-inter{
  font-family: 'Inter'!important;
}

.coin .front, .coin .back {
  position: absolute;
  height: 150px;
  width: 150px;
  background: #ffbd0b;
  border-radius: 50%;
  border-top: 7px solid #ffd84c;
  border-left: 7px solid #ffd84c;
  border-right: 7px solid #d57e08;
  border-bottom: 7px solid #d57e08;
  transform: rotate(44deg);
}
.coin .front:before, .coin .back:before {
  content: "";
  margin: 35.5px 35.5px;
  position: absolute;
  width: 70px;
  height: 70px;
  left: 0px;
  background: #f0a608;
  border-radius: 50%;
  border-bottom: 5px solid #ffd84c;
  border-right: 5px solid #ffd84c;
  border-left: 5px solid #d57e08;
  border-top: 5px solid #d57e08;
  z-index: 2;
}
.coin .front .creditsAmount, .coin .back .creditsAmount {
  overflow: hidden;
  position: absolute;
  color: #fff;
  font-size: 35px;
  transform: rotate(-44deg);
  line-height: 4.1;
  width: 100%;
  height: 100%;
  left: 0px;
  font-family: "Inter", sans-serif !important;
  font-weight: 900;
  text-align: center;
  text-shadow: 0 3px 0 #cb7407;
  z-index: 3;
  border-radius: 50%;
}
.coin .front .creditsAmount:after, .coin .back .creditsAmount:after {
  content: "";
  position: absolute;
  height: 200px;
  width: 40px;
  margin: 20px -65px;
  box-shadow: 50px -23px 0 -10px rgba(255, 255, 255, 0.22), 85px -10px 0 -16px rgba(255, 255, 255, 0.19);
  transform: rotate(-50deg);
  animation: shine 1.5s infinite ease;
}
@keyframes shine {
  0% {
    margin: 20px -65px;
  }
  50% {
    margin: 70px -85px;
  }
  100% {
    margin: 20px -65px;
  }
}
.coin .front .shapes, .coin .back .shapes {
  transform: rotate(-44deg);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.coin .front .shapes div, .coin .back .shapes div {
  width: 20px;
  height: 4px;
  background: #d57e08;
  border-top: 2px solid #c47207;
  margin: 75px 7px;
}
.coin .front .shapes div:before, .coin .back .shapes div:before {
  content: "";
  position: absolute;
  width: 20px;
  height: 4px;
  background: #d57e08;
  border-top: 2px solid #c47207;
  margin: -10px 0;
}
.coin .front .shapes div:after, .coin .back .shapes div:after {
  content: "";
  position: absolute;
  width: 20px;
  height: 4px;
  background: #d57e08;
  border-top: 2px solid #c47207;
  margin: 8px 0;
}
.coin .front .shape_l, .coin .back .shape_l {
  float: left;
}
.coin .front .shape_r, .coin .back .shape_r {
  float: right;
}
.coin .front .top, .coin .back .top {
  font-size: 35px;
  color: #d67f08;
  text-align: center;
  width: 100%;
  position: absolute;
  font-family: "Inter", sans-serif !important;
  font-weight: 900;
  left: 0;
  top: -5px;
}
.coin .front .bottom, .coin .back .bottom {
  font-size: 16px;
  color: #d67f08;
  text-align: center;
  width: 100%;
  position: absolute;
  font-family: "Inter", sans-serif !important;
  font-weight: 900;  
  left: 0;
  bottom: 5px;
}

.coin .shadow {
  width: 100%;
  height: 20px;
  background: rgba(0, 0, 0, 0.4);
  left: 0;
  bottom: -50px;
  border-radius: 50%;
  z-index: -1;
  margin: 185px 7px 0 7px;
  animation: swift 1.5s infinite ease;
}
@keyframes swift {
  0% {
    opacity: 0.8;
  }
  50% {
    opacity: 0.4;
    transform: scale(0.8);
  }
  100% {
    opacity: 0.8;
  }
}


.header{
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) !important;
}

.roller {
  position: absolute;
  top: 5px;
  left: 5px;
  margin: 5px;
  width: 80px;
  height: 80px;
  border-width: 2px;
  border-style: dotted;
  border-radius: 50%;
  animation: roll 3s linear infinite, border-color 2s linear infinite;
}

.roller-complete {
  border-width: 2px;
  border-style: solid;
  border-radius: 50%;

}
.storyLoaded {
    stroke: #f8f8f8;
}

.over-roller {
  top: 0px;
  left: 0px;
  margin: 0px auto;
  width: 100px;
  height: 100px;
  position: absolute;
}

.circular {
  animation: rotate 2s linear infinite;
  height: 100%;
  stroke: #7f17a9;
  transform-origin: center center;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}

.stopCircular {
  height: 100%;
  transform-origin: center center;
  width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.storyOn{
  stroke: #7f17a9 !important;
}

.storyOff{
  stroke: #fff !important;
  stroke-width:1px !important;
}


.storyOffOnline{
  stroke: #00b85e !important;
}

.stopRoller {
  position: absolute;
  top: 5px;
  left: 5px;
  margin: 5px;
  width: 80px;
  height: 80px;
  border-width: 0px;
  border-style: solid;
  border-radius: 50%;
}

.path {
  stroke-dasharray: 1, 200;
  stroke-dashoffset: 0;
  animation: dash 2s ease-in-out infinite, color 2s linear infinite;
  stroke-linecap: round;
}


@keyframes rotate {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0;
  }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px;
  }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px;
  }
}
@keyframes roll {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes color {
  100%,
  0% {
    stroke: #4f5bd5;
  }
  40% {
    stroke: #962fbf;
  }
  66% {
    stroke: #4f5bd5;
  }
  80%,
  90% {
    stroke: #962fbf;
  }
}
@keyframes border-color {
}



#storytime .storytime {
    position: relative;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: 0;
    transition: opacity 0s;
    -moz-transition: opacity 0s;
    -webkit-transition: opacity 0s;
}

#storytime .story-cover {
    z-index: 1000;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    min-width: 100%;
    min-height: 100%;
    background-color: #000000;
    opacity: .85;
}

@keyframes fadeInOpacity {
  0% {
    opacity: .70;
  }  
  100% {
    opacity: .85;
  }
}

#storytime .story-nav-left {
    height: 7vh;
    display: inline-block;
    overflow: hidden;
    position: relative;
    color: #ffffff;
    font-family: 'Helvetica', sans-serif;
    vertical-align: middle;
    font-size: 85%;
    width: 50%;
    margin: 0;
    padding: 0;
    text-align: left;
}

#storytime .story-nav-right {
    height: 7vh;
    display: inline-block;
    overflow: hidden;
    position: relative;
    text-align: right;
    width: 50%;
    vertical-align: middle;
    margin: 0;
    padding: 0;
}

#storytime span.story-text {
    font-weight: bold;
    display: inline-table;
    padding-left: 10px;
    font-family: 'Inter';
    font-weight: 700;
    font-size: 15px;
    position: absolute;
    top: 7px;
    left: 59px;
    padding-left: 10px;    
}

#storytime span.story-date {
  position: absolute;
  top: 25px;
  left: 59px;
  opacity: 0.6;
  font-size: 90%;
  padding-left: 10px;
}

#storytime .story-timeline {
    height: 3vh;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-flex-direction: row;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between;
    align-items: center;
}

#storytime .story-timeline-item {
    -webkit-box-flex: 1;
    -webkit-flex-grow: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    height: 5px!important;
    position: relative;
    margin-right: 5px;
}

#storytime .story-timeline-item:last-child {
    margin-right: 0px;
}

#storytime .story-timeline-line {
    background: rgba(255,255,255,.35);
    border-radius: 4px;
    height: 5px!important;
    position: absolute;
    top: 0;
    width: 100%;
}

#storytime .story-timeline-line-active {
    -webkit-transition: width .25s linear;
    transition: width .25s linear;
    width: auto;
    will-change: width;
    border-radius: 4px;
    height: 5px!important;
    position: absolute;
    top: 0;
    background: #ffffff;
}

#storytime .story-icon {
    position: relative;
    height: 50px;
    width: 50px;
    display: inline-block;
    background-size:   cover;
    background-repeat: no-repeat;
    background-position: top center;    
    border-radius: 50%;
    vertical-align:middle;
    margin-left: 5px;
}

#storytime .story-window {
    z-index: 1010;
    position: fixed;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    max-height: 90%;
    display: block;
    min-width: 47.81vh;
    max-width: 1280px;
}



#storytime .story-blur {
    position: absolute;
    top: 48%;
    left: 10%;
    height: 40px;
    width: 80%;
    object-fit: contain;
    background-color: #fff;
    text-align: center;
    border-radius: 10px;
    cursor: pointer;
}

#storytime .story-blur span{
  font-size: 14px;
  font-weight: bold;
  color: #fff;
  line-height: 40px;
  padding: 10px;
  font-family: 'Inter';
}
#storytime .story-nav{
  position: relative !important;
  background:000;
  z-index: 9999;
  width: 100%;
  height: 6vh;
}

#storytime .story-video .leftSection{
    position: absolute;
    top:0;
    left: 0;
    width: 30%;
    height: 80vh;
    background: none;
    z-index: 9;
}

#storytime .story-video .rightSection{
    position: absolute;
    top:0;
    right: 0;
    width: 70%;
    height: 80vh;
    background: none;
    z-index: 9;
}

#storytime .story-video {
    position: relative;  
    display: block;
    height: 85vh;
    width: 47.81vh;
    object-fit: cover;
    background-color: #000000;

}

#storytime .story-video video {

    object-fit: cover;
    display: inline-block;

    top: 0;
    height: 100%;  
    width: 100%;
    max-width: 47.81vh;   
    overflow: hidden;
}


#storytime .story-video img {
    height: 100%;  
    width: 100%;
    object-fit: cover;
    display: inline-block;
    vertical-align: middle;
    position: relative;
}

#storytime .close {
    position: absolute;
    right: 0;
    top:7px;
  width: 28px;
  height: 28px;
  opacity: 0.55;
  margin-top: auto;
  margin-bottom: auto;
  display: block;
}

#storytime .close:hover {
  opacity: 1;
}

#storytime .paused {
    position: absolute;
    right: 0px;
    top: 12px;
  width: 60px;
  height: 24px;
  background: #515151;
  border-radius: 3px;
  opacity: 0.65;
  text-align: center;
  display: none;
}
#storytime .paused span {
  font-family: 'Inter';
  font-size: 11px;
  font-weight: 500;
  color: #fff;
  line-height: 24px;
}

#storytime .paused:hover {
  opacity: 1;
}


#storytime .storyCredit {
    position: absolute;
    right: 72px;
    top: 12px;
  width: auto;
  height: 24px;
  background: #515151;
  border-radius: 3px;
  opacity: 0.65;
  text-align: right;
  cursor: pointer;

}
#storytime .storyCredit span {
  font-family: 'Inter';
  font-size: 14px;
  margin-left: 36px;
  margin-right: 8px;
  font-weight: 700;
  color: #fff;
  line-height: 24px;
}
#storytime .storyCredit i {
  font-size: 20px;
  font-weight: 500;
  color: #fff;
  line-height: 24px;
}

#storytime .storyCredit:hover {
  opacity: 1;
}


#storytime .storySettings {
    position: absolute;
    right: 40px;
    top: 9px;
  width: 35px;
  height: 35px;
  background: none;
  border-radius: 3px;
  opacity: 0.65;
  text-align: center;
  cursor: pointer;
  display: none
}

#storytime .storySettings svg{
  width: 25px;
  height: 25px;
  margin-top: 2px;
}

#storytime .storySettings i {
  font-size: 24px;
  font-weight: bold;
  color: #fff;
  line-height: 24px;
}

#storytime .storySettings:hover {
  opacity: 1;
}


#storytime .close:hover {
  opacity: 1;
}


#storytime .close:before, #storytime .close:after {
  position: absolute;
  top: 2px;
  left: 15px;
  content: ' ';
  height: 30px;
  width: 2px;
  background-color: #ffffff;
}

#storytime .close:before {
  transform: rotate(45deg);
}

#storytime .close:after {
  transform: rotate(-45deg);
}

#storytime .story-arrow {
    border: solid #ffffff;
    border-width: 0 2px 2px 0;
    display: block;
    padding: 8px;
    opacity: 0.2;
}

#storytime .story-arrow:hover {
    opacity: 0.9;
}


#storytime .right {
    position: absolute;
    right: -10%;
    top: 50%;
  transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
}

#storytime .left {
    position: absolute;
    left: -10%;
    top: 50%;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
}

#storytime .spinner {
  width: 70px;
  text-align: center;
  margin:auto;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -30px;
}

#storytime .spinner > div {
  width: 14px;
  height: 14px;
  margin-left: 4px;
  background-color: #999999;
  border-radius: 100%;
  display: inline-block;
  -webkit-animation: st-sk-bouncedelay 1.7s infinite ease-in-out both;
  animation: st-sk-bouncedelay 1.7s infinite ease-in-out both;
}

#storytime .spinner .bounce1 {
  -webkit-animation-delay: -0.32s;
  animation-delay: -0.32s;
}

#storytime .spinner .bounce2 {
  -webkit-animation-delay: -0.16s;
  animation-delay: -0.16s;
}

@-webkit-keyframes st-sk-bouncedelay {
  0%, 80%, 100% { -webkit-transform: scale(0) }
  40% { -webkit-transform: scale(1.0) }
}

@keyframes st-sk-bouncedelay {
  0%, 80%, 100% { 
    -webkit-transform: scale(0);
    transform: scale(0);
  } 40% { 
    -webkit-transform: scale(1.0);
    transform: scale(1.0);
  }
}

.meetStory {
  position:absolute;
  left:0px;
  top: -10px;
  width:200px;
  height:200px;
  overflow:hidden;
}

.story {
  position:absolute;
  left:0px;
  top: 5px;
  width:100px;
  height:100px;
  overflow:hidden;
}
.story .profile-photo {
    position: absolute;
    top: 15px;
    left: 15px;
    width: 70px;
    height: 70px;
    border-radius: 50px;
    background-size:   cover;
    background-repeat: no-repeat;
    background-position: top center;
    z-index: 9;
}

.yesStory svg {
  fill:none;
  stroke:#8a3ab8;
  stroke-width:3px;
  stroke-dasharray:5;
  stroke-dashoffset:5;
  stroke-linecap:round;
  animation:storyAnim 2500ms ease-in-out infinite alternate;
}
.noStory svg {
  fill:none;
  stroke:#000000;
  stroke-width:2px;
  stroke-dasharray:0;
  stroke-dashoffset:0;
  stroke-linecap:round;
}
.noStoryOnline svg {
  fill:none;
  stroke:#41c906;
  stroke-width:3px;
  stroke-dasharray:0;
  stroke-dashoffset:0;
  stroke-linecap:round;
}
@keyframes storyAnim {    
  100% {
    stroke:#cd476b;
    stroke-dasharray:6;
    transform:rotate(150deg);
  }
}


.gradient1{
    background-color: #FFFFFF !important;
    background-image: linear-gradient(180deg, #FFFFFF 0%, #6284FF 50%, #FF0000 100%) !important;
}

.gradient2{
background-color: #52ACFF !important;
background-image: linear-gradient(180deg, #52ACFF 25%, #FFE32C 100%) !important;
}

.gradient3{
background-color: #FFE53B !important;
background-image: linear-gradient(147deg, #FFE53B 0%, #FF2525 74%) !important;
}
.gradient4{
background-color: #FAACA8 !important;
background-image: linear-gradient(19deg, #FAACA8 0%, #DDD6F3 100%) !important;

}

.gradient5{
background-color: #21D4FD !important;
background-image: linear-gradient(19deg, #21D4FD 0%, #B721FF 100%) !important;

}

.gradient6{
background-color: #08AEEA !important;
background-image: linear-gradient(0deg, #08AEEA 0%, #2AF598 100%) !important;

}

.gradient7{
background-color: #FEE140 !important;
background-image: linear-gradient(90deg, #FEE140 0%, #FA709A 100%) !important;

}

.gradient8{
background-color: #8EC5FC !important;
background-image: linear-gradient(62deg, #8EC5FC 0%, #E0C3FC 100%) !important;

}

.gradient9{
background-color: #FBAB7E !important;
background-image: linear-gradient(62deg, #FBAB7E 0%, #F7CE68 100%) !important;

}

.gradient10{
background-color: #FF3CAC !important;
background-image: linear-gradient(225deg, #FF3CAC 0%, #784BA0 50%, #2B86C5 100%) !important;

}

.gradient11{
background-color: #D9AFD9 !important;
background-image: linear-gradient(0deg, #D9AFD9 0%, #97D9E1 100%) !important;

}

.gradient12{
background-color: #00DBDE !important;
background-image: linear-gradient(90deg, #00DBDE 0%, #FC00FF 100%) !important;

}

.gradient13{
background-color: #F4D03F !important;
background-image: linear-gradient(132deg, #F4D03F 0%, #16A085 100%) !important;

}

.gradient14{
background-color: #0093E9 !important;
background-image: linear-gradient(160deg, #0093E9 0%, #80D0C7 100%) !important;

}

.gradient15{
background-color: #FAD961 !important;
background-image: linear-gradient(90deg, #FAD961 0%, #F76B1C 100%) !important;

}

.gradient16{
background-color: #FA8BFF !important;
background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%) !important;

}

.gradient17{
background-color: #FBDA61 !important;
background-image: linear-gradient(45deg, #FBDA61 0%, #FF5ACD 100%) !important;

}

.gradient18{
background-color: #4158D0 !important;
background-image: linear-gradient(43deg, #4158D0 0%, #C850C0 46%, #FFCC70 100%) !important;

}

.gradient19{
background-color: #3EECAC !important;
background-image: linear-gradient(19deg, #3EECAC 0%, #EE74E1 100%) !important;

}

.gradient20{
background-color: #FF9A8B !important;
background-image: linear-gradient(90deg, #FF9A8B 0%, #FF6A88 55%, #FF99AC 100%) !important;
}


.gradient21{
  background: #bdc3c7 !important;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #2c3e50, #bdc3c7) !important;  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #2c3e50, #bdc3c7) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.gradient22{
background: #ee9ca7 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #ffdde1, #ee9ca7) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #ffdde1, #ee9ca7) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.gradient23{
background: #2193b0 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #6dd5ed, #2193b0) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #6dd5ed, #2193b0) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient24{
background: #C6FFDD !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #f7797d, #FBD786, #C6FFDD) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #f7797d, #FBD786, #C6FFDD) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient25{
background: #0F2027 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #2C5364, #203A43, #0F2027) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #2C5364, #203A43, #0F2027) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient26{
background: #12c2e9 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #f64f59, #c471ed, #12c2e9) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #f64f59, #c471ed, #12c2e9) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient27{
  background: #b92b27 !important;
  background: -webkit-linear-gradient(to left, #1565C0, #b92b27) !important;
  background: linear-gradient(to left, #1565C0, #b92b27) !important;
}

.gradient28{
background: #373B44 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #4286f4, #373B44) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #4286f4, #373B44) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient29{
background: #2980B9 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #FFFFFF, #6DD5FA, #2980B9) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #FFFFFF, #6DD5FA, #2980B9) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient30{
background: #FF0099 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #493240, #FF0099) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #493240, #FF0099) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient31{
background: #aa4b6b !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #3b8d99, #6b6b83, #aa4b6b) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #3b8d99, #6b6b83, #aa4b6b) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient32{
background: #8E2DE2 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #4A00E0, #8E2DE2) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #4A00E0, #8E2DE2) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient33{
background: #1f4037 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #99f2c8, #1f4037) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #99f2c8, #1f4037) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient34{
background: #f953c6 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #b91d73, #f953c6) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #b91d73, #f953c6) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient35{
background: #7F7FD5 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #91EAE4, #86A8E7, #7F7FD5) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #91EAE4, #86A8E7, #7F7FD5) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient36{
background: #c31432 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #240b36, #c31432) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #240b36, #c31432) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient37{
background: #f12711 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #f5af19, #f12711) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #f5af19, #f12711) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient38{
background: #659999 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #f4791f, #659999) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #f4791f, #659999) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient39{
background: #dd3e54 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #6be585, #dd3e54) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #6be585, #dd3e54) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient40{
background: #8360c3 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #2ebf91, #8360c3) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #2ebf91, #8360c3) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient41{
background: #544a7d !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #ffd452, #544a7d) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #ffd452, #544a7d) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient42{
background: #009FFF !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #ec2F4B, #009FFF) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #ec2F4B, #009FFF) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient43{
background: #654ea3 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #eaafc8, #654ea3) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #eaafc8, #654ea3) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient44{
background: #FF416C !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #FF4B2B, #FF416C) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #FF4B2B, #FF416C) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient45{
background: #8A2387 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #F27121, #E94057, #8A2387) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #F27121, #E94057, #8A2387) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient45{
background: #a8ff78 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #78ffd6, #a8ff78) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #78ffd6, #a8ff78) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient46{
background: #1E9600 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #FF0000, #FFF200, #1E9600) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #FF0000, #FFF200, #1E9600) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient47{
background: #ED213A !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #93291E, #ED213A) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #93291E, #ED213A) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}

.gradient48{
background: #FDC830 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #F37335, #FDC830) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #F37335, #FDC830) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient49{
background: #00B4DB !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #0083B0, #00B4DB) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #0083B0, #00B4DB) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient50{
background: #FFEFBA !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #FFFFFF, #FFEFBA) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #FFFFFF, #FFEFBA) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient51{
background: #59C173 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #5D26C1, #a17fe0, #59C173) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #5D26C1, #a17fe0, #59C173) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient52{
background: #DA4453 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #89216B, #DA4453) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #89216B, #DA4453) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient53{
background: #ad5389 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #3c1053, #ad5389) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #3c1053, #ad5389) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient54{
background: #a8c0ff !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #3f2b96, #a8c0ff) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #3f2b96, #a8c0ff) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient55{
background: #333333 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #dd1818, #333333) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #dd1818, #333333) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient56{
background: #4e54c8 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #8f94fb, #4e54c8) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #8f94fb, #4e54c8) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient57{
background: #bc4e9c !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #f80759, #bc4e9c) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #f80759, #bc4e9c) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient58{
background: #40E0D0 !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #FF0080, #FF8C00, #40E0D0) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #FF0080, #FF8C00, #40E0D0) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient59{
background: #11998e !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #38ef7d, #11998e) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #38ef7d, #11998e) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}
.gradient60{
background: #c94b4b !important;  /* fallback for old browsers */
background: -webkit-linear-gradient(to left, #4b134f, #c94b4b) !important;  /* Chrome 10-25, Safari 5.1-6 */
background: linear-gradient(to left, #4b134f, #c94b4b) !important; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */

}




.plus {
  width: 30px;
  cursor: pointer;
  transition: all .3s ease 0s;
  height: 30px;
  background: #ffe581;
  border-radius: 50%;
  display: flex;
  position: relative;
}
.plus__line {
  width: 2px;
  height: 18px;
  background: #000;
  border-radius: 10px;
  position: absolute;
  left: calc(50% - 1px);
  top: calc(50% - 9px);
}
.plus__line--h {
  transform: rotate(90deg);
}
.plus__line--v {
  display: flex;
  align-items: center;
  justify-content: space-around;
  overflow: hidden;
  transition: all .4s ease 0s;
}
.plus__link {
  color: #fff;
  font-size: 20px;
  opacity: 0;
  visibility: hidden;
  transition: .3s ease 0s;
  transform: scale(0.5);
}
.plus--active {
  height: 22px;
  border-radius: 30px;
}
.plus--active .plus__line--v {
  height: 38px;
  top: calc(-90% - 0px);
  padding: 0 5px;
  box-sizing: border-box;
  width: 170px;
  border-radius: 60px;
  left: calc(50% - 85px);
}
.plus--active .plus__link {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
  transition-delay: .05s;
}

.centered {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
}




#chat-input {
  position: fixed;
  bottom: -20px;
  height: 40px;
  width: 90%;
  left: 5%;
  background: rgba(255,255,255,.55);
  border-radius: 6px;
  overflow: hidden;
  -webkit-box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.35);
  box-shadow: 0 10px 10px 0 rgba(0, 0, 0, 0.35);   
  z-index: 1001;
}
#chat-input:hover{
  background: rgba(255,255,255,1);
  color: #333;
}
#chat-input input:focus{
  background: rgba(255,255,255,1);
  color: #111;
}
#chat-input input {
  position: relative;
  width: 100%;
  height: 100%;
  background:none;
  border: none;
  outline: none;
  border-radius: 6px;
  overflow: hidden;
  padding-left: 10px;
  padding-right: 45px;
  font-family: 'Inter';
  font-size: 14px;
  font-weight: 500;
  color: #fff;
}

#chat-input-send {
  position: fixed;
  bottom: -25px;
  height: 40px;
  width: 40px;
  right: 10px;
  background: none;
  overflow: hidden;
  z-index: 1002;
}
#chat-input-send i{
  font-size: 26px;
  color: #333;
  cursor: pointer; 
}


toast-bar .toast-bar {
    position: fixed;
    padding: 12px 0;
    left: 0;
    bottom: 0;
    width: 100%;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    z-index: 1003;
}

toast-bar .toast-bar.isVisible {
    -webkit-animation-name: slideIn;
    animation-name: slideIn;
    -webkit-animation-duration: .6s;
    animation-duration: .6s;
    -webkit-animation-timing-function: var(--easeOutExpo);
    animation-timing-function: var(--easeOutExpo);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards;
    opacity: 1
}

@-webkit-keyframes slideIn {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

@keyframes slideIn {
    0% {
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
    to {
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
}

toast-bar .toast-bar.isHidden {
    -webkit-animation-name: slideOut;
    animation-name: slideOut;
    -webkit-animation-duration: .4s;
    animation-duration: .4s;
    -webkit-animation-timing-function: var(--easeOutExpo);
    animation-timing-function: var(--easeOutExpo);
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@-webkit-keyframes slideOut {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    99% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

@keyframes slideOut {
    0% {
        opacity: 1;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    99% {
        opacity: 1
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(100%);
        transform: translateY(100%)
    }
}

toast-bar .toast-bar.preload {
    opacity: 0
}

toast-bar .toast-bar--inner {
    background-color: #333;
    height: 80px;
    border-radius: 15px;
    padding: 0 20px 0 30px;
    color: #fff;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-shadow: 0 16px 32px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 16px 32px 0 rgba(0, 0, 0, .1), 0 8px 16px 0 rgba(0, 0, 0, .08)
}

toast-bar .toast-bar--inner h4 {
    color: #fff;
    margin: 0;
    white-space: nowrap;
    margin-right: 30px
}

toast-bar .toast-bar__details {
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: end;
    justify-content: flex-end
}

toast-bar .toast-bar__section-header,
toast-bar .toast-bar__section-header>div {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-align: center;
    align-items: center
}

toast-bar .toast-bar__section-header {
    height: 10px;
    margin-bottom: 7px
}

toast-bar .toast-bar__section-header h6 {
    display: inline-block
}

toast-bar .toast-bar__section-header a {
    -webkit-transition: border .3s;
    transition: border .3s;
    color: var(--color-melrose);
    font-size: 9px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    text-decoration: none;
    border-bottom: 1px solid transparent
}

toast-bar .toast-bar__section-header a:hover {
    border-bottom-color: var(--color-melrose-dark)
}

toast-bar .toast-bar__section-header i {
    margin-left: 3px
}

toast-bar .toast-bar__section:not(:first-child) {
    margin-left: 20px
}

toast-bar .toast-bar__section:first-child {
    position: relative;
    max-width: none
}

toast-bar .toast-bar__details code {
    position: relative;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    font-size: 14px;
    line-height: 14px;
    height: 32px;
    padding: 0 12px;
    cursor: text;
    overflow: hidden
}

@supports (display:grid) {
    toast-bar .toast-bar__section:not(: first-child) {
        -ms-flex: 0;
        flex: 0
    }
    toast-bar .toast-bar__section:first-child {
        -ms-flex: 1;
        flex: 1
    }
    toast-bar .toast-bar__details code {
        overflow-x: auto
    }
}

toast-bar .toast-bar__details code>span {
    position: absolute;
    white-space: nowrap
}

toast-bar .toast-bar__section .confirmation {
    font-size: 11px;
    font-family: Eina;
    font-weight: 600;
    color: #aec6ff;
    display: -ms-flexbox;
    display: flex;
    opacity: 0;
    -webkit-transform: translateY(5px);
    transform: translateY(5px);
    margin-left: 12px
}

toast-bar .toast-bar__section .confirmation .ion {
    color: #aec6ff;
    font-size: 14px;
    margin-right: 4px
}

toast-bar .toast-bar__section.copied .confirmation {
    -webkit-animation-name: slideInOut;
    animation-name: slideInOut;
    -webkit-animation-duration: 1.5s;
    animation-duration: 1.5s;
    -webkit-animation-fill-mode: forwards;
    animation-fill-mode: forwards
}

@-webkit-keyframes slideInOut {
    0% {
        opacity: 0;
        -webkit-transform: translateY(5px);
        transform: translateY(5px)
    }
    10% {
        opacity: .9;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    90% {
        opacity: .9;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px)
    }
}

@keyframes slideInOut {
    0% {
        opacity: 0;
        -webkit-transform: translateY(5px);
        transform: translateY(5px)
    }
    10% {
        opacity: .9;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    90% {
        opacity: .9;
        -webkit-transform: translateY(0);
        transform: translateY(0)
    }
    to {
        opacity: 0;
        -webkit-transform: translateY(-5px);
        transform: translateY(-5px)
    }
}

toast-bar .toast-bar__details code:hover .hover-highlight {
    background-color: #5882b2
}

@media screen and (max-width:768px) {
    toast-bar .toast-bar__section:not(: first-child) {
        display: none
    }
}

@media screen and (max-width:540px) {
    toast-bar .toast-bar--inner {
        padding: 16px;
        -ms-flex-direction: column;
        flex-direction: column;
        -ms-flex-align: start;
        align-items: flex-start;
        height: auto
    }
    toast-bar .toast-bar--inner h4 {
        margin: 0 0 16px
    }
    toast-bar .toast-bar__section {
        max-width: 100%!important
    }
    toast-bar .toast-bar__details {
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: 100%
    }
}


.blurred{
  -webkit-filter: blur(25px);
  -moz-filter: blur(10px);
  -o-filter: blur(10px);
  -ms-filter: blur(10px);
  filter: blur(15px);  
}

.uploadingGray{
  -webkit-filter: grayscale(100%) !important; /* Safari 6.0 - 9.0 */
  filter: grayscale(100%) !important;    
}

:root{
  --background-dark: #2d3548;
  --text-light: rgba(255,255,255,0.6);
  --text-lighter: rgba(255,255,255,0.9);
  --spacing-s: 8px;
  --spacing-m: 16px;
  --spacing-l: 24px;
  --spacing-xl: 32px;
  --spacing-xxl: 64px;
  --width-container: 1200px;
}


.profile-stories-section{
  align-items: flex-start;
  display: flex;
  height: auto;
  justify-content: center;
}

.stories-grid{
  display: grid;
  grid-template-columns: repeat(1, 1fr);
  grid-column-gap: var(--spacing-l);
  grid-row-gap: var(--spacing-l);
  max-width: var(--width-container);
  width: 100%;
}

@media(min-width: 540px){
  .stories-grid{
    grid-template-columns: repeat(2, 1fr); 
  }
}

@media(min-width: 960px){
  .stories-grid{
    grid-template-columns: repeat(4, 1fr); 
  }
}

.profile-story-album{
  list-style: none;
  position: relative;
}

.profile-story-album:before{
  content: '';
  display: block;
  padding-bottom: 150%;
  width: 100%;
}

.profile-story-album__background{
  background-size: cover;
  background-position: center;
  border-radius: var(--spacing-l);
  bottom: 0;
  filter: brightness(0.75) saturate(1.2) contrast(0.85);
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
  transform-origin: center;
  trsnsform: scale(1) translateZ(0);
  transition: 
    filter 200ms linear,
    transform 200ms linear;
}

.profile-story-album:hover .profile-story-album__background{
  transform: scale(1.05) translateZ(0);
  filter: brightness(1) saturate(1) contrast(1);
}

.profile-story-album-grid:hover > .profile-story-album:not(:hover) .profile-story-album__background{

}

.profile-story-album__content{
  left: 0;
  padding: var(--spacing-l);
  position: absolute;
  top: 0;
}

.profile-story-album__category{
  position: absolute !important;  
  font-family: 'Inter', sans-serif;
  bottom: 0px;
  color: #fff;
  font-size: 1rem;
  text-align: center;
  text-transform: uppercase;
  width: 100%;
  left: 0px;
  font-weight: bold;
}

.profile-story-album__heading{
  color: var(--text-lighter);
  font-size: 1.9rem;
  text-shadow: 2px 2px 20px rgba(0,0,0,0.2);
  line-height: 1.4;
}


.stories-wrap {
  width: 100%;
  margin: auto;


}
.stories-wrap:focus, .stories-wrap:active {
  outline: 0;
}

.flickity-viewport {
  height: 210px;
  overflow: hidden;

}

.story-album {
  width: 100%;
  max-width: 120px;
  min-width: 120px;
  border-radius: 0.6rem;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(0, 0, 0, 0.04);
  position: relative;
  min-height: 170px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  margin: 1rem;
  transition: all 350ms ease;
}
.story-album__overlay {
  border-radius: 0.6rem;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0.12);
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.2));
  z-index: 3;
}
.story-album__info {
  position: absolute;
  padding: 1.5rem 1.5rem;
  width: 100%;
  text-align: center;
  color: white;
  position: absolute;
  bottom: 0;
  text-shadow: 0px 3px 5px rgba(0, 0, 0, 0.4);
  z-index: 7;
  left: 0;
  bottom: 8px;
  height: 100%;
}
.uploadStoryAlbum{
    z-index: 6 !important;
}
.story-album__title {
  position: absolute;
  bottom:10px;
  left: 10px;
  width: 90px;
  font-size: 1.2rem;
  font-weight: 800;
  text-overflow: ellipsis;
  overflow: hidden; 
  white-space: nowrap;  
  margin-bottom: .5rem;
  color: #fff;
  text-align: center;
  z-index: 9;

}

.story-album__edit {
  border-radius: 3px;
  width: 80px;
  height: 20px;
  background: #fff;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
  position: absolute;
  top: 8px;
  right: 8px;
  transition: all 0.3s ease;
  z-index: 4;
  cursor: pointer;
}

.story-album__edit span{
  font-family: 'Inter', sans-serif;
  font-weight: bold;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  padding: 2px;
  padding-left: 5px;
  color: #333;
}

.story-album__count {
  border-radius: 3px;
  width: 74px;
  height: 20px;
  background: #fff;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
  position: absolute;
  top: 8px;
  left: 8px;
  transition: all 0.3s ease;
  z-index: 4;
  cursor: pointer;
}

.story-album__count span{
  font-family: 'Inter', sans-serif;
  font-weight: bold;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  padding: 2px;
  padding-left: 5px;
  color: #333;
}

.story-album:hover, .story-album:focus {
  -webkit-transform: scale(1.1);
          transform: scale(1.1);
  transition: all 450ms ease;
}
.story-album:hover .story-album__overlay, .story-album:focus .story-album__overlay {
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0), rgba(255, 255, 255, 0.1));
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12), 0 4px 10px rgba(0, 0, 0, 0.06);
  transition: all 350ms ease;
}
.story-album:hover {
  cursor: -webkit-grab;
}
.story-album:focus, a.story-album:active {
  cursor: -webkit-grabbing;
}

.overlayScroller {
  position: absolute;
  top: 70px;
  pointer-events: none;
  bottom: 0;
  right: 0;
  left: 0;
  background: transparent;
  
  z-index: 100;
}


.container-grid-interest {
  background: #eee;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  width: 80px;
  height: 80px;
  position: relative;
  display: inline-block;
  overflow: hidden;
  border-radius: 5px;
  margin-left: 5px;
  margin-top: 0px;
  border-radius: 50%;  
  cursor: pointer;
}

.interestName {
  border-radius: 3px;
  width: 60px;
  height: 20px;
  background: none;
  position: absolute;
  bottom: 30px;
  left: 10px;
  transition: all 0.3s ease;
  z-index: 4;
  opacity: 0;
  text-align: center;
}
.interestAdd{
  opacity: 1;
  bottom: 40px;
}
.container-grid-interest:hover .interestName{
  opacity: 1;
}

.interestName span{
  font-family: 'Inter', sans-serif;
  font-weight: bold;
  text-align: center !important;
  font-size: 12px;
  line-height: 20px;
  color: #fafafa;
  padding: 2px;
}
.interestChecked {
  border-radius: 3px;
  width: 60px;
  height: 20px;
  background: none;
  position: absolute;
  bottom: 30px;
  left: 10px;
  transition: all 0.3s ease;
  z-index: 4;
  opacity: 1;
  text-align: center;
  font-size: 24px;
  display: none;
}

.container-grid-stories {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  width: 121px;
  height: 180px;
  position: relative;
  display: inline-block;
  overflow: hidden;
  border-radius: 5px;
  margin-left: 5px;
  margin-top: 0px;
}
.circle-grid-stories {
  border-radius: 50%;
  opacity: 0;
  width: 40px;
  height: 40px;
  background: rgba(115, 200, 13, 0.4);
  box-shadow: 2px 2px 2px #ddd;
  position: absolute;
  bottom: 25px;
  right: 25px;
  cursor: pointer;
  transition: all 0.5s ease;
}
.circle-grid-stories.expand {
  opacity: 1;
  border-radius: 50%;
  width: 800px;
  height: 800px;
  right: -350px;
  bottom: -350px;
  box-shadow: 0px 0px 0px #ddd;
  background: rgba(255, 255, 255, 0.6);
}
.circleclose {
  border-radius: 50%;
  width: 40px;
  height: 40px;
  background: #fff;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
  position: absolute;
  bottom: 8px;
  right: 8px;
  padding-top: 5px;

  cursor: pointer;
  transition: all 0.3s ease;
  z-index: 4;
}

.selectStoryDate {
  border-radius: 3px;
  width: 60px;
  height: 20px;
  background: #fff;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
  position: absolute;
  top: 8px;
  left: 8px;
  transition: all 0.3s ease;
  z-index: 4;
}

.selectStoryDate span{
  font-family: 'Inter', sans-serif;
  font-weight: bold;
  text-align: center;
  font-size: 12px;
  line-height: 20px;
  padding: 2px;
  padding-left: 6px;
}





.selectStoryType {
  border-radius: 3px;
  width: 30px;
  height: 20px;
  background: none;
  box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.1);
  position: absolute;
  top: 8px;
  right: 8px;
  transition: all 0.3s ease;
  z-index: 4;
}

.selectStoryType svg{
  margin-left: 5px;
}

.circleclose svg{
  margin-left: 5px;
}
.circleclose.gobottom {
  transform: scale(0);
  opacity: 0;
}


.fullscreen-bg {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden;

}

.fullscreen-bg__video {
   width: 141px;
   height: 220px; /* Given a 16:9 aspect ratio, 9/16*100 = 56.25 */
   min-height: 220px;
   min-width: 141px; /* Given a 16:9 aspect ratio, 16/9*100 = 177.77 */
   position: absolute;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
}

.box-shadow{
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.12);    
}
.text-shadow-banner{
    text-shadow: 2px 2px 15px rgba(0, 0, 0, 0.15);    
}
.text-shadow{
    text-shadow: 2px 2px 15px rgba(0, 0, 0, 0.15);    
}

.box-shadow-left-profile{
    -webkit-box-shadow: 0 10px 25px 0  rgba(0, 0, 0, 0.22);
    box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.22);    
}

.box-shadow-credits{
    -webkit-box-shadow: 0 10px 25px 0  rgba(0, 0, 0, 0.12);
    box-shadow: 0 10px 25px 0 rgba(0, 0, 0, 0.12);    
}
.as-container{

}
.as-button{
    cursor: pointer;
    -webkit-box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.12);   
}

@media (max-width:600px) {
  #storytime .story-window {
    max-height: 100%;
    height: 100%;
    width: 100%;
  }
  #storytime .story-nav {
    position: absolute;
    top: 25px;
    padding-top: 10px;    
    z-index: 999;
    width: 100%;
    height: 9vh;
    background: none;
    padding-left:15px;
    padding-right:15px;     
  }
  #storytime .story-nav-left {
    height: 8vh;
  } 
  #storytime .story-nav-right {
    height: 8vh;
  }    
  #storytime .story-video {
      position: absolute;
      top: 0px;
      display: block;
      height: 100%;
      width: 100%;
      background-color: #000000;
      max-width: 100% !important;
      min-width: 100% !important;            
  } 
  #storytime .story-timeline {
      position: absolute;
      top: 0px;
      padding-top: 5px;    
      z-index: 998;
      width: 100%;
      background: none;
      padding-left:15px;
      padding-right:15px;    
  }
  #storytime .story-video video {
      max-width: 100% !important;
      min-width: 100% !important;
      object-fit: cover;
  }
  #storytime .story-video img {
      max-width: 100% !important;
      min-width: 100% !important;
  } 
  #storytime .close {
      right: 10px;
  }  
  #chat-input-send{
    bottom: 5px;
  } 
  #chat-input{
    bottom: 10px;
  }     
}

@media (max-width:475px) {
  #storytime .close {
      right: 15px;
  } 
  #storytime .story-timeline {

      margin-left:5px;    
  }   
}

@media (max-width:425px) {
   #storytime .story-nav {
    height: 9.5vh; 
    margin-left:10px;   
  }
  #storytime .close {
      right: 25px!important;
  } 
   
}

@media (max-width:375px) {
  #storytime .close {
      right: 5px;
  } 
  #storytime .story-timeline {
      width: 92%;
      padding-right:0px;
      padding-left:20px;    
  } 
  .as-button {
  }   
}

@media (max-width:340px) {
   #storytime .story-nav {
    height: 10vh;    
  }
  #storytime .close {
      right: 10px;
  }      
}

.story-container {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 104px;
    width: 84px;
    overflow: hidden;
    margin-left: 8px;
    margin-right: 8px;
    display: inline-block;
}

.story-container:first-child {
    margin-left: 0
}

.story-container:last-child {
    margin-right: 0
}

.story-preview {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    border-radius: 10px;
    height: 104px;
    width: 84px;
    overflow: hidden;
    position: relative;
    cursor: pointer
}

.slider-content .story-preview {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 84px;
    flex: 0 0 84px
}
.stories-feed{
  display: flex;
  flex-wrap: wrap;  
}

@media screen and (max-width:425px) {
  .story-container {
      height: 10.5rem;
      width: 7.7rem;
      margin-bottom: 8px;
  }  
  .story-preview {
      height: 10.5rem;
      width: 7.7rem;
  }

  .slider-content .story-preview {
      -ms-flex: 0 0 7.7rem;
      flex: 0 0 7.7rem
  }
}

@media screen and (max-width:375px) {
  .story-container {
      height: 9rem;
      width: 6.7rem;
      margin-bottom: 8px;
  }  
  .story-preview {
      height: 9rem;
      width: 6.7rem;
  }

  .slider-content .story-preview {
      -ms-flex: 0 0 6.7rem;
      flex: 0 0 6.7rem
  }
}

@media screen and (max-width:320px) {
  .story-container {
      height: 12rem;
      width: 9rem;
      margin-bottom: 8px;
  }  
  .story-preview {
      height: 12rem;
      width: 9rem;
  }

  .slider-content .story-preview {
      -ms-flex: 0 0 9rem;
      flex: 0 0 9rem
  }
}




.story-preview:hover .story-preview-background {
    -webkit-filter: brightness(110%);
    filter: brightness(110%);
    border-radius: 10px;
}

.story-preview .story-preview-background,
.story-preview .story-preview-mask,.story-preview .story-preview-mask-me {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

.story-preview .story-preview-mask {
    background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, .7)));
    background-image: -o-linear-gradient(top, transparent, rgba(0, 0, 0, .7));
    background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, .7))
}
.story-preview .story-preview-mask-me {
    background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, .7)));
    background-image: -o-linear-gradient(top, transparent, rgba(0, 0, 0, .7));
    background-image: linear-gradient(180deg, transparent, rgba(0, 0, 0, .7))
}


.story-preview .story-preview-avatar {
    bottom: 26px;
    left: 8px;
    position: absolute
}

.story-preview .story-preview-name {
    bottom: 6px;
    color: #fff;
    font-size: 12px;
    left: 8px;
    margin: 0;
    position: absolute;
    width: 70px;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis
}

.story-preview-placeholder {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    height: 104px;
    width: 84px;
    margin-left: 8px;
    margin-right: 8px;
    background-color: #ece9e9;
    border-radius: 10px
}



.story-preview-placeholder:last-child {
    margin-right: 0
}
.user-avatar {
    border-radius: 50% 50% 50% 50%;
    height: 28px;
    width: 28px
}

.wallet-container {
  display: flex;
  justify-content: center;
}

.wallet-iphone {
  background-color: #FFF;
  margin: 0px;
  height: 400px;
  width: 100%;
  overflow: hidden;
  position: relative;
  transform: scale(1);
  transform-origin: top center;
}

.wallet-header {
  height: 40%;
  width: 90%;
  margin-left: 5%;
  background-color: #FFF;
  border-bottom-right-radius: 40px;
    border-bottom-left-radius: 40px;
  display: flex;
  justify-content: space-around;
  align-items: center;
  position: relative;
  z-index: 1;
   overflow: hidden;
}

.wallet-header-summary {
  display: flex;
  flex-direction: column;
  font-family: 'Rubik', sans-serif;
  color: black;
  z-index: 3;
}

.wallet-summary-text {
  font-size: 1.2rem;
  font-weight: 300;
  margin-bottom: 1.5rem;
}

.wallet-summary-balance {
  font-size: 2rem;
  letter-spacing: 1.5px;
  margin-bottom: 0.8rem;
  
}

.wallet-summary-text-2 {
  font-size: 0.8rem;
  letter-spacing: 1px;
}

.wallet-user-profile {
  margin-top: 2rem;
  height: 99px;
  width: 99px;
  align-self: flex-start;
}

.wallet-user-photo {
  height: 100%;
  width: 100%;
  border-radius: 50%;
  border: 1px solid white;
  box-shadow: 5px 5px 25px 0px rgba(0,0,0,0.2);
}



.wallet-card {
  
font-family: 'Rubik', sans-serif;
  align-self: stretch;
  background-color: white;
  border-radius: 12px;
  display: flex;
  flex-direction:column;
   box-shadow: 0 14px 28px rgba(0,0,0,0.02), 0 10px 10px rgba(0,0,0,0.0);
}

.wallet-upper-row {
  display: flex;
  justify-content: space-evenly;
  padding-bottom: 25px;
  padding-top: 10px
}

.wallet-card-item {
  margin: 20px;
  display: flex;
  flex-direction: column;
}

.wallet-card-item span:first-child {
  font-size: 0.7rem;
  font-weight: bold;
  margin-bottom:10px;
}

.wallet-card-item span:last-child {
  font-size: 1.2rem;
  font-weight: 300;
}

.wallet-dollar {
  color: #FFC168;
}

.wallet-lower-row {
  display: flex;
  justify-content: space-evenly;
  margin-bottom: 20px;
}

.wallet-lower-row::before {
    content: '';
    display: block;
    position: absolute;
    top: 110px;
    width: 50%;
    left: 25%;
    border-top: 1px solid #E1E1E1;
}

.wallet-icon-item {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.wallet-icon {
  color: #FFC168;
  padding: 10px;
  background-color: #FBFBFB;
  border-radius: 5px;
  margin-bottom: 5px;
}

.wallet-icon-text {
  font-size: 0.6em;
  color: #939393;
}
.wallet-content {
  z-index: 4;

  top: 210px;
  margin-left:90px;
  width:90%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  height: 260px;
  overflow-y: auto;
}
.wallet-transactions {
  font-family: 'Rubik', sans-serif;
  position: relative;
  margin-top: 1.5rem;
  width: 25%;
  display: flex;
  flex-direction: column;
  flex: 1;
  margin-right: 10%;
}

.wallet-t-desc {
  font-size: 0.8rem;
  font-weight: bold;
  padding-bottom: 10px;
}

.wallet-transaction {
  cursor: default;
  padding: 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  background-color:white;
  box-shadow: 0 14px 28px rgba(0,0,0,0.02), 0 10px 10px rgba(0,0,0,0.0);
  border-radius: 12px;
  margin-bottom:20px;
}

.wallet-t-details {
  width: 55%;
}

.wallet-t-icon-container {
  width: 45px;
  align-self: flex-start;
}

.wallet-t-icon {
  width: 100%;
  border-radius: 50%;
  box-shadow: 5px 5px 25px 0px rgba(0,0,0,0.2);
}

.wallet-t-title {
  text-align: left;
  flex-grow: 1;
  font-size: 1.1rem;
  font-weight: bold;
}

.wallet-t-time {
  font-size: 0.8rem;
  opacity: 0.8;
  font-weight: 300;
  letter-spacing: 1px;
}

.wallet-t-amount {
  font-size: 1.2rem;
  letter-spacing: 1px;
  font-weight: 400;
  color: #06D778;
}

.wallet-red {
  color: #F4532D;
}

.wallet-drawer {
  display:flex;
  background-color: white;
  height:80px;
  position:absolute;
  bottom: 0px;
  width: 100%;
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
  z-index: 5;
  justify-content: space-evenly;
  align-items: center;
}


.wallet-drawer span {
  display: inline-block;
  font-size: 1.5rem;
  color: #FFC168;
  transition: all 0.4s;
  cursor: pointer;
}

.wallet-drawer span i:hover {
  transform: scale(1.2);
  border-bottom: 2px solid orange;
}

.wallet-drawer span i {
  transition: all 0.3s ease;
  padding-bottom: 8px;
}



.wallet-menu-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: 50px;
  background-color: #FFC168;
  color: white;
  top: -25px;
  position: absolute;
  transform: rotate(-45deg);
  border-radius: 10px;
  box-shadow: 5px 5px 25px 0px rgba(0,0,0,0.2);
  cursor: pointer;
  transition: all 0.1s;
  opacity: 0.9;
}

.wallet-menu-btn:hover {
  box-shadow: 0 14px 28px rgba(0,0,0,0.25), 0 10px 10px rgba(0,0,0,0.22);
}

.wallet-menu-btn i{
  font-size: 1.5em;
  transform: rotate(45deg);
  
}

.wallet-footer {
  margin-top: 20px;
  text-align: center;
}

.wallet-transaction:hover {
    box-shadow: 0 1px 5px -1px rgba(0, 0, 0, 0.3), inset 0 0 0 1px rgba(0, 0, 0, 0.15);
}

.img-responsive {
    max-width: 100%;
    height: auto;
}

.mn-usr-mnu {
    background: #fff;
    -webkit-box-shadow: 0 10px 25px -3px rgba(0, 0, 0, 0.7);
    box-shadow: 0 10px 25px -3px rgba(0, 0, 0, 0.7);
    cursor: default;
    font-family: "Avenir", sans-serif;
    position: absolute;
    top: 100%;
    right: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    width: 300px;
    z-index: 100;
}
.mn-usr-mnu.show {
    max-height: 1000px;
    -webkit-transition: all 0.5s ease;
    transition: all 0.5s ease;
}
.mnu-toggle:after {
    content: "";
    -webkit-transition: all 0.22s ease;
    transition: all 0.22s ease;
    height: 0;
    position: absolute;
    bottom: 0;
    background: #ffbf24;
    width: 100%;
    z-index: 101;
}
.mnu-toggle.active:after {
    height: 7px;
}
.mum-info {
    background: #ffbf24;
    color: #231f20;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 35px 10px 22px;
}
.mumi-photo {
    background: #fff2d3;
    border-radius: 50%;
    cursor: pointer;
    font-size: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 95px;
    height: 95px;
    -webkit-transition: all 0.1s linear;
    transition: all 0.1s linear;
    z-index: 1;
}
.mumi-photo:after {
    content: "\E827";
    color: #262624;
    font-family: ChatspinIcons;
    font-weight: 100;
    -webkit-transition: all 0.1s linear;
    transition: all 0.1s linear;
}
.mumi-photo:hover {
    background: #ffe29e;
}
.mumi-photo:hover:after {
    font-size: 0.75em;
    text-shadow: 0 1px 2px #0000009c;
}
.mumi-data {
    margin-left: 15px;
}
.md-name {
    font-size: 15px;
    font-weight: 800;
    line-height: 1.2;
    margin-bottom: 1px;
    word-break: break-word;
}
.md-name span {
    display: block;
    font-size: 0.8em;
}
.mum-stat {
    background: #262624;
    -webkit-box-shadow: 0 2px 8px rgba(38, 38, 36, 0.7);
    box-shadow: 0 2px 8px rgba(38, 38, 36, 0.7);
    color: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 11px;
    font-weight: 500;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding: 18px 0 8px;
    text-transform: capitalize;
}
.mums-item {
    position: relative;
    text-align: center;
    width: 25%;
}
.mums-item + .mums-item:before {
    content: "";
    background: rgba(255, 255, 255, 0.57);
    position: absolute;
    left: 0;
    height: calc(100% - 8px);
    width: 2px;
}
.mums-item.get-tokens {
    cursor: pointer;
}
.mums-item p {
    font-size: 12px;
    font-weight: 600;
    margin: 4px 0 0;
    letter-spacing: 0.3px;
}
.mums-item em {
    font-size: 28px;
    position: relative;
}
.mums-item em:before {
    position: relative;
    z-index: 1;
}
.mums-item em.gem-icon {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    height: 28px;
    width: 34px;
}
.mums-item em.ci-verified {
    color: #7ed321;
    position: relative;
}
.mums-item em.ci-verified:after {
    content: "";
    background: #fff;
    border-radius: 50%;
    position: absolute;
    top: 2.5%;
    left: 2.5%;
    height: 95%;
    width: 95%;
    z-index: 0;
}
.mums-item em.ci-heart-empty:before {
    color: #d0021b;
}
.mums-item em.ci-heart-empty:after {
    content: "\E85C";
    color: #fff;
    font-size: 0.85em;
    position: absolute;
    top: 7.5%;
    left: 7.5%;
    z-index: 0;
}
.mums-item .rlt-user-gender.m:before {
    content: "\f222";
    color: #347ef5;
}
.mums-item .rlt-user-gender.f:before {
    content: "\f221";
    color: #fd62cf;
}
.mums-item .rlt-user-gender.c:before {
    content: "\e836";
    color: #ff6c00;
}
.mums-item .rlt-sett-hearts {
    color: #222;
    font-size: 0.9em;
    font-weight: 800;
    position: absolute;
    top: 45%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 1;
}
.mi-verify {
    display: none;
}
.mi-heart {
    position: relative;
}
.mi-heart em {
    -webkit-transform: scale(1.075);
    transform: scale(1.075);
}
.mum-list {
    padding: 25px 15px 5px;
    text-align: left;
}
.mum-list span {
    color: #abaaaa;
    text-transform: capitalize;
    padding-left: 8px;
}
.mum-list li {
    color: #605d5e;
    cursor: pointer;
    font-size: 16px;
    letter-spacing: 0.01em;
    line-height: 1.5em;
    list-style-type: none;
    padding: 0.8em 0 0.8em 2.15em;
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
    position: relative;
}
.mum-list li + li {
    border-top: 1px solid #c4c4c4;
}
.mum-list li + li em {
    color: #7e7c7d;
}
.mum-list li em {
    font-size: 1.5em;
    position: absolute;
    left: 0;
    text-shadow: none;
    -webkit-transition: all 0.15s ease;
    transition: all 0.15s ease;
}
.mum-list li em.gem-icon {
    -webkit-filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.25));
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.25));
    -webkit-transform: scale(1.35);
    transform: scale(1.35);
    height: 1em;
    width: 1em;
}
.mum-list li em.ci-settings-o:before {
    font-size: 1.15em;
}
.mum-list li em.ci-logout:before {
    font-size: 0.95em;
    padding-left: 0.1em;
}
.mum-list li:hover {
    color: #000000;
    text-shadow: 0.5px 0px 0;
}
.mum-list li:hover em {
    color: #ffbf24;
    -webkit-transform: scale(1.25);
    transform: scale(1.25);
}
.mum-list li:hover em.gem-icon {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
}
body:not(.rlt-vip-member) .miv-member {
    display: block;
    font-size: 0.9em;
    padding-top: 1px;
}
body:not(.rlt-vip-member) .ci-verified {
    color: #7e7c7d;
}
body:not(.rlt-vip-member) .ci-verified:after {
    background: #262624;
}
.rlt-vip-member .miv-vip {
    display: block;
}
.rlt-vip-member .mum-list {
    padding: 10px 15px 5px;
}
.rlt-vip-member .mum-list span {
    display: none;
}
.rlt-vip-member .mum-list li.get-tokens {
    border-top: none;
}

@media only screen and (max-width: 1024px) {
    .mn-usr-mnu {
        border-bottom: 1px solid #c4c4c4;
        -webkit-box-shadow: none;
        box-shadow: none;
        position: relative;
        width: 100%;
    }
    .rlt-member #mainmenu {
        background: #fff;
        min-width: 300px;
    }
    .navbar-nav > li .nnd-list {
        display: block;
        padding: 0;
    }
    .nav.navbar-nav > li.nn-dropdown.trns {
        margin: 0 auto;
    }
    .member-nav {
        -webkit-box-ordinal-group: 0;
        -ms-flex-order: -1;
        order: -1;
    }
    .rlt-member .member-nav li > span {
        display: none;
    }
    .rlt-member .hn-user.mnu-toggle {
        width: 100%;
    }
}
@media only screen and (min-width: 1025px) {
    .mn-usr-mnu {
        max-height: 0;
    }
}
#home-section {
    background: #fbc849;
    position: relative;
    height: 100%;
    height: calc(100% - 56px);
    min-height: 550px;
}
#home-section {
    background: -webkit-gradient(linear, left top, left bottom, color-stop(65%, #fbc849), to(#e2b744));
    background: linear-gradient(to bottom, #fbc849 65%, #e2b744);
}
#home-section:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 1;
}
#home-section .container {
    position: relative;
    height: 100%;
    z-index: 2;
}
.home-content {
    font-size: 16px;
    text-align: center;
    position: absolute;
    top: 2.25em;
    left: 0;
    width: 100%;
}
.home-content h1 {
    font-size: 3em;
    font-weight: 300;
    margin: 0 0 0.25em;
    position: relative;
    z-index: 1;
}
.home-content h2 {
    font-size: 4.9em;
    font-weight: 800;
    letter-spacing: 0.085em;
    margin: 0;
    text-transform: uppercase;
}
.hc-welcome {
    margin-top: 1.575em;
}
.hc-select {
    max-width: 20em;
    margin: 0 auto;
}
.hc-gndr {
    color: #767676;
    display: inline-block;
    position: relative;
    width: 100%;
}
.hc-gndr > span {
    background: #fff;
    border-radius: 0.25em;
    -webkit-box-shadow: 0px 0.125em 0.5em rgba(69, 51, 5, 0.25);
    box-shadow: 0px 0.125em 0.5em rgba(69, 51, 5, 0.25);
    cursor: pointer;
    display: block;
    font-size: 1em;
    font-weight: 700;
    padding: 0.9375em 3.75em 0.9375em 0.9375em;
    text-align: left;
}
.hc-gndr > span:after {
    content: "\e806";
    border-left: 1px solid #c0c0c0;
    color: #000;
    font-size: 1.75em;
    font-family: ChatspinIcons;
    line-height: 1.85em;
    text-align: center;
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 1.785em;
}
.hc-gndr ul {
    background: #fff;
    border-top: 1px solid #c0c0c0;
    border-radius: 0 0 0.25em 0.25em;
    -webkit-box-shadow: 0px 0.125em 0.125em rgba(0, 0, 0, 0.5);
    box-shadow: 0px 0.125em 0.125em rgba(0, 0, 0, 0.5);
    display: none;
    margin: 0;
    padding: 0;
    text-align: left;
    position: absolute;
    left: 0;
    white-space: nowrap;
    min-width: 100%;
    z-index: 10;
}
.hc-gndr ul li {
    list-style-type: none;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
}
.hc-gndr ul li:hover {
    background: #ffe2a3;
    color: #444;
}
.hc-gndr ul li input {
    display: none;
}
.hc-gndr ul li label {
    display: block;
    cursor: pointer;
    font-size: 1em;
    font-weight: 600;
    padding: 0.5em 0.625em;
}
.hc-gndr em {
    font-size: larger;
    margin-right: 0.3em;
    font-weight: bold;
}
.hc-gndr em.ci-user-1 {
    color: #f1b62b;
}
em.ci-mars {
    color: #347ef5;
}
em.ci-venus {
    color: #fd62cf;
}
em.ci-unisex-icon {
    color: #ff6c00;
}
em.ci-transgender {
    color: #be4afc;
}
.shake {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-name: shake;
    animation-name: shake;
    color: #d91d04;
}
@-webkit-keyframes shake {
    from,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}
@keyframes shake {
    from,
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translate3d(-10px, 0, 0);
        transform: translate3d(-10px, 0, 0);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translate3d(10px, 0, 0);
        transform: translate3d(10px, 0, 0);
    }
}
#rlt-start-btn {
    background: #000;
    border-radius: 0.1em;
    color: #fff;
    cursor: pointer;
    display: block;
    margin: 0.5em auto 0;
    letter-spacing: 0.075em;
    font-size: 1.25em;
    font-weight: 600;
    padding: 1em;
    text-align: center;
    text-transform: uppercase;
    width: 100%;
}
#rlt-start-btn:hover {
    background: #333;
}
.hc-warn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    margin: 1em auto 0;
    font-size: 0.875em;
    font-weight: 500;
    max-width: 45em;
}
.hcw-cont {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    text-align: left;
}
.hcw-cont + .hcw-cont {
    margin-top: 0.625em;
}
.hcw-cont input {
    position: absolute;
    visibility: hidden;
}
.hcw-cont label {
    font-family: Avenir, sans-serif;
    padding-left: 2.25em;
    position: relative;
    z-index: 2;
}
.hcw-cont label a {
    color: #000;
    text-decoration: underline;
}
.hcw-cont .error {
    font-weight: 500;
}
.hcwc-error {
    background: #c14c4c;
    border-radius: 0.1875em;
    color: #fff;
    font-size: 0.95em;
    padding: 0.3em 0.6em;
    position: absolute;
    opacity: 0;
    top: -0.6em;
    left: 0;
}
.error .hcwc-error {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    opacity: 1;
}
.hcwc-error:after {
    content: "";
    border: 0.4em solid transparent;
    border-top: 0.4em solid #c14c4c;
    position: absolute;
    bottom: -0.8em;
    left: 0.35em;
}
.app-icons {
    position: absolute;
    bottom: 5px;
    right: 5px;
}
.app-icons li {
    display: inline-block;
    margin: 0 -2px;
    padding: 0;
}
.app-icons li a {
    background-color: transparent;
    color: #000;
    display: block;
    line-height: 1.875em;
    font-size: 26px;
    text-align: center;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
    height: 1.875em;
    width: 1.875em;
}
.app-icons li a:hover {
    background-color: rgba(0, 0, 0, 0.4);
    color: #fff;
}
.hc-download {
    margin: 4em 0;
}
.hc-download a {
    display: inline-block;
    width: 15em;
}
.hc-download img {
    height: auto;
    width: 100%;
}
.camera-hint,
.feedback_link {
    display: none;
    position: absolute;
}
.feedback_link {
    visibility: hidden;
}
.home-link {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 0 5px 0 0;
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    padding: 8px 10px;
    position: absolute;
    bottom: 0;
    left: 0;
    z-index: 2;
}
.home-link > * {
    color: #000;
    cursor: pointer;
    display: block;
    text-decoration: none;
}
.home-link > *:hover {
    color: #000;
    text-decoration: underline;
}
.home-link em {
    color: #ffb900;
    font-size: 1.25em;
    text-shadow: 1px 1px 1px #222;
    vertical-align: baseline;
    margin-right: 5px;
}
#app-loading {
    display: none;
    background: rgba(0, 0, 0, 0.65);
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 11;
}

@media only screen and (max-width: 1024px) {
    #home-section {
        height: calc(100% - 55px);
        min-height: 100px;
        text-align: center;
        opacity: 1;
        -webkit-transition: opacity 0.2s linear;
        transition: opacity 0.2s linear;
    }
    #home-section:after {
        background: url(/assets/img/bg/home-mob-bg.webp?v1.1) bottom/768px no-repeat;
    }
    .no-webp #home-section:after {
        background: url(/assets/img/bg/home-mob-bg.png?v1.1) bottom/768px no-repeat;
    }
    .home-content {
        font-size: 1.7vw;
        top: 35%;
        left: 5%;
        padding: 0;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 90%;
    }
    .home-content h2 {
        letter-spacing: 0;
    }
    .hc-select {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        font-size: 1.15em;
        max-width: 100%;
    }
    .hc-select.active #rlt-start-btn {
        display: none;
    }
    .hc-select.active .hc-gndr {
        font-size: 1.55em;
    }
    .hc-gndr {
        font-size: 1.2em;
        min-width: 16em;
        max-width: 20em;
        width: auto;
    }
    .hc-gndr > span {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .hc-gndr ul li label {
        font-size: 1.1em;
        padding: 0.6em;
    }
    #rlt-start-btn {
        border-radius: 0.25em;
        display: inline-block;
        margin: 0 0 0 1.25em;
        padding: 0.9em 1em;
        width: auto;
    }
    .hc-warn {
        font-size: 1.15em;
        margin-top: 1.5em;
        max-width: 90%;
    }
    .hcw-cont label {
        padding-left: 4.25em;
    }
    .hcw-cont label:before,
    .hcw-cont label:after {
        content: "";
        border: 1.5px solid #272727;
        cursor: pointer;
        margin-top: -0.85em;
        position: absolute;
        top: 50%;
        left: 0;
        height: 1.4em;
        -webkit-transition: all 0.3s ease;
        transition: all 0.3s ease;
    }
    .hcw-cont label:before {
        background: -webkit-gradient(linear, left top, right top, from(#efefef), to(#c3c3c3));
        background: linear-gradient(90deg, #efefef, #c3c3c3);
        border-radius: 2.5em;
        width: 2.5em;
    }
    .hcw-cont label:after {
        background-color: #949494;
        border-radius: 50%;
        -webkit-box-shadow: 0.145em 0.145em 0 0 #949494 inset, -0.235em -0.235em 0 0.145em #949494 inset, 0.26em 0.26em 0 0 #fff inset;
        box-shadow: 0.145em 0.145em 0 0 #949494 inset, -0.235em -0.235em 0 0.145em #949494 inset, 0.26em 0.26em 0 0 #fff inset;
        width: 1.4em;
    }
    .hcw-cont input:checked + label:after {
        background-color: #fabe3a;
        -webkit-box-shadow: 0.145em 0.145em 0 0 #fabe3a inset, -0.235em -0.235em 0 0.145em #fabe3a inset, 0.26em 0.26em 0 0 #fff inset;
        box-shadow: 0.145em 0.145em 0 0 #fabe3a inset, -0.235em -0.235em 0 0.145em #fabe3a inset, 0.26em 0.26em 0 0 #fff inset;
        -webkit-transform: translateX(1.1em);
        transform: translateX(1.1em);
    }
    .app-started .main_player {
        z-index: 11;
    }
    .hcwc-error {
        top: 0;
    }
    .app-icons {
        display: none;
    }

}
@media only screen and (max-width: 768px) {
    #home-section:after,
    .no-webp #home-section:after {
        background-size: contain;
    }
    .home-content {
        font-size: 1.7vw;
    }
    .home-link {
        font-size: 12px;
    }
}
@media only screen and (max-width: 768px) and (orientation: landscape) {
    #home-section:after {
        background-image: none;
    }
    .home-content {
        top: 20px;
        -webkit-transform: translate(0);
        transform: translate(0);
    }
}
@media only screen and (max-width: 479px) {
    #home-section {
        height: calc(100% - 45px);
    }
    .home-content {
        font-size: 1.8vw;
        left: 2.5%;
        top: 50px;
        -webkit-transform: translate(0);
        transform: translate(0);
        width: 95%;
    }
    .home-content h1 {
        font-weight: 400;
    }
    .hc-welcome {
        margin-top: 2.5em;
    }
    .hc-select {
        font-size: 1.35em;
    }
    .hc-gndr {
        max-width: 18em;
    }
    .hc-warn {
        font-size: 1.4em;
        max-width: 100%;
    }
    .hcw-cont {
        text-align: justify;
        padding: 0 0.5em;
    }
    .home-link {
        font-size: 11px;
        padding: 6px;
    }
    .hc-download a {
        width: 20em;
    }
}
@media only screen and (max-width: 360px) {
    #home-section {
        min-height: 400px;
    }
    .home-link {
        font-size: 10px;
    }

}
@media only screen and (max-width: 1024px) and (orientation: landscape) {
    #home-section:after {
        background-size: 400px;
    }
    .home-content {
        font-size: 12px;
        top: 45%;
    }
}
@media only screen and (max-width: 812px) and (orientation: landscape) {
    #home-section {
        height: calc(100% - 45px);
    }
    .home-content {
        font-size: 1.2vw;
        top: 20px;
    }
    .hc-welcome {
        padding: 0;
    }
}
@media only screen and (min-width: 1025px) {
    #home-section:after {
        background: url(/assets/img/bg/home-bg.webp?v1.1) bottom/120vh no-repeat;
    }
    .no-webp #home-section:after {
        background: url(/assets/img/bg/home-bg.png?v1.1) bottom/120vh no-repeat;
    }
    .hcw-cont label::after,
    .hcw-cont label:before {
        content: "";
        position: absolute;
    }
    .hcw-cont label:before {
        background-color: #e0e4e7;
        border: 1px solid #969fa6;
        cursor: pointer;
        left: 0;
        top: 0;
        height: 1.25em;
        width: 1.25em;
    }
    .hcw-cont label:after {
        background: transparent;
        border: 0.215em solid #303c47;
        border-top: none;
        border-right: none;
        opacity: 0;
        top: 5px;
        left: 0.285em;
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg);
        height: 0.285em;
        width: 0.57em;
    }
    .hcw-cont input[type="checkbox"]:checked + label:after {
        opacity: 1;
    }
    .hc-download {
        display: none;
    }

}
@media only screen and (min-width: 1301px) {

}
@media only screen and (min-width: 1550px) {
}
@media only screen and (min-width: 1800px) {

}
@font-face {
    font-family: ChatspinIcons;
    font-display: block;
    src: url("../../themes/default/css/fonts/chatspin-icons.eot?4040752");
    src: url("../../themes/default/css/fonts/chatspin-icons.eot?4040752#iefix") format("embedded-opentype"), url("../../themes/default/css/fonts/chatspin-icons.woff?4040752") format("woff"),
        url("../../themes/default/css/fonts/chatspin-icons.ttf?4040752") format("truetype"), url("../../themes/default/css/fonts/chatspin-icons.svg?4040752#chatspin-icons") format("svg");
    font-weight: 400;
    font-style: normal;
}
.ci {
    display: inline-block;
    font: normal normal normal 14px/1 ChatspinIcons;
    font-size: inherit;
    vertical-align: middle;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.ci-spin {
    -webkit-animation: ci-spin 2s infinite linear;
    animation: ci-spin 2s infinite linear;
}
@-webkit-keyframes ci-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
@keyframes ci-spin {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
.ci-bold {
    font-weight: bold;
}
.ci-sm {
    font-size: 0.8em;
    line-height: 1.25em;
    vertical-align: 10%;
}
.ci-lg {
    font-size: 1.2em;
    line-height: 0.75em;
    vertical-align: -10%;
}
.ci-xl {
    font-size: 1.45em;
    line-height: 0.75em;
    vertical-align: -10%;
}
.ci-fw {
    width: 1.28571429em;
    text-align: center;
}
.ci-pulse {
    -webkit-animation: ci-pulse 0.8s infinite steps(8);
    animation: ci-pulse 0.8s infinite steps(8);
}
@-webkit-keyframes ci-pulse {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
@keyframes ci-pulse {
    0% {
        -webkit-transform: rotate(0);
        transform: rotate(0);
    }
    100% {
        -webkit-transform: rotate(359deg);
        transform: rotate(359deg);
    }
}
.ci-mic-cs:before {
    content: "\e800";
}
.ci-switch-cs:before {
    content: "\e801";
}
.ci-country-filter:before {
    content: "\e802";
}
.ci-cup:before {
    content: "\e803";
}
.ci-gender-filter:before {
    content: "\e804";
}
.ci-down-dir:before {
    content: "\e806";
}
.ci-pause:before {
    content: "\e807";
}
.ci-search:before {
    content: "\e808";
}
.ci-right-small:before {
    content: "\e809";
}
.ci-couple:before {
    content: "\e80a";
}
.ci-intro-icon:before {
    content: "\e80b";
}
.ci-billion:before {
    content: "\e80c";
}
.ci-gift-box:before {
    content: "\e80d";
}
.ci-share:before {
    content: "\e80e";
}
.ci-user-1:before {
    content: "\e811";
}
.ci-mobile-video-chat:before {
    content: "\e812";
}
.ci-meetstrangers:before {
    content: "\e813";
}
.ci-android-ios:before {
    content: "\e814";
}
.ci-meetpeople:before {
    content: "\e815";
}
.ci-cog:before {
    content: "\e816";
}
.ci-fast:before {
    content: "\e817";
}
.ci-videochat:before {
    content: "\e818";
}
.ci-genderfilter:before {
    content: "\e819";
}
.ci-countryfilter:before {
    content: "\e81a";
}
.ci-east:before {
    content: "\e81b";
}
.ci-camtocam:before {
    content: "\e81c";
}
.ci-cancel:before {
    content: "\e81d";
}
.ci-key:before {
    content: "\e81f";
}
.ci-video:before {
    content: "\e821";
}
.ci-unlock:before {
    content: "\e824";
}
.ci-upgrade-now:before {
    content: "\e825";
}
.ci-ok:before {
    content: "\e826";
}
.ci-plus:before {
    content: "\e827";
}
.ci-globe-o:before {
    content: "\e828";
}
.ci-star-o:before {
    content: "\e829";
}
.ci-close:before {
    content: "\e82a";
}
.ci-cross-circle:before {
    content: "\e82b";
}
.ci-mask:before {
    content: "\e82c";
}
.ci-lock:before {
    content: "\e82d";
}
.ci-mail:before {
    content: "\e82e";
}
.ci-pencil:before {
    content: "\e830";
}
.ci-info-circled:before {
    content: "\e833";
}
.ci-check-cirlcle:before {
    content: "\e834";
}
.ci-minus-circle:before {
    content: "\e835";
}
.ci-unisex-icon:before {
    content: "\e836";
}
.ci-verified:before {
    content: "\e837";
}
.ci-heart-empty:before {
    content: "\e838";
}
.ci-lightbulb:before {
    content: "\e839";
}
.ci-tags:before {
    content: "\e83a";
}
.ci-dots:before {
    content: "\e83c";
}
.ci-mask-cs:before {
    content: "\e83d";
}
.ci-chat-cs:before {
    content: "\e83e";
}
.ci-everyone-cs:before {
    content: "\e83f";
}
.ci-email:before {
    content: "\e840";
}
.ci-external-link:before {
    content: "\e841";
}
.ci-flag-cs:before {
    content: "\e843";
}
.ci-volume-up-1:before {
    content: "\e844";
}
.ci-play-1:before {
    content: "\e845";
}
.ci-incognito-mask:before {
    content: "\e846";
}
.ci-any-situation:before {
    content: "\e847";
}
.ci-plus-1:before {
    content: "\e848";
}
.ci-fun-star:before {
    content: "\e849";
}
.ci-masks:before {
    content: "\e84a";
}
.ci-gif:before {
    content: "\e84b";
}
.ci-be-yourself:before {
    content: "\e84c";
}
.ci-different:before {
    content: "\e84d";
}
.ci-heart-1:before {
    content: "\e84e";
}
.ci-like-minded:before {
    content: "\e84f";
}
.ci-integrated-chat:before {
    content: "\e850";
}
.ci-local:before {
    content: "\e851";
}
.ci-gem:before {
    content: "\e852";
}
.ci-right-message:before {
    content: "\e854";
}
.ci-sign-up:before {
    content: "\e855";
}
.ci-video-calling:before {
    content: "\e856";
}
.ci-more-connect-1:before {
    content: "\e857";
}
.ci-warning:before {
    content: "\e858";
}
.ci-lock-1:before {
    content: "\e859";
}
.ci-private-start:before {
    content: "\e85a";
}
.ci-private-declined:before {
    content: "\e85b";
}
.ci-heart:before {
    content: "\e85c";
}
.ci-private-end:before {
    content: "\e85d";
}
.ci-private-chat-1:before {
    content: "\e85e";
}
.ci-free-star:before {
    content: "\e85f";
}
.ci-hide-location:before {
    content: "\e860";
}
.ci-sticker:before {
    content: "\e861";
}
.ci-emoji:before {
    content: "\e862";
}
.ci-avatar:before {
    content: "\e863";
}
.ci-rear-camera:before {
    content: "\e864";
}
.ci-crown-1:before {
    content: "\e865";
}
.ci-logout:before {
    content: "\e866";
}
.ci-round-user:before {
    content: "\e867";
}
.ci-settings-o:before {
    content: "\e868";
}
.ci-billing:before {
    content: "\e869";
}
.ci-send:before {
    content: "\e86e";
}
.ci-membership:before {
    content: "\e870";
}
.ci-bell:before {
    content: "\e871";
}
.ci-translation:before {
    content: "\e872";
}
.ci-history:before {
    content: "\e873";
}
.ci-check-o:before {
    content: "\e875";
}
.ci-location-hidden:before {
    content: "\e87d";
}
.ci-no-ad:before {
    content: "\e88a";
}
.ci-clock:before {
    content: "\e892";
}
.ci-save-badge:before {
    content: "\e893";
}
.ci-invite-friends:before {
    content: "\e8f8";
}
.ci-wall-clock:before {
    content: "\e8f9";
}
.ci-calendar:before {
    content: "\e8fa";
}
.ci-giftbox:before {
    content: "\e8fb";
}
.ci-twitter:before {
    content: "\f099";
}
.ci-facebook:before {
    content: "\f09a";
}
.ci-angle-left:before {
    content: "\f104";
}
.ci-angle-right:before {
    content: "\f105";
}
.ci-spinner:before {
    content: "\f110";
}
.ci-youtube-play:before {
    content: "\f16a";
}
.ci-instagram:before {
    content: "\f16d";
}
.ci-apple:before {
    content: "\f179";
}
.ci-android:before {
    content: "\f17b";
}
.ci-bug-1:before {
    content: "\f188";
}
.ci-at:before {
    content: "\f1fa";
}
.ci-venus:before {
    content: "\f221";
}
.ci-mars:before {
    content: "\f222";
}
.ci-transgender:before {
    content: "\f224";
}
.ci-calendar-check-o:before {
    content: "\f274";
}

.text-left {
    text-align: left;
}
.text-right {
    text-align: right;
}
.text-center {
    text-align: center;
}
.center-block {
    display: block;
    margin-right: auto;
    margin-left: auto;
}
.pull-right {
    float: right;
}
.pull-left {
    float: left;
}

#dialog .hpm-overlay {
    background: rgba(0, 0, 0, 0.85);
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 0;
}
.mfp-bg,
.mfp-wrap {
    position: fixed;
    left: 0;
    top: 0;
}
.mfp-bg,
.mfp-container,
.mfp-wrap {
    height: 100%;
    width: 100%;
}
.mfp-container:before,
.mfp-figure:after {
    content: "";
}
.mfp-bg {
    z-index: 1042;
    overflow: hidden;
    background: #0b0b0b;
    opacity: 0.8;
    filter: alpha(opacity=80);
}
.mfp-wrap {
    display: none;
    z-index: 1043;
    outline: 0;
    -webkit-backface-visibility: hidden;
}
.mfp-container {
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    padding: 0 8px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
}
.mfp-container:before {
    display: inline-block;
    height: 100%;
    vertical-align: middle;
}
.mfp-align-top .mfp-container:before {
    display: none;
}
.mfp-content {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    margin: 0 auto;
    text-align: left;
    z-index: 1045;
}
.mfp-close,
.mfp-preloader {
    text-align: center;
    position: absolute;
}
.mfp-ajax-holder .mfp-content,
.mfp-inline-holder .mfp-content {
    width: 100%;
    cursor: auto;
}
.mfp-ajax-cur {
    cursor: progress;
}
.mfp-zoom-out-cur {
    cursor: -webkit-zoom-out;
    cursor: zoom-out;
}
.mfp-zoom {
    cursor: pointer;
    cursor: -webkit-zoom-in;
    cursor: zoom-in;
}
.mfp-auto-cursor .mfp-content {
    cursor: auto;
}
.mfp-loading.mfp-figure {
    display: none;
}
.mfp-hide {
    display: none;
}
.mfp-preloader {
    color: #ccc;
    top: 50%;
    width: auto;
    margin-top: -0.8em;
    left: 8px;
    right: 8px;
    z-index: 1044;
}
.mfp-preloader a {
    color: #ccc;
}
.mfp-close,
.mfp-preloader a:hover {
    color: #fff;
}
.mfp-s-error .mfp-content,
.mfp-s-ready .mfp-preloader {
    display: none;
}
button.mfp-arrow,
button.mfp-close {
    overflow: visible;
    cursor: pointer;
    background: 0 0;
    border: 0;
    -webkit-appearance: none;
    display: block;
    outline: 0;
    padding: 0;
    z-index: 1046;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.mfp-figure:after,
.mfp-iframe-scaler iframe {
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
    position: absolute;
    left: 0;
}
button::-moz-focus-inner {
    padding: 0;
    border: 0;
}
.mfp-close {
    width: 44px;
    height: 44px;
    line-height: 44px;
    right: 0;
    top: 0;
    text-decoration: none;
    opacity: 0.65;
    filter: alpha(opacity=65);
    padding: 0 0 18px 10px;
    font-style: normal;
    font-size: 28px;
    font-family: Arial, Baskerville, monospace;
}
.mfp-close:focus,
.mfp-close:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}
.mfp-close:active {
    top: 1px;
}
.mfp-close-btn-in .mfp-close {
    color: #333;
}
.mfp-iframe-holder .mfp-close,
.mfp-image-holder .mfp-close {
    color: #fff;
    top: -25px;
    right: -6px;
    text-align: right;
    padding-right: 6px;
    width: 100%;
}
.mfp-counter {
    position: absolute;
    top: 50px;
    right: 50%;
    color: #fff;
    font-size: 12px;
    line-height: 18px;
    white-space: nowrap;
    margin-right: -20px;
}
.mfp-figure,
img.mfp-img {
    line-height: 0;
}
.mfp-arrow {
    position: absolute;
    opacity: 0.65;
    filter: alpha(opacity=65);
    margin: -55px 0 0;
    top: 50%;
    padding: 0;
    width: 90px;
    height: 110px;
    -webkit-tap-highlight-color: transparent;
}
.mfp-arrow:active {
    margin-top: -54px;
}
.mfp-arrow:focus,
.mfp-arrow:hover {
    opacity: 1;
    filter: alpha(opacity=100);
}
.mfp-arrow .mfp-a,
.mfp-arrow .mfp-b,
.mfp-arrow:after,
.mfp-arrow:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    position: absolute;
    left: 0;
    top: 0;
    margin-top: 35px;
    margin-left: 35px;
    border: inset transparent;
}
.mfp-arrow .mfp-a,
.mfp-arrow:after {
    border-top-width: 13px;
    border-bottom-width: 13px;
    top: 8px;
}
.mfp-arrow .mfp-b,
.mfp-arrow:before {
    border-top-width: 21px;
    border-bottom-width: 21px;
    opacity: 0.7;
}
.mfp-arrow-left {
    left: 0;
}
.mfp-arrow-left .mfp-a,
.mfp-arrow-left:after {
    border-right: 17px solid #fff;
    margin-left: 31px;
}
.mfp-arrow-left .mfp-b,
.mfp-arrow-left:before {
    margin-left: 25px;
    border-right: 27px solid #3f3f3f;
}
.mfp-arrow-right {
    right: 0;
}
.mfp-arrow-right .mfp-a,
.mfp-arrow-right:after {
    border-left: 17px solid #fff;
    margin-left: 39px;
}
.mfp-arrow-right .mfp-b,
.mfp-arrow-right:before {
    border-left: 27px solid #3f3f3f;
}
.mfp-iframe-holder {
    padding-top: 40px;
    padding-bottom: 40px;
}
.mfp-iframe-holder .mfp-content {
    line-height: 0;
    width: 900px;
    max-width: 95%;
}
.mfp-image-holder .mfp-content,
img.mfp-img {
    max-width: 100%;
}
.mfp-iframe-holder .mfp-close {
    top: -40px;
}
.mfp-iframe-scaler {
    width: 100%;
    height: 0;
    overflow: hidden;
    padding-top: 56.25%;
}
.mfp-iframe-scaler iframe {
    display: block;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    border: 0;
}
.mfp-figure:after,
img.mfp-img {
    width: auto;
    height: auto;
    display: block;
}
img.mfp-img {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 12px;
    margin: 0 auto;
}
.mfp-figure:after {
    top: 40px;
    bottom: 40px;
    right: 0;
    z-index: -1;
    background: #444;
}
.mfp-figure small {
    color: #bdbdbd;
    display: block;
    font-size: 12px;
    line-height: 14px;
}
.mfp-figure figure {
    margin: 0;
}
.mfp-bottom-bar {
    margin-top: -36px;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    cursor: auto;
}
.mfp-gallery .mfp-image-holder .mfp-figure,
.owl-controls .owl-buttons div,
.owl-controls .owl-page {
    cursor: pointer;
}
.mfp-title {
    text-align: left;
    line-height: 18px;
    color: #f3f3f3;
    word-wrap: break-word;
    padding-right: 36px;
}
@media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
    .mfp-img-mobile .mfp-image-holder {
        padding-left: 0;
        padding-right: 0;
    }
    .mfp-img-mobile img.mfp-img {
        padding: 0;
    }
    .mfp-img-mobile .mfp-figure:after {
        top: 0;
        bottom: 0;
    }
    .mfp-img-mobile .mfp-figure small {
        display: inline;
        margin-left: 5px;
    }
    .mfp-img-mobile .mfp-bottom-bar {
        background: rgba(0, 0, 0, 0.6);
        bottom: 0;
        margin: 0;
        top: auto;
        padding: 3px 5px;
        position: fixed;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
    }
    .mfp-img-mobile .mfp-bottom-bar:empty {
        padding: 0;
    }
    .mfp-img-mobile .mfp-counter {
        right: 5px;
        top: 3px;
    }
    .mfp-img-mobile .mfp-close {
        top: 0;
        right: 0;
        width: 35px;
        height: 35px;
        line-height: 35px;
        background: rgba(0, 0, 0, 0.6);
        position: fixed;
        text-align: center;
        padding: 0;
    }
}
@media all and (max-width: 900px) {
    .mfp-arrow {
        -webkit-transform: scale(0.75);
        transform: scale(0.75);
    }
    .mfp-arrow-left {
        -webkit-transform-origin: 0;
        transform-origin: 0;
    }
    .mfp-arrow-right {
        -webkit-transform-origin: 100%;
        transform-origin: 100%;
    }
    .mfp-container {
        padding-left: 6px;
        padding-right: 6px;
    }
}
.animated {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-delay: 0.1s;
    animation-delay: 0.1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}
@-webkit-keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
@keyframes fadeInDown {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
.fadeInDown {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInDown;
}
@-webkit-keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
@keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}
@-webkit-keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
@keyframes fadeInRight {
    from {
        opacity: 0;
        -webkit-transform: translate3d(100%, 0, 0);
        transform: translate3d(100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}
@-webkit-keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
@keyframes fadeInUp {
    from {
        opacity: 0;
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
    }
}
.fadeInUp {
    -webkit-animation-name: fadeInUp;
    animation-name: fadeInUp;
}
@-webkit-keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}
@keyframes zoomIn {
    from {
        opacity: 0;
        -webkit-transform: scale3d(0.3, 0.3, 0.3);
        transform: scale3d(0.3, 0.3, 0.3);
    }
    50% {
        opacity: 1;
    }
}
.zoomIn {
    -webkit-animation-name: zoomIn;
    animation-name: zoomIn;
}
@-webkit-keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@keyframes slideInDown {
    from {
        -webkit-transform: translate3d(0, -100%, 0);
        transform: translate3d(0, -100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
.slideInDown {
    -webkit-animation-name: slideInDown;
    animation-name: slideInDown;
}
@-webkit-keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
@keyframes slideInUp {
    from {
        -webkit-transform: translate3d(0, 100%, 0);
        transform: translate3d(0, 100%, 0);
        visibility: visible;
    }
    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}
.slideInUp {
    -webkit-animation-name: slideInUp;
    animation-name: slideInUp;
}



.img-responsive {
    display: inline-block;
}
.list-inline {
    padding-left: 0;
    margin-left: -5px;
    list-style: none;
}
.list-inline > li {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}
.red-txt {
    color: #ef1212;
}
.underline-txt {
    text-decoration: underline;
}
.bold-txt {
    font-weight: bold;
}
.black-link {
    color: #000;
    font-weight: 600;
}
.black-link:hover {
    color: #442f05;
    text-decoration: underline;
}
.label {
    display: inline;
    padding: 0.2em 0.6em 0.3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    vertical-align: baseline;
    border-radius: 0.25em;
}
.label-success {
    background-color: #5cb85c;
}
.label-danger {
    background-color: #d9534f;
}
.padding {
    padding: 70px 0;
}
.padding-top {
    padding: 70px 0 0;
}
.image-bg {
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}
.section-title {
    margin-bottom: 60px;
    padding-bottom: 0;
    position: relative;
}
.section-title h3 {
    display: inline-block;
    font-size: 68px;
    font-weight: 700;
    margin: 0;
    position: relative;
    text-transform: capitalize;
    z-index: 1;
}
.section-title em {
    display: block;
    font-size: 120px;
    margin: 15px auto;
}
section picture {
    display: block;
}
#download-apps h3,
.sect-cont h3 {
    font-size: 60px;
    font-weight: 700;
    letter-spacing: 2px;
    margin: 0 0 25px;
}
.sect-cont .sc-bigger {
    display: block;
    font-size: 30px;
    line-height: initial;
    margin-bottom: 40px;
    max-width: 700px;
}
.sect-cont p {
    line-height: 28px;
    margin-bottom: 20px;
}
.parallax-section {
    background-position: 50% 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-attachment: fixed;
    width: 100%;
    min-height: 437px;
    position: relative;
}
.overlay-bg {
    background: rgba(255, 200, 63, 0.95);
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
section h3 span,
.ylw_txt {
    color: #fcc949;
}
#whatsit .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.whatsit-video {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 auto;
    flex: 1 0 auto;
    margin: 0 100px 0 50px;
    width: 275px;
}
.whatsit-video video {
    -webkit-transform: rotateZ(-8deg);
    transform: rotateZ(-8deg);
    width: 100%;
}
#random-chat {
    background: #000;
    background: radial-gradient(#2a2a2a, #000);
    padding-bottom: 0;
    position: relative;
}
#random-chat .container {
    color: #fff;
    max-width: 90%;
    width: 1620px;
}
#random-chat .img_wrp picture {
    -webkit-filter: drop-shadow(25px 25px 25px rgba(53, 55, 57, 0.4));
    filter: drop-shadow(25px 25px 25px rgba(53, 55, 57, 0.4));
}
#whats-special {
    background: #fccc52;
    padding-bottom: 100px;
}
.special-content {
    margin-top: 35px;
}
.special-content h4 {
    font-size: 30px;
    margin-bottom: 20px;
    font-weight: 800;
}
.special-content p {
    font-size: 14px;
}
.special-content #onlineUsers span {
    font-weight: 600;
}
.special-image {
    margin-bottom: -40px;
    text-align: center;
}
.special-image:after {
    content: "";
    background: rgba(0, 0, 0, 0.08);
    -webkit-box-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.08);
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, 0.08);
    border-radius: 50%;
    display: block;
    margin: 35px 0 0 -40%;
    position: absolute;
    left: 50%;
    height: 5px;
    width: 80%;
}
.no-webp .special-image:after {
    background: url(/assets/img/special1.png) center;
}
.special-image img {
    display: inline-block;
}
.rht_sf {
    text-align: left;
}
.lft_sf {
    text-align: right;
}
#features {
    padding-bottom: 35px;
}
.all-features .row {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}
.feature {
    margin-bottom: 60px;
}
.feature:hover h4:before {
    color: #ffcb3c;
}
.feature h4 {
    font-size: 28px;
    font-weight: 800;
    margin-bottom: 25px;
    margin-top: 5px;
}
.feature p {
    font-size: 18px;
}
.feat_sprt {
    margin: 0 -1px 30px;
}
.feat_sprt h4:before {
    color: #404040;
    display: block;
    font-size: 70px;
    font-weight: normal;
    font-family: ChatspinIcons;
    line-height: 1.2;
    margin: 0 auto 25px;
    height: 100px;
    -webkit-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
#onlineUsers span {
    font-weight: 800;
}
.all-features .row .feat_sprt:nth-child(1) h4:before {
    content: "\e818";
    font-size: 60px;
    position: relative;
    top: 10px;
}
.all-features .row .feat_sprt:nth-child(2) h4:before {
    content: "\e813";
}
.all-features .row .feat_sprt:nth-child(3) h4:before {
    content: "\e81b";
}
.all-features .row .feat_sprt:nth-child(4) h4:before {
    content: "\e81a";
}
.all-features .row .feat_sprt:nth-child(5) h4:before {
    content: "\e815";
}
.all-features .row .feat_sprt:nth-child(6) h4:before {
    content: "\e81c";
}
.all-features .row .feat_sprt:nth-child(7) h4:before {
    content: "\e817";
}
.all-features .row .feat_sprt:nth-child(8) h4:before {
    content: "\e819";
}
#call-to-action {
    background-image: url(/assets/img/bg/action-bg.webp);
    overflow: hidden;
    padding-top: 90px;
}
.no-webp #call-to-action {
    background-image: url(/assets/img/bg/action-bg.jpg);
}
#call-to-action .sect-cont {
    padding-top: 30px;
}
#call-to-action .img_wrp {
    padding: 0;
}
#download-apps {
    background: #000;
    padding-bottom: 50px;
}
#download-apps .container {
    width: 95%;
    max-width: 1920px;
}
#download-apps h3 {
    color: #fff;
    margin-bottom: 35px;
}
.apps {
    margin-top: 35px;
}
.apps li a {
    color: #fff;
    font-size: 50px;
    padding: 20px;
}
.apps li a:hover {
    color: #ffbf16;
}
#chat-filters {
    text-align: center;
}
#chat-filters .section-title {
    margin-bottom: 0;
}
#chat-filters .section-title em {
    margin-bottom: -5px;
    -webkit-transform: rotateZ(17deg);
    transform: rotateZ(17deg);
}
#howto {
    background: #fcbe1b;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(20%, #ffbf16), to(#e0b13c));
    background: linear-gradient(to bottom, #ffbf16 20%, #e0b13c);
}
.button.dbl_bord {
    margin: 45px 0px 45px -5px;
}
.button.dbl_bord .dbl_btn {
    border-width: 0;
    color: #000;
    cursor: pointer;
    font-weight: 600;
    font-size: 22px;
    text-transform: uppercase;
    position: relative;
    padding: 25px 55px;
}
.button.dbl_bord .dbl_btn:after,
.button.dbl_bord .dbl_btn:before {
    content: "";
    border: 4px solid #fff;
    border-radius: 4px;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    z-index: 1;
}
.button.dbl_bord .dbl_btn:after {
    border: 4px solid #000;
    -webkit-transform: translate(8px, 8px);
    transform: translate(8px, 8px);
    z-index: 0;
}
.button.dbl_bord .dbl_btn:hover {
    background: #ffd257;
}
.button.dbl_bord .dbl_btn:hover:after {
    -webkit-transform: translate(0);
    transform: translate(0);
}
.button.dbl_bord .dbl_btn:hover:before {
    opacity: 0;
    visibility: hidden;
}
#contact {
    overflow: hidden;
}
#main-contact-form .btn-primary {
    color: #000;
    background: 0 0;
    border: 3px solid #000;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 1px;
    margin-top: 35px;
    padding: 12px 30px;
    outline: 0;
    text-transform: uppercase;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
}
#main-contact-form .btn-primary:hover {
    border-color: #fbb03b;
    color: #fbb03b;
}
.btn.orng-btn.btn-lg {
    border-bottom-width: 3px;
    color: #000;
    display: inline-block;
    font-weight: 600;
    padding: 10px 40px;
}

.copy-wrap p {
    margin: 0;
}
.mfp-figure {
    background-color: #fff;
}
img.mfp-img {
    padding: 12px;
}
.mfp-image-holder .mfp-close {
    top: -35px;
}
.mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: pointer;
}
.mfp-counter {
    right: 50%;
    color: #fff;
    top: 50px;
    margin-right: -20px;
}
.gem-icon {
    background: url("../../themes/default/images/coin.png")
        center/contain no-repeat;
    -webkit-filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.5));
    filter: drop-shadow(1px 2px 3px rgba(0, 0, 0, 0.5));
    height: 48px;
    width: 48px;
}
.inner-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    font-size: 16px;
    line-height: 1.5;
}
.inner-page {
    -webkit-box-flex: 1;
    -ms-flex: 1 0 0px;
    flex: 1 0 0;
    padding: 20px 0 100px;
}
.lp-notification {
    background: #fff7e4;
    border-radius: 4px;
    border-left: 10px solid #ffbf24;
    margin-bottom: 30px;
    padding: 20px 30px;
}
.lp-notification > p {
    margin: 0;
}
.ip-top-notice {
    border: 1px solid #ef1212;
    border-radius: 3px;
    margin-bottom: 50px;
    padding: 20px 30px;
}
.ip-title {
    margin-bottom: 70px;
}
.ip-title h1 {
    font-size: 50px;
    font-weight: 700;
}
.ip-title strong {
    color: #4c4c4c;
}
.inner-page .ipc-sub-title.ipc-colored-title {
    border-top: 2px solid #dadada;
    color: #000;
    font-size: 36px;
    padding-top: 50px;
    text-transform: none;
}
.inner-page a {
    font-weight: 500;
}
.inner-page a:hover {
    color: #ffb400;
    text-decoration: underline;
}
.inner-page ul {
    margin: 15px 0 30px;
    padding: 0 30px;
}
.inner-page ul ul {
    margin: 10px 0;
}
.inner-page ul li {
    padding: 0 5px;
}
.inner-page ul li > a {
    display: inline-block;
    margin-bottom: 10px;
}
.ipc-nav {
    list-style-type: decimal;
}
.inner-page .bold,
.inner-page strong {
    font-weight: 600;
}
.ipc-sub-title {
    font-size: 28px;
    font-weight: 700;
    margin-top: 70px;
    text-transform: uppercase;
}
.ipc-sub-title.mt-40 {
    margin-top: 40px;
}
.ipc-sub-small {
    font-size: larger;
    font-weight: 600;
    margin-top: 35px;
}
.ipc-lg-text {
    font-size: 20px;
}
.list-non-style {
    list-style-type: none;
}
.ac-title {
    font-size: 30px;
    margin: 100px 0 20px;
    text-transform: uppercase;
}
.ac-item {
    border: 1px solid #ccc;
    border-style: solid none;
    font-size: 18px;
}
.ac-item + .ac-item {
    border-top: none;
}
.aci-head {
    cursor: pointer;
    padding: 25px 60px 25px 0;
    position: relative;
}
.aci-head:after {
    content: "+";
    border: 1px solid #6f6f6f;
    border-radius: 50%;
    font-size: 36px;
    font-weight: 100;
    line-height: 46px;
    position: absolute;
    right: 0;
    top: 13px;
    -webkit-transition: all 0.25s ease;
    transition: all 0.25s ease;
    text-align: center;
    height: 46px;
    width: 46px;
}
.active > .aci-head:after,
.aci-head:hover:after {
    background: #fff8ec;
    border-color: #fbaf3a;
}
.active > .aci-head:after {
    content: "−";
    -webkit-transform: rotateZ(-180deg);
    transform: rotateZ(-180deg);
}
.aci-body {
    display: none;
}
.aci-body p {
    margin-bottom: 20px;
}
.cont-struct {
    margin-top: 30px;
}
.ac-sub .ac-item {
    border-bottom: 0;
    border-top: 1px solid #eee;
}
.ac-sub .aci-head {
    padding-right: 20px;
}
.ac-sub .aci-head:after {
    display: none;
}
.ac-sub .aci-head em {
    color: #fbb03b;
    float: right;
    margin-top: 5px;
}
.ac-sub .aci-head span:before {
    content: "";
    background: #fbb03b;
    border-radius: 50%;
    display: inline-block;
    margin-right: 10px;
    margin-left: 5px;
    position: relative;
    top: -1px;
    height: 10px;
    width: 10px;
}
#main-contact-form {
    display: none;
    margin: 20px 0;
    position: relative;
}
.cont-struct #main-contact-form {
    display: block;
}
.form-control {
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #000;
    display: block;
    font-size: 14px;
    font-weight: 500;
    height: 46px;
    padding: 6px 20px;
    outline: none;
    width: 100%;
}
.form-control:focus {
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border: 1px solid #fbb03b;
    background-color: #fff;
}
.form-control::-moz-placeholder {
    color: #999;
    opacity: 1;
}
.form-control:-ms-input-placeholder {
    color: #999;
}
.form-control::-webkit-input-placeholder {
    color: #999;
}
textarea.form-control {
    height: auto;
    padding: 8px 20px;
    resize: none;
}
.form-group {
    margin-bottom: 20px;
}
.capt_error {
    color: #da4040;
    font-size: 14px;
    font-weight: 600;
    display: none;
}
.succes_send,
#send_form {
    display: none;
    background: rgba(255, 255, 255, 0.8);
    text-align: center;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}
#send_form em {
    position: relative;
    top: 80px;
    font-size: 100px;
    color: #fbb03b;
    text-shadow: 1px 1px 1px #fff, 2px 2px 2px #808080;
}
.succes_send h2 {
    font-weight: 300;
}
.succes_send em {
    color: #fbb03b;
    margin-top: 50px;
    font-size: 80px;
}
.table-wrap {
    border: 1px solid #c5c5c5;
    border-style: solid solid none none;
    margin: 50px 0;
    overflow: auto;
}
.tb-row,
.table-wrap > div {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    min-width: 750px;
}
.table-head {
    background: #fef3db;
    font-weight: 600;
}
.tb-row {
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    width: 100%;
}
.tb-col {
    border-left: 1px solid #c5c5c5;
    border-bottom: 1px solid #c5c5c5;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 20px;
}
.tb-col p {
    margin-bottom: 10px;
}
.cookie-table .tb-col {
    width: 20%;
}
.privacy-table .tb-col {
    width: 33.33%;
}
@media only screen and (max-width: 1400px) {
    .special-image img {
        max-height: 600px;
    }
    #howto img {
        max-height: 570px;
    }
}
@media only screen and (max-width: 1300px) {
    .section-title {
        margin-bottom: 40px;
    }
    .section-title h3 {
        font-size: 68px;
    }
    .section-title em {
        margin: 5px auto;
        font-size: 100px;
    }
    .section-title .section-title .button.dbl_bord {
        margin: 40px 0 40px -5px;
    }
    .section-title .section-title .button.dbl_bord .dbl_btn {
        font-size: 20px;
        padding: 24px 50px;
    }
}
@media only screen and (max-width: 1200px) {
    .padding {
        padding: 55px 0;
    }
    #download-apps h3,
    .sect-cont h3 {
        font-size: 46px;
        margin-bottom: 20px;
    }
    .whatsit-video {
        margin: 0 75px 0 25px;
        width: 275px;
    }
    .whatsit-video video {
        -webkit-transform: rotateZ(-5deg);
        transform: rotateZ(-5deg);
    }
    .sect-cont {
        padding-top: 25px;
    }
    .sect-cont .sc-bigger {
        font-size: 24px;
        margin-bottom: 25px;
    }
    .section-title em {
        font-size: 85px;
    }
    .section-title h3 {
        font-size: 58px;
    }
    .special-content {
        margin-top: 45px;
    }
    .special-content h4 {
        font-size: 26px;
        margin-bottom: 15px;
    }
    .special-image img {
        max-height: 560px;
    }
    .feat_sprt h4:before {
        margin: 0 auto 5px;
        height: 85px;
        font-size: 55px;
    }
    .all-features .row .feat_sprt:nth-child(1) h4:before {
        font-size: 45px;
    }
    .feature h4 {
        font-size: 23px;
        margin-top: 0;
        margin-bottom: 15px;
    }
    .feature p {
        font-size: 16px;
    }
    #call-to-action .sect-cont h3 {
        margin-top: -15px;
    }
    .button.dbl_bord .dbl_btn {
        font-size: 19px;
        padding: 22px 45px;
    }
    .button.dbl_bord .dbl_btn:after,
    .button.dbl_bord .dbl_btn:before {
        border-width: 3px;
    }
    #download-apps .container,
    footer .container {
        width: 100%;
    }
    .inner-body {
        font-size: 15px;
    }
    .ip-title h1 {
        font-size: 42px;
    }
    .inner-page .ipc-sub-title.ipc-colored-title {
        font-size: 32px;
    }
    .ipc-sub-title {
        font-size: 24px;
    }
    .tb-col {
        padding: 15px 15px 0;
    }
}
@media only screen and (max-width: 991px) {
    .home-content > b,
    .sect-cont p {
        line-height: 25px;
    }
    .sect-cont .sc-bigger {
        font-size: 22px;
    }
    .whatsit-video {
        margin: 0 50px 0 15px;
        width: 250px;
    }
    #download-apps h3,
    .sect-cont h3 {
        font-size: 37px;
        margin-bottom: 15px;
    }
    #whats-special {
        padding-bottom: 30px;
    }
    .special-content {
        margin-top: 0;
        margin-bottom: 30px;
    }
    .section-title h3 {
        font-size: 52px;
    }
    .rht_sf {
        text-align: right;
    }
    .img_sf {
        margin-top: 70px;
    }
    .feature {
        margin-bottom: 25px;
    }
    #call-to-action .img_wrp {
        margin-top: 50px;
    }
    .howto {
        margin-top: 20px;
    }
    .button.dbl_bord {
        margin: 35px 0 35px -5px;
    }
    .button.dbl_bord .dbl_btn {
        font-size: 18px;
        padding: 18px 30px;
    }
    .button.dbl_bord .dbl_btn:after {
        -webkit-transform: translate(5px, 5px);
        transform: translate(5px, 5px);
        z-index: 0;
    }
    .owl-item img {
        max-height: 500px;
    }
    #cn_chatroul img {
        display: block;
        margin: 0 auto 30px;
        width: 100%;
        max-width: 500px;
    }
    .footer-menu {
        text-align: center;
    }
    .footer-menu li a {
        padding: 0 10px 15px;
    }
    .ip-title {
        margin-bottom: 55px;
    }
    .ip-title h1 {
        font-size: 36px;
    }
    .ipc-sub-title {
        font-size: 22px;
        margin-top: 55px;
    }
    .inner-page .ipc-sub-title.ipc-colored-title {
        font-size: 28px;
    }
}
@media only screen and (max-width: 767px) {
    #howto img,
    .special-image:after {
        display: none;
    }
    .padding {
        padding: 40px 0;
    }
    .sect-cont {
        padding-top: 0;
    }
    #download-apps h3,
    .sect-cont h3 {
        font-size: 32px;
    }
    .img_wrp {
        text-align: center;
    }
    .sect-cont .sc-bigger {
        font-size: 18px;
        margin-bottom: 20px;
    }
    .section-title {
        margin-bottom: 15px;
    }
    .section-title h3 {
        font-size: 46px;
    }
    #call-to-action img,
    .special-image img {
        max-height: 450px;
    }
    .lft_sf,
    .rht_sf {
        margin: 0 auto;
        max-width: 80%;
        text-align: center;
    }
    .img_sf {
        margin-top: 15px;
        margin-bottom: 90px;
    }
    .special-content {
        margin-top: 35px;
        margin-bottom: 50px;
    }
    .section-title em {
        font-size: 75px;
    }
    .feature h4 {
        font-size: 22px;
        margin-bottom: 10px;
    }
    #call-to-action {
        padding-top: 40px;
    }
    #call-to-action .img_wrp {
        margin-top: 0;
    }
    #howto {
        padding: 30px 0 60px;
    }
    .howto {
        padding: 0 5%;
    }
    .action-content {
        margin-top: 40px;
    }
    .button.dbl_bord {
        margin: 50px 0 35px -5px;
        text-align: center;
    }
    .apps li a {
        font-size: 40px;
        padding: 10px 20px;
    }
    #storytime .storySettings {
        right: 60px;
    }

}
@media only screen and (max-width: 600px) {
    .section-title h3 {
        font-size: 40px;
    }
    #whatsit .container {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }
    .whatsit-video {
        margin: 0 0 50px;
        width: 225px;
    }
    #download-apps h3,
    .sect-cont h3 {
        font-size: 30px;
    }
    .ip-title {
        margin-bottom: 50px;
    }
    .ip-title h1 {
        font-size: 30px;
    }
    .inner-page .ipc-sub-title.ipc-colored-title {
        font-size: 26px;
        padding-top: 40px;
    }
    .ipc-sub-title {
        font-size: 18px;
        margin-top: 50px;
    }
}
@media only screen and (max-width: 479px) {
    .section-title h3 {
        font-size: 30px;
    }
    .whatsit-video {
        margin: 0 0 25px;
        width: 55%;
    }
    #whats-special h3:before {
        left: -10px;
        top: -10px;
    }
    .sect-cont p {
        line-height: 23px;
    }
    .special-image img {
        max-height: 380px;
    }
    .special-content h4 {
        font-size: 22px;
    }
    .section-title em {
        font-size: 60px;
    }
    .feature h4 {
        font-size: 18px;
        margin-bottom: 10px;
    }
    .feature p {
        font-size: 15px;
    }
    #call-to-action img {
        max-height: 320px;
    }
    .ac-title {
        font-size: 24px;
        margin: 70px 0 20px;
    }
    .aci-head {
        padding: 20px 50px 20px 0;
    }
    .aci-head:after {
        font-size: 32px;
        line-height: 38px;
        top: 10px;
        height: 38px;
        width: 38px;
    }
    #download-apps {
        padding: 40px 0 30px;
    }
    .footer-menu li a {
        padding: 10px 15px;
    }
    .footer-bottom {
        margin: 30px 0;
    }
    .footer-social {
        margin-bottom: 35px;
    }
    .inner-body {
        font-size: 14px;
    }
    .tb-col {
        padding: 12px 12px 0;
        font-size: 12px;
    }
    .lp-notification {
        border-left: 7px solid #ffbf24;
        padding: 15px 20px;
    }
}
@media only screen and (max-width: 400px) {
    .copy-wrap,
    .footer-social {
        width: 100%;
        text-align: center;
    }
    .section-title h3 {
        font-size: 27px;
    }
    .feature h4 {
        font-size: 17px;
    }
}
@media only screen and (max-width: 360px) {
    #download-apps h3,
    .sect-cont h3 {
        font-size: 26px;
    }
    .section-title h3 {
        font-size: 30px;
    }
    #whats-special h3:before {
        left: -8px;
        top: -6px;
    }
    .special-content h4 {
        font-size: 20px;
        margin-bottom: 10px;
    }
    .feat_sprt {
        width: 100%;
        margin-bottom: 0;
    }
    .feat_sprt h4:before {
        margin: 0 auto;
    }
    .lft_sf,
    .rht_sf {
        max-width: 100%;
    }
    .footer-menu li a {
        font-size: 13px;
    }
}
@media only screen and (max-width: 812px) and (orientation: landscape) {
    #mainmenu {
        top: 45px;
    }
}
@media only screen and (min-width: 1201px) {
    #howto .row {
        margin-top: 35px;
    }
    #whats-special .section-title h3 {
        font-size: 58px;
    }
}
@media only screen and (min-width: 1550px) {
    .padding {
        padding: 85px 0;
    }
    .special-content p {
        font-size: 16px;
    }
    .whatsit-video {
        width: 320px;
    }
    #chat-filters .section-title em {
        font-size: 150px;
    }
    #download-apps h3,
    .sect-cont h3 {
        font-size: 65px;
    }
    #random-chat .section-title h3 {
        font-size: 68px;
    }
    .sect-cont .sc-bigger {
        font-size: 31px;
    }
    .section-title h3 {
        font-size: 80px;
    }
    .sect-cont p {
        line-height: 29px;
        margin-bottom: 30px;
    }
    #call-to-action .sect-cont h3 {
        font-size: 60px;
    }
    .button.dbl_bord .dbl_btn {
        font-size: 26px;
        padding: 30px 65px;
    }
    .apps li a {
        font-size: 54px;
        padding: 24px;
    }
    #contact {
        min-height: calc(100% - 131px);
    }
}
@media only screen and (min-width: 1800px) {
    #download-apps h3,
    .sect-cont h3 {
        font-size: 70px;
    }
    .section-title h3 {
        font-size: 84px;
    }
    .section-title em {
        margin: 25px auto;
    }
    .whatsit-video {
        width: 350px;
        margin-left: 0;
    }
    #features {
        padding-bottom: 95px;
    }
    .feat_sprt {
        margin-bottom: 50px;
    }
    #call-to-action .sect-cont h3 {
        font-size: 62px;
    }
    .button.dbl_bord {
        margin: 60px 0 60px -5px;
    }
    .button.dbl_bord .dbl_btn {
        font-size: 28px;
        padding: 33px 70px;
    }
    .apps li a {
        font-size: 59px;
    }
}
@media print {
    *,
    :after,
    :before {
        background: 0;
        color: #000;
        text-shadow: none;
        -webkit-box-shadow: none;
        box-shadow: none;
        visibility: visible;
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    thead {
        display: table-header-group;
    }
    h2,
    h3,
    p {
        orphans: 3;
        widows: 3;
    }
    .navbar {
        border: 0;
    }
    .navbar-fixed-top {
        position: relative;
    }
    .logo {
        display: block;
        margin: 10px auto;
    }
    #home-section {
        height: 300px;
    }
    .home-content {
        margin-top: 100px;
        text-align: center;
        width: 100%;
    }
    .home-content > span {
        max-width: 100%;
    }
    .sect-cont .sc-bigger {
        max-width: 100%;
    }
    .special-image img {
        margin-bottom: 40px;
        max-height: 450px;
    }
    .padding {
        page-break-inside: avoid;
    }
    .lft_sf,
    .rht_sf {
        text-align: center;
    }
    #howto picture {
        margin: 0 auto 30px;
        text-align: center;
    }
    .footer-menu,
    #random-chat picture,
    .button.dbl_bord,
    .special-image:after,
    .intro-report,
    .feat_sprt h4:before,
    #whats-special h3:before,
    .app-icons,
    .hc-welcome,
    #mainmenu {
        display: none;
    }
}
.preloader {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
    opacity: 0;
    visibility: hidden;
    z-index: -100;
}

.create-date .lw-field{
  margin-top: 8px!important;
  margin-bottom: 8px!important;
}

.create-date .lw-label{
  flex: 0 0 185px !important;
}
.create-date .lw-group{
  flex: 0 0 calc(100% - 195px) !important;
}
.create-date .lw-group .lw-select{
  font-size: 15px!important;
  font-weight: 500;
  font-family:'Rubik';  
}
.create-date .lw-group .lw-input{
  font-size: 15px!important;
  letter-spacing: 0.8px;
  font-weight: 500;font-family:'Rubik';  
}

.create-date .lw-label{
  font-size: 16px!important;
}


.snip1336 {
  font-family: 'Rubik', Arial, sans-serif;
  position: relative;
  overflow: hidden;
  margin: 8px;
  min-width: 235px;
  max-width: 320px;
  width: 29.2%;
  color: #222;
  text-align: left;
  line-height: 1.4em;
  background-color: none;
  display: inline-table;
    border-radius: 15px;
    border:1px solid #bbb;
}
.snip1336 * {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all 0.25s ease;
  transition: all 0.25s ease;
}
.snip1336 img {
  max-width: 100%;
  vertical-align: top;
  opacity: 0.85;
}

.snip1336 .dating-btns {
  position:absolute;
  bottom:15px;
  width:90%;
  left:10px
}

.snip1336 .bg-image{
  max-height: 160px;
  width: 100%;
  object-fit: cover;
}

.snip1336 .bg-image-me{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0.4;
}

.snip1336 figcaption {
  width: 100%;
  background-color: none;
  padding: 25px;
  object-fit:cover;
  position: relative;
    border-radius: 10px;
  height: 440px;
}
.snip1336 .dating-btns a {
  padding: 5px;
  border: 1px solid #222;
  color: #222;
  font-size: 0.7em;
  text-transform: uppercase;
  margin: 10px 0;
  display: inline-block;
  opacity: 0.85;
  width: 47%;
  text-align: center;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: 1px;
  border-radius: 10px;
}
.snip1336 .dating-btns a:hover {
  opacity: 1;
}
.snip1336 .profile {
  border-radius: 30%;
  position: absolute;
  top: -50px;
  left: 90px;
  z-index: 1;
  max-width: 90px;
  opacity: 1;
  box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
  max-height: 90px;
  object-fit: cover;
}
.snip1336 .dating-btns .follow {
  margin-left: 2.5%;
  border-color: #783BF9;
  color: #783BF9;
}

.snip1336 .dating-btns .remove {
  margin-left: 2.5%;
  border-color: #c12022;
  color: #c12022;
}

.snip1336 h2 {
  margin: 0 0 5px;
  font-weight: 700;
  font-size: 22px;
}
.snip1336 h2 span {
  display: block;
  font-size: 0.8em;
  color: #783BF9;
  line-height: 0.1rem;
  margin-bottom: 25px;
  font-weight: 400;
}
.snip1336 p {
  margin: 0 0 0px;
  font-size: 0.9em;
  opacity: 0.9;
}

.open-mobile-date-request{
    position:fixed;
    width: 50%;
    height: 40px;
    left: 25%;
    bottom:80px;
    text-align: center;
    z-index: 999;
}

.btn-mobile-date-request {
  position: relative;
  background: linear-gradient(281deg, #e9262694, #ff4318, #cb08086b, #f90505ad, #e9262694);
  background-size: 400% 100%;
  text-transform: uppercase;
  font-weight: 700;
  border: none;
  border-radius: 2.25em;
  font-size: 13px;
  letter-spacing: 1px;
  padding: 0;
  margin: 0;
  animation: Gradient 4s ease infinite;
  text-decoration: none;
}

.btn-mobile-date-request div {
  color: white;
  padding: 0.35em 1.618em;
  border-radius: inherit;
  background-size: inherit;
  background-image: inherit;
  animation: Gradient 4s ease infinite;
  position: relative;
  z-index: 1;
  font-family: 'Inter';
  font-size: 16px;
  
}

@keyframes Gradient {
    50% {
        background-position: 140% 50%;
    transform: skew(-2deg);
    }
}

.btn-mobile-date-request::after {
  content: '';
  position: absolute;
  background-size: inherit;
  background-image: inherit;
  animation: inherit;
  left: 0px;
  right: 0px;
  top: 2px;
  height: 100%;
  filter: blur(1rem);
}

@media only screen and (max-width: 700px) {
  .snip1336 {

    min-width: 95%;
    max-width: 95%;
    width: 95%;
  }
  .snip1336 h2 span {
    font-size: 0.6em;
    line-height: 0.9rem;
  }
  .snip1336 .profile {
    border-radius: 25%;
    top: -210px;
    left: 30px;
    max-width: 120px;
    min-width: 120px;
    height: 120px;
    max-height: 120px;
  }

  .snip1336 .dating-btns {
    position:absolute;
    bottom:15px;
    width:80%;
    left:10%
  }

  .snip1336 .bg-image{
    max-height:260px;
  }

  .snip1336 figcaption {
    height: 220px;
  }

  .snip1336 .dating-btns {
    top:195px;
  }

  .snip1336 .dating-btns a{
    background: rgba(255,255,255,1);
  }  

}

.hideRequestBtn{
  display: none;
}

.iti__country-name{
    border: none!important;
    border-radius: 0!important;
    font-size: 0.785em!important;
    font-weight: 400!important;
    letter-spacing: 0!important;
    /* line-height: 0.7; */
    margin-left: 1em;
    padding: 0!important; 

}

@media screen and (min-width:768px) {
  .iti__country-list {
      margin: 5px 0 0 -1px;
      max-height: 115px!important;
      max-width: 315px;
      overflow-x: hidden!important;
  }
}

#currentUserPhoneNumber{
  background:#fafafa;
  border-radius: 10px;
  padding: 10px;
  padding-right: 25px;
  margin-left:0px;
  outline:none!important;
  border:1px solid #eee;
  letter-spacing: 1.5px;
  font-size: 16px;
}


#currentUserPhoneNumber.error {
  border: 1px solid #FF7C7C;
}


#userCodeSMS{
  background:#fff;
  border-radius: 10px;
  padding: 10px;
  padding-left: 5px !important;
  margin-left:25px;
  outline:none!important;
  border:1px solid #eee;
  letter-spacing: 1.5px;
  font-size: 16px;
  width: 120px!important;
  text-align: center;
}

#send-sms-verification{
  border: 1px solid #eee;
  border-radius: 15px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  padding: 12px;
  color: #fff;
}

.uploadVerificationGestureBtn {
    display: -webkit-inline-flex;
    display: inline-flex;
    vertical-align: top;
    /* width: 100%; */
    outline: 0;
    /* border: 1px solid transparent; */
    border-radius: 8px;
    text-align: center;
    text-decoration: none;
    transition: background .2s, border .2s, color .2s;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-font-smoothing: antialiased;
    padding: 0;
}

.uploadVerificationGestureBtn > .btn__content{
    display: -webkit-flex;
    display: flex;
    height: 100%;
    padding: 5px 22px;
    pointer-events: none;
    font-size: 1.1rem;
    color: #fff;
    font-weight: bold;
}

#userCodeSMS::-moz-placeholder {
    color: #999 !important;
}
#userCodeSMS:-ms-input-placeholder {
    color: #999 !important;
}
#userCodeSMS::-webkit-input-placeholder {
    color: #999 !important;
}
/* ==== themes/default/css/vendor/jquery.dm-uploader.min.css ==== */
.dm-uploader{cursor:default;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.dm-uploader .btn{position:relative;overflow:hidden}.dm-uploader .btn input[type=file]{position:absolute;top:0;right:0;margin:0;border:solid transparent;width:100%;opacity:0;cursor:pointer}
/* ==== themes/default/css/vendor/autocomplete.css ==== */
.tp-autocomplete {

  position: relative;

  max-width: 25em; 

  font-family: 'Montserrat'; }







.tp-ac__list {

  position: absolute;

  z-index: 100;

  width: 100%;

  margin: 0;

  padding-left: 0;

  list-style-type: none;

  color: #979797;

  background-color: #fff;

  box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.35);

  font-size: 0.875em; }



.tp-ac__item {

  overflow: hidden;

  padding: 0.35714em 0.71429em;

  cursor: pointer;

  -webkit-user-select: none;

     -moz-user-select: none;

      -ms-user-select: none;

          user-select: none;

          font-weight: 400 !important;

  white-space: nowrap;

  text-overflow: ellipsis; }

  .tp-ac__item:hover, .tp-ac__item.is-active {

    background-color: #ddd; }

  .tp-ac__item.no-results, .tp-ac__item.no-results:hover {

    cursor: default;

    background-color: #fff; }

  .tp-ac__item span {

    color: #4a4a4a;

    font-weight: 400; }



@-webkit-keyframes spinner {

  to {

    -webkit-transform: rotate(360deg);

            transform: rotate(360deg); } }



@keyframes spinner {

  to {

    -webkit-transform: rotate(360deg);

            transform: rotate(360deg); } }



.spinner:before {

  position: absolute;

  top: 50%;

  right: 0.5em;

  width: 1em;

  height: 1em;

  margin-top: -0.625em;

  margin-left: -0.625em;

  content: '';

  -webkit-animation: spinner 1s linear infinite;

          animation: spinner 1s linear infinite;

  border: 2px solid rgba(0, 0, 0, 0.3);

  border-top-color: rgba(0, 0, 0, 0.6);

  border-radius: 50%; }


/* ==== themes/red/css/vendor/nprogress.css ==== */
/* Make clicks pass-through */
#nprogress {
  pointer-events: none;
}

#nprogress .bar {
  background: #fd0000;

  position: fixed;
  z-index: 1031;
  top: 0;
  left: 0;

  width: 100%;
  height: 2px;
}

/* Fancy blur effect */
#nprogress .peg {
  display: block;
  position: absolute;
  right: 0px;
  width: 100px;
  height: 100%;

  opacity: 1.0;

  -webkit-transform: rotate(3deg) translate(0px, -4px);
      -ms-transform: rotate(3deg) translate(0px, -4px);
          transform: rotate(3deg) translate(0px, -4px);
}

/* Remove these to get rid of the spinner */
#nprogress .spinner-progress {
  display: block;
  position: fixed;
  z-index: 1031;
  top: 18px;
  right: 18px;
}

#nprogress .spinner-icon {
  width: 18px;
  height: 18px;
  box-sizing: border-box;

  border: solid 2px transparent;
  border-top-color: #fd0000;
  border-left-color: #fd0000;
  border-radius: 50%;

  -webkit-animation: nprogress-spinner 400ms linear infinite;
          animation: nprogress-spinner 400ms linear infinite;
}

.nprogress-custom-parent {
  overflow: hidden;
  position: relative;
}

.nprogress-custom-parent #nprogress .spinner,
.nprogress-custom-parent #nprogress .bar {
  position: absolute;
}

@-webkit-keyframes nprogress-spinner {
  0%   { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}
@keyframes nprogress-spinner {
  0%   { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


/* ==== themes/default/css/vendor/little-widgets.css ==== */
.lw-widget {
  --theme-color: #F65500;
  --background-color: #F9F9F9;
  --background-mat: #C9CCD2;
  --border-color: rgba(0, 0, 0, 0.06);
  --text-primary: #2F2E35;
  --text-secondary: #6d6c71;
}

.lw-widget,
.lw-widget *,
.lw-widget *:before,
.lw-widget *:after {
  box-sizing: border-box;
}

.lw-widget div, .lw-widget input, .lw-widget textarea, .lw-widget select, .lw-widget button,
.lw-widget h1, .lw-widget h2, .lw-widget h3, .lw-widget h4, .lw-widget h5, .lw-widget h6, .lw-widget a, .lw-widget span, .lw-widget a:focus {
  outline: none;
}

.lw-widget input[type="text"],
.lw-widget input[type="email"],
.lw-widget input[type="tel"],
.lw-widget textarea,
.lw-widget select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.lw-widget input[type="submit"],
.lw-widget button {
  margin: 0;
  cursor: pointer;
}

.lw-widget input[type="submit"]::-moz-focus-inner,
.lw-widget button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.lw-widget textarea {
  overflow: auto;
}

.lw-widget a {
  text-decoration: none;
}

.lw-widget strong {
  font-weight: 600;
}

.lw-widget button *,
.lw-widget a * {
  pointer-events: none;
}

.lw-wrap {
  display: block;
  padding: 20px;
  color: var(--text-primary);
}

.lw-wrap:hover {
  color: var(--text-primary);
}

.lw-wrap_mw {
  max-width: 1244px;
  margin: 0 auto;
}

.lw-btn {
  display: inline-block;
  padding: 11px 20px;
  background: var(--theme-color);
  border: none;
  border-radius: 4px;
  font-size: 18px;
  font-weight: 600;
  color: white;
  text-align: center;
  line-height: 1.33333;
  transition: background .2s, opacity .2s;
}

.lw-btn:hover {
  opacity: .8;
  color: white;
}

.lw-btn-answer {
  margin-right: 14px;
  font-size: 36px;
}

.lw-btn-text {
  font-size: 22px;
  font-weight: 400;
  text-align: left;
}

.lw-btn_flex {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.lw-btn_sm {
  padding: 11px 20px;
}

.lw-btn_sm.lw-btn_simple {
  padding: 12px 20px;
}

.lw-btn_md {
  padding: 13px 20px;
}

.lw-btn_wide {
  width: 100%;
}

.lw-btn_simple {
  background: transparent;
  font-size: 16px;
  font-weight: 400;
  color: var(--text-secondary);
}

.lw-btn_simple:hover {
  background: rgba(0, 0, 0, 0.08);
  color: var(--text-secondary);
  opacity: 1;
}

.lw-btn_black {
  background: black;
  color: white;
}

.lw-btn_white {
  background: white;
  opacity: .7;
  color: var(--theme-color);
}

.lw-btn_white:hover {
  opacity: 1;
  color: var(--theme-color);
}

.lw-btn_stroke {
  background: none;
  box-shadow: 0 0 0 2px var(--theme-color) inset;
}

.lw-btn_color {
  font-weight: 600;
  color: var(--theme-color);
}

.lw-btn_color:hover {
  color: var(--theme-color);
}

.lw-btn_back {
  padding: 0;
  background: none;
  color: var(--text-primary);
}

.lw-btn_back:before {
  content: '';
  display: inline-block;
  position: relative;
  top: -1px;
  width: 14px;
  height: 14px;
  margin-right: 6px;
  border: solid var(--text-primary);
  border-width: 0 0 3px 3px;
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  vertical-align: middle;
}

.lw-btn_back:hover {
  color: var(--text-primary);
}

.lw-pic {
  display: block;
}

.lw-preview .lw-pic {
  width: 100%;
  border-radius: 6px 6px 0 0;
}

.lw-preview_center {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.lw-preview_center .lw-pic {
  max-width: 140px;
}

.lw-preview_custom {
  padding-right: 30px;
}

.lw-preview_custom .lw-pic {
  border-radius: 6px;
}

.lw-center {
  text-align: center;
}

.lw-center .lw-radio {
  margin: 0 10px;
}

.lw-title {
  margin-bottom: 10px;
  font-size: 24px;
  font-weight: 700;
  color: var(--text-primary);
  line-height: 1.20833;
}

.lw-title_sm {
  margin-bottom: 0;
  font-size: 20px;
}

.lw-title_md {
  font-size: 26px;
}

.lw-title_lg {
  font-size: 30px;
  line-height: 1.1;
}

.lw-title_thin {
  font-weight: 400;
}

.lw-title_uppercase {
  text-transform: uppercase;
}

.lw-title_color {
  color: var(--theme-color);
}

.lw-content {
  font-size: 18px;
  color: var(--text-secondary);
  line-height: 1.33333;
}

.lw-content p,
.lw-content figure {
  margin: 0;
}

.lw-content p + p,
.lw-content p + figure,
.lw-content figure + p,
.lw-content figure + figure {
  margin: 20px 0 0;
}

.lw-content img {
  display: block;
  width: 100%;
  border-radius: 6px;
}

.lw-content a {
  border-bottom: 1px solid var(--text-secondary);
  color: var(--text-primary);
  transition: border-color .2s;
}

.lw-content a:hover {
  border-color: transparent;
}

.lw-content_sm {
  font-size: 14px;
}

.lw-content_md {
  font-size: 16px;
}

.lw-content_lg {
  font-size: 22px;
}

.lw-content_dark {
  color: var(--text-primary);
}

.lw-content_dark a {
  color: var(--text-primary);
}

.lw-category {
  display: inline-block;
  margin-bottom: 10px;
  font-weight: 700;
  color: var(--theme-color);
}

.lw-category:hover {
  color: var(--theme-color);
}

.lw-share {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.lw-share-btn {
  display: -ms-flexbox;
  display: flex;
  position: relative;
  height: 50px;
  border: none;
  transition: background .2s;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex: 1;
  flex: 1;
}

.lw-share-btn_facebook {
  background: #4F69A2;
}

.lw-share-btn_facebook:hover {
  background: #475e91;
}

.lw-share-btn_twitter {
  background: #66B4EF;
}

.lw-share-btn_twitter:hover {
  background: #4fa9ed;
}

.lw-share-btn_google {
  background: #E05546;
}

.lw-share-btn_google:hover {
  background: #dc4130;
}

.lw-share-btn_pinterest {
  background: #D1383F;
}

.lw-share-btn_pinterest:hover {
  background: #c32d34;
}

.lw-share-btn_email {
  background: #AAAAAA;
}

.lw-share-btn_email:hover {
  background: #9d9d9d;
}

.lw-share-btn i {
  font-size: 24px;
  color: white;
}

.lw-share-pic {
  max-width: 24px;
  max-height: 24px;
}

.lw-share_grid .lw-share-btn {
  height: 70px;
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
}

.lw-share_grid .lw-share-btn i {
  font-size: 32px;
}

.lw-share_grid .lw-share-pic {
  max-width: 32px;
  max-height: 32px;
}

.lw-share_vert {
  width: 50px;
  -ms-flex-direction: column;
  flex-direction: column;
}

.lw-tools {
  position: relative;
}

.lw-tools-btn {
  display: block;
  width: 70px;
  height: 70px;
  background: #FFFFFF;
  box-shadow: 0 4px 6px 0 rgba(60, 70, 80, 0.1), 0 1px 3px 0 rgba(0, 0, 0, 0.08);
  border-radius: 6px;
  border: none;
  color: #546E7A;
}

.lw-tools-btn.lw-active {
  background: var(--theme-color);
  color: white;
}

.lw-tools-icon {
  font-size: 24px;
}

.lw-tools-title {
  display: block;
  font-size: 12px;
  line-height: 1.66667;
}

.lw-tools-dropdown {
  position: absolute;
  right: 0;
  bottom: calc(100% + 10px);
}

.lw-tools-btn + .lw-tools-group {
  margin-top: 10px;
}

.lw-tools-group {
  border-radius: 6px;
  background: white;
  box-shadow: 0 4px 6px 0 rgba(60, 70, 80, 0.1), 0 1px 3px 0 rgba(0, 0, 0, 0.08);
}

.lw-tools-group .lw-tools-btn {
  border-radius: 0;
  box-shadow: none;
}

.lw-tools-group .lw-tools-btn:first-child {
  border-radius: 6px 6px 0 0;
}

.lw-tools-group .lw-tools-btn:last-child {
  border-radius: 0 0 6px 6px;
}

.lw-tools-group .lw-tools-btn:not(:last-child) {
  border-bottom: 1px solid var(--border-color);
}

.lw-close {
  position: absolute;
  top: 0;
  right: 0;
  background: none;
  border: none;
  padding: 5px;
  font-size: 0;
  opacity: 0;
  transition: opacity .2s;
  z-index: 10;
}

.lw-close i {
  font-size: 18px;
}

.lw-close_white {
  color: white;
}

.lw-close_lg {
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
}

.lw-close_lg i {
  font-size: 24px;
}

.lw-close_circle {
  top: -10px;
  right: -10px;
  width: 34px;
  height: 34px;
  background: white;
  box-shadow: 0 3px 5px 0 rgba(37, 39, 44, 0.05), 0 1px 3px 0 rgba(37, 39, 44, 0.06);
  border-radius: 50%;
  opacity: 1;
}

.lw-close_inside {
  top: 10px;
  right: 10px;
}

.lw-close.lw-visible {
  opacity: .7;
}

.lw-close.lw-visible:hover {
  opacity: 1;
}

.lw-ripple {
  position: absolute;
  border-radius: 50%;
  opacity: 0;
  background: rgba(0, 0, 0, 0.1);
  -ms-transform: translate(-50%, -50%) scale(0);
  transform: translate(-50%, -50%) scale(0);
  animation: lw-ripple .5s ease-out forwards;
  pointer-events: none;
}

[data-lw-ripple] {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
  overflow: hidden;
  z-index: 1;
}

@keyframes lw-ripple {
  0 {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0);
  }
  15% {
    opacity: 1;
  }
  50% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
  }
}

.lw-tooltip {
  position: relative;
}

.lw-tooltip:hover .lw-tooltip-content {
  opacity: 1;
}

.lw-tooltip-content {
  position: absolute;
  top: 50%;
  right: calc(100% + 13px);
  padding: 6px 9px;
  background: white;
  filter: drop-shadow(0 3px 5px rgba(71, 75, 86, 0.3));
  border-radius: 3px;
  font-size: 16px;
  white-space: nowrap;
  pointer-events: none;
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  opacity: 0;
  transition: opacity .2s;
}

.lw-tooltip-content:before {
  content: '';
  position: absolute;
  top: calc(50% - 6px);
  right: -5px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 6px 0 6px 6px;
  border-color: transparent transparent transparent white;
}

.lw-circle {
  position: relative;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background: var(--theme-color);
  border: none;
  box-shadow: 0 3px 5px rgba(71, 75, 86, 0.3);
  font-size: 0;
  color: white;
}

.lw-circle i {
  font-size: 30px;
  transition: transform .4s, opacity .2s;
}

.lw-circle i:nth-child(2) {
  position: absolute;
  top: calc(50% - 15px);
  left: calc(50% - 15px);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
  opacity: 0;
}

.lw-circle.lw-active i {
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  opacity: 0;
}

.lw-circle.lw-active i:nth-child(2) {
  -ms-transform: rotate(0);
  transform: rotate(0);
  opacity: 1;
}

.lw-powered {
  margin-top: 10px;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.5);
  line-height: 1.71429;
  text-align: center;
  opacity: 0;
  -ms-transform: scale(0);
  transform: scale(0);
}

.lw-powered a {
  color: rgba(0, 0, 0, 0.5);
  font-weight: 600;
  transition: color .2s;
}

.lw-powered a:hover {
  color: rgba(0, 0, 0, 0.4);
}

.lw-powered.lw-animate {
  animation: lw-powered .4s ease-out forwards;
}

.lw-powered.lw-animate-reverse {
  animation: lw-powered .4s ease-out forwards alternate-reverse;
}

.lw-powered.lw-visible {
  opacity: 1;
  -ms-transform: scale(1);
  transform: scale(1);
  animation: none;
}

@keyframes lw-powered {
  0 {
    opacity: 0;
    transform: scale(0);
  }
  50%, 100% {
    opacity: 1;
    transform: scale(1);
  }
}

.lw-toggler {
  display: block;
  position: relative;
  margin: 0;
  background: white;
  box-shadow: 0 2px 3px 0 rgba(37, 39, 44, 0.1), 0 2px 3px 0 rgba(37, 39, 44, 0.1) inset;
  cursor: pointer;
}

.lw-toggler:first-child {
  border-radius: 6px 6px 0 0;
}

.lw-toggler:last-child {
  border-radius: 0 0 6px 6px;
}

.lw-toggler-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.lw-toggler-input:checked + .lw-toggler-content:before {
  border-color: var(--theme-color);
}

.lw-toggler-input:checked + .lw-toggler-content:after {
  opacity: 1;
}

.lw-toggler-content {
  display: block;
  padding: 14px 20px 13px 46px;
}

.lw-toggler-content:before, .lw-toggler-content:after {
  content: '';
  position: absolute;
  border-radius: 50%;
}

.lw-toggler-content:before {
  top: 14px;
  left: 14px;
  width: 22px;
  height: 22px;
  border: 3px solid rgba(0, 0, 0, 0.3);
  transition: border-color .2s;
}

.lw-toggler-content:after {
  top: 20px;
  left: 20px;
  width: 10px;
  height: 10px;
  background: var(--theme-color);
  opacity: 0;
  transition: opacity .2s;
}

.lw-qty {
  position: absolute;
  top: 12px;
  left: 15px;
  font-size: 14px;
  color: var(--text-secondary);
}

.lw-radio {
  display: inline-block;
  position: relative;
  margin: 0 20px 10px 0;
  cursor: pointer;
}

.lw-radio-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.lw-radio-input:checked + .lw-radio-content:after {
  opacity: 1;
}

.lw-radio-content {
  display: block;
  padding-left: 32px;
  color: var(--text-secondary);
}

.lw-radio-content:before, .lw-radio-content:after {
  content: '';
  position: absolute;
  border-radius: 50%;
}

.lw-radio-content:before {
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  background: white;
  box-shadow: 0 3px 5px 0 rgba(37, 39, 44, 0.1);
}

.lw-radio-content:after {
  top: 6px;
  left: 6px;
  width: 10px;
  height: 10px;
  background: var(--theme-color);
  opacity: 0;
  transition: opacity .2s;
}

.lw-checkbox {
  display: inline-block;
  position: relative;
  margin: 0 20px 10px 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
}

.lw-checkbox-input {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.lw-checkbox-input:checked + .lw-checkbox-content .lw-checkbox-tick > * {
  opacity: 1;
}

.lw-checkbox-content {
  display: block;
  padding-left: 32px;
}

.lw-checkbox-tick {
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  background: white;
  box-shadow: 0 3px 5px 0 rgba(37, 39, 44, 0.1);
  border-radius: 4px;
}

.lw-checkbox-tick > * {
  margin: auto;
  opacity: 0;
  transition: opacity .2s;
}

.lw-vote {
  display: -ms-flexbox;
  display: flex;
  background: white;
  border-radius: 0 0 6px 6px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  text-align: center;
}

.lw-vote-item {
  position: relative;
  margin: 0;
  border: solid #EAEAEA;
  border-width: 1px 1px 1px 0;
  -ms-flex: 0 0 20%;
  flex: 0 0 20%;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: pointer;
}

.lw-vote-item:first-child {
  border-width: 1px;
  border-radius: 0 0 0 5px;
}

.lw-vote-item:last-child {
  border-radius: 0 0 5px;
}

.lw-vote-radio {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
}

.lw-vote-radio:checked + .lw-vote-group {
  color: var(--theme-color);
}

.lw-vote-radio:checked + .lw-vote-group:before {
  opacity: 1;
}

.lw-vote-group {
  display: -ms-flexbox;
  display: flex;
  padding: 16px 3px 3px;
  -ms-flex-direction: column;
  flex-direction: column;
  transition: color .2s;
  line-height: 24px;
}

.lw-vote-group:before {
  content: '';
  position: absolute;
  top: -1px;
  left: -1px;
  right: -1px;
  height: 3px;
  background: var(--theme-color);
  opacity: 0;
  transition: opacity .2s;
}

.lw-vote-smile {
  margin-bottom: 3px;
  font-size: 30px;
}

.lw-vote-rate {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .3px;
}

.lw-rate, .lw-rate-stars {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.lw-rate-stars {
  margin-right: 5px;
}

.lw-rate-star {
  width: 10px;
  height: 10px;
  margin-right: 2px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDEwIDEwIj4gIDxwYXRoIGZpbGw9IiNGQkJGNDAiIGQ9Ik0xMCwzLjgxMDUyNjMyIEw2LjQwNSwzLjQ4NDIxMDUzIEw1LDAgTDMuNTk1LDMuNDg5NDczNjggTDAsMy44MTA1MjYzMiBMMi43Myw2LjMgTDEuOTEsMTAgTDUsOC4wMzY4NDIxMSBMOC4wOSwxMCBMNy4yNzUsNi4zIEwxMCwzLjgxMDUyNjMyIFogTTUsNy4wNTI2MzE1OCBMNSwyLjE1Nzg5NDc0IEw1Ljg1NSw0LjI4NDIxMDUzIEw4LjA0NSw0LjQ4NDIxMDUzIEw2LjM4NSw2IEw2Ljg4NSw4LjI1MjYzMTU4IEw1LDcuMDUyNjMxNTggWiIvPjwvc3ZnPg==);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: 50%;
  -ms-flex: 0 0 10px;
  flex: 0 0 10px;
}

.lw-rate-star-half {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSIxMCIgdmlld0JveD0iMCAwIDEwIDEwIj4gIDxwb2x5Z29uIGZpbGw9IiNGQkJGNDAiIHBvaW50cz0iNSA4LjAzNyA4LjA5IDEwIDcuMjcgNi4zIDEwIDMuODExIDYuNDA1IDMuNDg5IDUgMCAzLjU5NSAzLjQ4OSAwIDMuODExIDIuNzMgNi4zIDEuOTEgMTAiLz48L3N2Zz4=);
}

.lw-rate-value {
  font-size: 14px;
  color: var(--text-secondary);
}

.lw-hr {
  height: 1px;
  margin: 16px 0;
  background: var(--border-color);
}

.lw-tags {
  display: -ms-flexbox;
  display: flex;
  margin: 0 -8px -8px 0;
}

.lw-tags-item {
  margin: 0 8px 8px 0;
  padding: 5px 12px;
  background: rgba(0, 0, 0, 0.08);
  border-radius: 16px;
  color: var(--text-secondary);
}

.lw-tags-item.lw-active {
  background: var(--theme-color);
  font-weight: 600;
  color: white;
}

.lw-play {
  width: 46px;
  height: 46px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0NiIgaGVpZ2h0PSI0NiIgdmlld0JveD0iMCAwIDQ2IDQ2Ij4gIDxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik0yMyw0NiBDMTAuMjk3NDUwOCw0NiAwLDM1LjcwMjU0OTIgMCwyMyBDMCwxMC4yOTc0NTA4IDEwLjI5NzQ1MDgsMCAyMywwIEMzNS43MDI1NDkyLDAgNDYsMTAuMjk3NDUwOCA0NiwyMyBDNDYsMzUuNzAyNTQ5MiAzNS43MDI1NDkyLDQ2IDIzLDQ2IFogTTE2LjM1NTU1NTYsMTIuMjY2NjY2NyBMMTYuMzU1NTU1NiwzMy43MzMzMzMzIEwzMy43MzMzMzMzLDIzIEwxNi4zNTU1NTU2LDEyLjI2NjY2NjcgWiIvPjwvc3ZnPg==);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: 50% 50%;
}

.lw-code {
  display: inline-block;
  padding: 3px 12px;
  border: 1px dashed var(--theme-color);
  border-radius: 4px;
  font-weight: 600;
  color: var(--theme-color);
  text-transform: uppercase;
}

.lw-links {
  display: -ms-flexbox;
  display: flex;
  font-size: 14px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.lw-links-item:not(:last-child):after {
  content: '·';
  margin: 0 10px;
  color: var(--text-secondary);
}

.lw-links-el {
  color: var(--text-secondary);
  transition: color .2s;
}

.lw-links-el:hover {
  color: var(--text-primary);
}

.lw-user {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.lw-user .lw-preview {
  position: relative;
  height: 95px;
  margin-right: 15px;
  -ms-flex: 0 0 95px;
  flex: 0 0 95px;
}

.lw-user .lw-pic {
  border-radius: 50%;
}

.lw-user .lw-title {
  margin: 0;
  font-size: 16px;
}

.lw-user .lw-title + .lw-content {
  font-size: 16px;
}

.lw-user_center {
  display: block;
  margin-bottom: 30px;
  text-align: center;
}

.lw-user_center .lw-preview {
  width: 60px;
  height: 60px;
  margin: 0 auto 10px;
}

.lw-user_top {
  margin-top: -60px;
}

.lw-user-online {
  position: absolute;
  right: -1px;
  bottom: -3px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: #03CA1F;
  border: 2px solid white;
}

.lw-head {
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 30px;
  -ms-flex-align: center;
  align-items: center;
}

.lw-head .lw-preview {
  margin-right: 10px;
  height: 55px;
  width: 55px;
}

.lw-head .lw-title {
  margin: 0;
  font-size: 18px;
}

.lw-head .lw-content {
  margin-left: auto;
  padding-left: 20px;
}

.lw-foot {
  display: -ms-flexbox;
  display: flex;
  border-top: 1px solid var(--border-color);
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.lw-foot .lw-btn {
  padding: 18px 20px;
  background: none;
  border-radius: 0;
  font-weight: 400;
  color: var(--text-secondary);
}

.lw-foot .lw-btn:first-child {
  border-radius: 0 0 0 6px;
}

.lw-foot .lw-btn:last-child {
  border-radius: 0 0 6px;
}

.lw-foot .lw-btn:only-child {
  border-radius: 0 0 6px 6px;
}

.lw-foot .lw-btn:hover {
  background: rgba(0, 0, 0, 0.08);
  opacity: 1;
}

.lw-foot .lw-btn_color {
  font-weight: 600;
  color: var(--theme-color);
}

.lw-foot .lw-btn_bold {
  font-weight: 600;
  color: var(--text-primary);
}

.lw-foot .lw-form {
  width: 100%;
  background: var(--background-color);
  border-radius: 0 0 6px 6px;
  box-shadow: none;
}

.lw-foot .lw-form .lw-btn {
  padding-left: 20px;
  padding-right: 20px;
  background: none;
  font-weight: 600;
}

.lw-foot .lw-form .lw-input {
  height: 59px;
  padding: 0 20px;
}

.lw-foot .lw-content {
  padding: 20px;
  font-size: 16px;
}

.lw-foot_flex {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.lw-foot_flex .lw-btn {
  border: 0 solid var(--border-color);
  -ms-flex: 1;
  flex: 1;
}

.lw-foot_flex .lw-btn:not(:last-child) {
  border-width: 0 1px 0 0;
}

.lw-video {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  transition: opacity .2s;
}

.lw-video:hover {
  opacity: .7;
}

.lw-video .lw-preview {
  margin-right: 14px;
  -ms-flex: 0 0 40px;
  flex: 0 0 40px;
}

.lw-video .lw-title,
.lw-video .lw-content {
  font-size: 16px;
}

.lw-video .lw-title {
  margin: 0;
}

.lw-slider {
  position: relative;
  text-align: center;
  z-index: 4;
}

.lw-slide {
  display: none;
}

.lw-slide.lw-visible {
  display: block;
}

.lw-slide .lw-title {
  color: var(--theme-color);
}

.lw-dots {
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  left: 50%;
  bottom: -67px;
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
}

.lw-dot {
  padding: 3px;
  background: none;
  border: none;
}

.lw-dot.lw-active:before {
  background: var(--theme-color);
}

.lw-dot:before {
  content: '';
  display: block;
  width: 7px;
  height: 7px;
  background: rgba(0, 0, 0, 0.15);
  border-radius: 50%;
}

@keyframes lw-sidebar {
  0 {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.lw-logo {
  display: -ms-flexbox;
  display: flex;
}

.lw-logo .lw-preview {
  margin-right: 20px;
  -ms-flex: 0 0 70px;
  flex: 0 0 70px;
}

.lw-logo .lw-title {
  margin: 10px 0 0;
  font-size: 14px;
  color: var(--theme-color);
  text-transform: uppercase;
}

.lw-logo_center {
  display: block;
  text-align: center;
}

.lw-logo_center .lw-preview {
  width: 70px;
  height: 70px;
  margin: 0 auto;
}

.lw-logo_lg .lw-preview {
  width: 100px;
  height: 100px;
}

.lw-logo_simple {
  display: block;
}

.lw-logo_simple .lw-preview {
  width: 60px;
  margin: 0;
}

.lw-logo_icon .lw-preview {
  display: -ms-flexbox;
  display: flex;
  background: var(--theme-color);
  border-radius: 6px;
}

.lw-logo_icon .lw-preview i {
  margin: auto;
  font-size: 42px;
  color: white;
}

.lw-logo_top {
  margin: -55px 0 20px;
}

.lw-logo_outside {
  margin: -65px 0 20px;
}

.lw-choose .lw-group {
  border-radius: 3px;
  background: white;
}

.lw-choose .lw-group:not(:last-child) {
  margin-bottom: 12px;
}

.lw-choose .lw-btn {
  display: block;
  width: 100%;
  background: white;
  box-shadow: 0 2px 3px 0 rgba(37, 39, 44, 0.05), 0 1px 3px 0 rgba(37, 39, 44, 0.06);
  font-weight: 400;
  color: var(--text-secondary);
  text-align: left;
}

.lw-choose .lw-btn:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.lw-choose .lw-btn:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lw-choose .lw-btn:not(:last-child) {
  border-bottom: 1px solid var(--border-color);
}

.lw-choose .lw-btn:hover {
  color: var(--text-secondary);
}

.lw-choose .lw-btn.lw-active {
  font-weight: 700;
  color: var(--theme-color);
}

.lw-panel {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.lw-panel .lw-preview {
  width: 62px;
  margin-right: 20px;
  -ms-flex: 0 0 62px;
  flex: 0 0 62px;
}

.lw-panel .lw-group {
  -ms-flex: 1;
  flex: 1;
}

.lw-panel .lw-title {
  margin-bottom: 2px;
  font-size: 20px;
}

.lw-panel > .lw-btn {
  margin-left: 20px;
}

.lw-panel .lw-form {
  margin-left: 24px;
  -ms-flex: 0 0 415px;
  flex: 0 0 415px;
}

.lw-panel .lw-form .lw-input {
  border: 1px solid var(--border-color);
  box-shadow: none;
}

.lw-panel_sm .lw-preview {
  -ms-flex: 0 0 40px;
  flex: 0 0 40px;
}

.lw-panel_lg .lw-preview {
  -ms-flex: 0 0 80px;
  flex: 0 0 80px;
}

.lw-panel_center {
  padding-right: 60px;
  text-align: center;
}

.lw-panel_arrow {
  position: relative;
  padding-right: 40px;
}

.lw-panel_arrow:after {
  content: '';
  position: absolute;
  top: calc(50% - 9px);
  right: 15px;
  width: 11px;
  height: 18px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMSIgaGVpZ2h0PSIxOCIgdmlld0JveD0iMCAwIDExIDE4Ij4gIDxwb2x5Z29uIGZpbGw9IiMyRjJFMzUiIHBvaW50cz0iNTAyIDUyLjg4NSA1MDguNzk5IDQ2IDUwMiAzOS4xMTUgNTA0LjA5MyAzNyA1MTMgNDYgNTA0LjA5MyA1NSIgb3BhY2l0eT0iLjQiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC01MDIgLTM3KSIvPjwvc3ZnPg==);
  background-size: contain;
  background-repeat: no-repeat;
}

.lw-panel_video .lw-preview {
  position: relative;
  -ms-flex: 0 0 124px;
  flex: 0 0 124px;
}

.lw-panel_video .lw-pic {
  border-radius: 4px;
}

.lw-panel_video .lw-play {
  position: absolute;
  top: calc(50% - 23px);
  left: calc(50% - 23px);
}

.lw-panel_video .lw-title {
  margin-bottom: 8px;
}

.lw-panel_video .lw-font-normal {
  color: var(--text-secondary);
}

.lw-panel_video .lw-content {
  font-size: 16px;
}

.lw-field {
  position: relative;
  margin-bottom: 12px;
}

.lw-field_connected .lw-input {
  border-radius: 0;
  box-shadow: none;
  border: 1px solid var(--border-color);
}

.lw-field_connected .lw-input:first-child {
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
}

.lw-field_connected .lw-input:last-child {
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.lw-field_connected .lw-input:not(:last-child) {
  margin-bottom: -1px;
}

.lw-field_email-phone {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.lw-field_email-phone .lw-input,
.lw-field_email-phone .lw-select {
  box-shadow: none;
  border: 1px solid var(--border-color);
}

.lw-field_email-phone .lw-input:first-child {
  margin-bottom: -1px;
  border-radius: 4px 4px 0 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
}

.lw-field_email-phone .lw-input:last-child {
  margin-left: -1px;
  border-radius: 0 0 4px;
  -ms-flex: 0 0 calc(100% - 72px);
  flex: 0 0 calc(100% - 72px);
}

.lw-field_email-phone .lw-select {
  border-radius: 0 0 0 4px;
  -ms-flex: 0 0 73px;
  flex: 0 0 73px;
}

.lw-field_phone {
  display: -ms-flexbox;
  display: flex;
}

.lw-field_phone .lw-select,
.lw-field_phone .lw-input {
  box-shadow: none;
  border: 1px solid var(--border-color);
}

.lw-field_phone .lw-select {
  border-radius: 4px 0 0 4px;
  -ms-flex: 0 0 73px;
  flex: 0 0 73px;
}

.lw-field_phone .lw-input {
  margin-left: -1px;
  border-radius: 0 0 4px;
  -ms-flex: 0 0 calc(100% - 74px);
  flex: 0 0 calc(100% - 74px);
}

.lw-field_birthday .lw-group {
  display: -ms-flexbox;
  display: flex;
}

.lw-field_birthday .lw-input {
  margin-right: 10px;
  -ms-flex: 0 0 64px;
  flex: 0 0 64px;
}

.lw-label {
  margin-bottom: 7px;
  font-size: 13px;
  color: var(--text-secondary);
}

.lw-input, .lw-textarea, .lw-select {
  position: relative;
  width: 100%;
  font-size: 18px;
  border: none;
  border-radius: 4px;
  box-shadow: 0 3px 5px 0 rgba(37, 39, 44, 0.05), 0 1px 3px 0 rgba(37, 39, 44, 0.06);
}

.lw-input:focus, .lw-textarea:focus, .lw-select:focus {
  z-index: 2;
}

.lw-input, .lw-select {
  height: 46px;
  padding: 0 15px;
}

.lw-input, .lw-textarea {
  font-weight: 600;
  color: var(--text-primary);
}

.lw-input::-webkit-input-placeholder, .lw-textarea::-webkit-input-placeholder {
  font-weight: 400;
  color: rgba(0, 0, 0, 0.4);
}

.lw-input:-ms-input-placeholder, .lw-textarea:-ms-input-placeholder {
  font-weight: 400;
  color: rgba(0, 0, 0, 0.4);
}

.lw-input::placeholder, .lw-textarea::placeholder {
  font-weight: 400;
  color: rgba(0, 0, 0, 0.4);
}

.lw-input_radius {
  border-radius: 4px;
}

.lw-input_clear {
  background: none;
  border: none;
}

.lw-input_subscribe_foot {
  height: 60px;
  padding: 0 20px;
  background: none;
  border: none;
}

.lw-input_code {
  border: 1px dashed var(--text-primary);
}

.lw-textarea {
  display: block;
  height: 136px;
  padding: 10px 15px;
  resize: none;
}

.lw-select {
  background-color: white;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMCIgaGVpZ2h0PSI1IiB2aWV3Qm94PSIwIDAgMTAgNSI+ICA8cG9seWdvbiBmaWxsPSIjMUIxQjFEIiBwb2ludHM9IjQ5MyAyMiA0OTggMjcgNTAzIDIyIiBvcGFjaXR5PSIuNCIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQ5MyAtMjIpIi8+PC9zdmc+);
  background-size: 10px 5px;
  background-position: calc(100% - 15px) 50%;
  background-repeat: no-repeat;
  color: var(--text-primary);
  font-weight: 600;
  cursor: pointer;
}

.lw-icon {
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: 46px;
  height: 46px;
  opacity: .2;
  z-index: 4;
}

.lw-icon i {
  margin: auto;
}

.lw-icon + .lw-input {
  padding-left: 46px;
}

.lw-inline .lw-field {
  display: -ms-flexbox;
  display: flex;
  margin: 0;
  -ms-flex-align: center;
  align-items: center;
}

.lw-inline .lw-field:not(:last-child) {
  border-bottom: 1px solid var(--border-color);
}

.lw-inline .lw-label {
  margin: 0 20px 0 0;
  font-size: 18px;
  -ms-flex: 0 0 145px;
  flex: 0 0 145px;
}

.lw-inline .lw-group {
  -ms-flex: 0 0 calc(100% - 165px);
  flex: 0 0 calc(100% - 165px);
}

.lw-inline .lw-input,
.lw-inline .lw-textarea,
.lw-inline .lw-select {
  box-shadow: none;
}

.lw-form {
  display: -ms-flexbox;
  display: flex;
}

.lw-form .lw-field {
  margin: 0 10px 0 0;
  -ms-flex: 1;
  flex: 1;
}

.lw-form_connected {
  border-radius: 4px;
  background: white;
  box-shadow: 0 3px 5px 0 rgba(37, 39, 44, 0.05), 0 1px 3px 0 rgba(37, 39, 44, 0.06);
}

.lw-form_connected .lw-field {
  margin: 0;
}

.lw-form_connected .lw-input {
  background: none;
  box-shadow: none;
}

.lw-form_connected .lw-btn {
  position: relative;
  padding-left: 15px;
  padding-right: 15px;
  background: none;
  border-radius: 0 4px 4px 0;
  color: var(--theme-color);
}

.lw-form_connected .lw-btn:hover {
  background: rgba(0, 0, 0, 0.08);
}

.lw-form_connected .lw-btn:before {
  content: '';
  position: absolute;
  top: calc(50% - 15px);
  left: 0;
  width: 1px;
  height: 30px;
  background: var(--border-color);
}

.lw-nav-link {
  display: -ms-flexbox;
  display: flex;
  font-size: 18px;
  font-weight: 700;
  color: var(--text-primary);
  transition: color .2s, opacity .2s;
  -ms-flex-align: center;
  align-items: center;
}

.lw-nav-link:not(:last-child) {
  margin-bottom: 24px;
}

.lw-nav-link:hover {
  color: var(--text-secondary);
}

.lw-nav-link.lw-active,
.lw-nav-link.lw-active .lw-nav-icon {
  color: var(--theme-color);
}

.lw-nav-icon {
  display: -ms-flexbox;
  display: flex;
  height: 20px;
  margin-right: 20px;
  color: var(--text-secondary);
  -ms-flex: 0 0 20px;
  flex: 0 0 20px;
}

.lw-nav-icon i {
  margin: auto;
  font-size: 20px;
}

.lw-nav_lg .lw-nav-link {
  font-size: 24px;
}

.lw-nav_lg .lw-nav-link:not(:last-child) {
  margin-bottom: 16px;
}

.lw-menu {
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 32px;
  -ms-flex-align: start;
  align-items: flex-start;
  -ms-flex-direction: column;
  flex-direction: column;
}

.lw-menu .lw-link {
  font-size: 20px;
  color: var(--text-secondary);
  line-height: 1.65;
  transition: color .2s;
}

.lw-menu .lw-link:hover, .lw-menu .lw-link.lw-active {
  color: var(--theme-color);
}

.lw-posts {
  margin-bottom: 30px;
}

.lw-posts .lw-link {
  display: block;
  margin-bottom: 18px;
  color: var(--text-secondary);
}

.lw-posts .lw-link:hover {
  color: var(--text-secondary);
}

.lw-posts .lw-title {
  margin-bottom: 4px;
  font-size: 18px;
  font-weight: 600;
  color: var(--theme-color);
}

.lw-socials {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.lw-socials .lw-link {
  font-size: 0;
}

.lw-socials .lw-link:not(:last-child) {
  margin-right: 25px;
}

.lw-row {
  display: -ms-flexbox;
  display: flex;
}

.lw-row_middle {
  -ms-flex-align: center;
  align-items: center;
}

.lw-row_custom .lw-col:first-child {
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
}

.lw-row_custom .lw-col:last-child {
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
}

.lw-row_p {
  margin: 0 -10px;
  -ms-flex-align: center;
  align-items: center;
}

.lw-row_p .lw-col {
  padding: 0 10px;
}

.lw-col {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
}

.lw-col_bg {
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  border-radius: 6px 0 0 6px;
}

.lw-drop {
  position: absolute;
  right: 0;
  bottom: calc(100% + 20px);
  width: calc(100vw - 30px);
  max-width: 353px;
  visibility: hidden;
  opacity: 0;
  -ms-transform: translateY(-20px);
  transform: translateY(-20px);
  transition: opacity .2s, visibility .2s, transform .4s;
}

.lw-drop:after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 22px;
  z-index: 2;
}

.lw-drop.lw-visible {
  visibility: visible;
  opacity: 1;
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.lw-drop .lw-item {
  opacity: 1;
  -ms-transform: none;
  transform: none;
  animation: none;
}

.lw-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(77, 86, 108, 0.3);
  opacity: 0;
  transition: opacity .4s;
}

.lw-widget {
  display: none;
  position: fixed;
  right: 0;
  bottom: 0;
  max-width: 100%;
  padding: 15px;
  font-size: 18px;
  line-height: 1.3333;
  transition: background .2s .2s;
  z-index: 7777777;
}

.lw-widget_top {
  top: 0;
  bottom: auto;
}

.lw-widget_left, .lw-widget_left_middle {
  left: 0;
  right: auto;
}

.lw-widget_left_middle {
  top: calc(50% - 100px);
  bottom: auto;
}

.lw-widget_width_full {
  width: 100%;
}

.lw-widget_no_padding {
  padding: 0;
}

.lw-widget_fullscreen {
  top: 0;
  left: 0;
  overflow: auto;
}

.lw-widget_fullscreen .lw-container {
  margin: auto;
  perspective-origin: 50% 50%;
}

.lw-widget_fullscreen .lw-item {
  max-height: none;
  overflow: visible;
}

.lw-widget_top .lw-container .lw-drop {
  top: 0;
  bottom: auto;
}

.lw-widget_top .lw-container .lw-drop:before {
  top: 19px;
  bottom: auto;
  -ms-transform: rotate(-53deg);
  transform: rotate(-53deg);
}

.lw-widget_left .lw-container .lw-drop {
  left: 72px;
  right: auto;
}

.lw-widget_left .lw-container .lw-drop:before {
  left: -20px;
  right: auto;
  bottom: 18px;
  -ms-transform: rotate(-233deg);
  transform: rotate(-233deg);
}

.lw-widget_left .lw-container .lw-drop:after {
  left: -12px;
  right: 100%;
}

.lw-widget_mat {
  background: var(--background-mat);
}

.lw-widget_mat .lw-container {
  width: 100%;
  max-width: 100%;
  height: 100%;
}

.lw-widget_mat .lw-item {
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100%;
  max-height: 100%;
  background: var(--background-mat);
  border-radius: 0;
  box-shadow: none;
}

.lw-widget_mat .lw-close {
  top: 20px;
  right: 20px;
}

.lw-widget_mat .lw-wrap {
  max-width: 543px;
  margin: auto;
}

.lw-widget_sidebar {
  padding: 0;
}

.lw-widget_sidebar .lw-item {
  height: 100vh;
  max-height: 100%;
  border-radius: 0;
  transform: translate3d(100%, 0, 0);
}

.lw-widget_sidebar .lw-item.lw-animate {
  animation: lw-sidebar .4s ease-out forwards;
}

.lw-widget_sidebar .lw-item.lw-animate-reverse {
  animation: lw-sidebar .4s ease-out forwards alternate-reverse;
}

.lw-widget.lw-open {
  display: -ms-flexbox;
  display: flex;
}

.lw-widget.lw-animate .lw-overlay {
  opacity: 1;
}

.lw-container {
  width: 100vw;
  max-width: 353px;
  perspective: 100px;
  perspective-origin: 50% 100%;
}

.lw-container_lg {
  max-width: 737px;
}

.lw-container_md {
  max-width: 543px;
}

.lw-container_custom {
  max-width: 386px;
}

.lw-container_sidebar {
  max-width: 280px;
}

.lw-container_sm {
  max-width: 256px;
}

.lw-container_width_auto {
  width: auto;
  max-width: none;
}

.lw-container_width_full {
  width: 100%;
  max-width: 100%;
}

.lw-container_center {
  margin: auto;
}

.lw-container_center_bottom {
  max-width: 1112px;
  margin: auto auto 0;
}

.lw-container_opinion {
  max-width: 346px;
}

.lw-container_tools {
  max-width: 70px;
}

.lw-container_app {
  max-width: 60px;
}

.lw-container_circle .lw-item {
  max-height: calc(100vh - 110px);
}

.lw-container_app > .lw-item {
  max-height: none;
  background: none;
  border-radius: 10px;
  overflow: visible;
}

.lw-container_app .lw-drop {
  right: 72px;
  bottom: 0;
  z-index: 4;
}

.lw-container_app .lw-drop:before {
  content: '';
  position: absolute;
  right: -20px;
  bottom: 16px;
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 0 17px 13px 17px;
  border-color: transparent transparent white transparent;
  -ms-transform: rotate(-130deg);
  transform: rotate(-130deg);
  z-index: 1;
}

.lw-container_app .lw-drop:after {
  top: 0;
  left: 100%;
  bottom: 0;
  right: -12px;
  height: auto;
}

.lw-container_app .lw-btn {
  position: relative;
  z-index: 2;
}

.lw-container_tools .lw-item {
  overflow: visible;
}

.lw-item {
  position: relative;
  max-height: calc(100vh - 64px);
  background: white;
  box-shadow: 0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12);
  border-radius: 6px;
  opacity: 0;
  transform: translate3d(0, 0, -100px);
  overflow: auto;
}

.lw-item_border {
  border-top: 3px solid var(--theme-color);
  border-radius: 3px 3px 6px 6px;
}

.lw-item_shadow_1 {
  box-shadow: 0 4px 24px 0 rgba(37, 38, 94, 0.1);
}

.lw-item_shadow_2 {
  box-shadow: 0 4px 15px 0 rgba(47, 46, 53, 0.15), 0 1px 2px 0 rgba(47, 46, 53, 0.01), 0 2px 3px 1px rgba(47, 46, 53, 0.05);
}

.lw-item_shadow_3 {
  box-shadow: 0 0 1px 0 rgba(71, 75, 86, 0.31), 0 20px 32px 0 rgba(71, 75, 86, 0.15);
}

.lw-item_shadow_4 {
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.05), 0 2px 10px 0 rgba(0, 0, 0, 0.14), 0 10px 26px 0 rgba(47, 46, 53, 0.3);
}

.lw-item_no_shadow {
  box-shadow: none;
}

.lw-item_no_radius {
  border-radius: 0;
}

.lw-item + .lw-item {
  margin-top: 20px;
}

.lw-item.lw-animate {
  animation: lw-bounce .4s ease-out forwards;
}

.lw-item.lw-animate-reverse {
  animation: lw-bounce .4s ease-out forwards alternate-reverse;
}

.lw-item.lw-visible {
  opacity: 1;
  animation: none;
  -ms-transform: none;
  transform: none;
}

.lw-item_bg {
  background: var(--background-color);
}

.lw-item_bg .lw-online {
  border-color: var(--background-color);
}

.lw-item_bg_image {
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}

.lw-item_bg_image .lw-foot,
.lw-item_bg_image .lw-bb {
  border-color: rgba(255, 255, 255, 0.2);
}

.lw-item_white {
  color: white;
}

.lw-item_white .lw-foot .lw-btn,
.lw-item_white .lw-btn_simple,
.lw-item_white .lw-content,
.lw-item_white .lw-title,
.lw-item_white .lw-content,
.lw-item_white .lw-video {
  color: white;
}

.lw-item_white .lw-foot .lw-btn:hover,
.lw-item_white .lw-btn_simple:hover,
.lw-item_white .lw-content:hover,
.lw-item_white .lw-title:hover,
.lw-item_white .lw-content:hover,
.lw-item_white .lw-video:hover {
  color: white;
}

.lw-item_white .lw-content a {
  border-color: white;
  color: white;
}

.lw-item_white .lw-content a:hover {
  border-color: transparent;
}

.lw-item_white .lw-pic {
  fill: white;
}

.lw-item:hover .lw-close {
  opacity: .7;
}

.lw-item:hover .lw-close:hover {
  opacity: 1;
}

.lw-item:hover .lw-close_circle {
  opacity: 1;
}

.lw-item:hover .lw-drop_hover {
  opacity: 1;
  visibility: visible;
  -ms-transform: translateY(0);
  transform: translateY(0);
}

.lw-hide {
  max-height: 0;
  opacity: 0;
  transition: max-height .6s, opacity .6s;
  overflow: hidden;
}

.lw-hide .lw-wrap {
  padding-top: 0;
}

.lw-hide .lw-btn {
  transform: translate3d(0, 0, 0);
}

.lw-item:hover .lw-hide {
  max-height: 500px;
  opacity: 1;
}

@keyframes lw-bounce {
  0 {
    opacity: 0;
    transform: translate3d(0, 0, -100px);
  }
  50% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
  60% {
    opacity: 1;
    transform: translate3d(0, 0, 2px);
  }
  70%,
  100% {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.lw-tutorial {
  padding-top: 5px;
}

.lw-tutorial .lw-title,
.lw-tutorial .lw-content {
  margin-bottom: 25px;
}

.lw-tutorial .lw-link {
  font-size: 14px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--theme-color);
}

.lw-discount {
  padding: 30px;
}

.lw-discount .lw-col:first-child {
  -ms-flex: 0 0 40%;
  flex: 0 0 40%;
}

.lw-discount .lw-col:last-child {
  text-align: center;
  -ms-flex: 0 0 60%;
  flex: 0 0 60%;
}

.lw-discount .lw-preview {
  padding-right: 30px;
}

.lw-discount .lw-pic {
  margin: auto;
}

.lw-discount .lw-content {
  margin-bottom: 20px;
}

.lw-discount .lw-input {
  text-align: center;
}

.lw-discount .lw-btn {
  width: 100%;
}

.lw-product {
  display: -ms-flexbox;
  display: flex;
}

.lw-product .lw-preview {
  width: 120px;
  margin-right: 20px;
  -ms-flex: 0 0 120px;
  flex: 0 0 120px;
}

.lw-product .lw-pic {
  border-radius: 0;
}

.lw-product .lw-group {
  max-width: calc(100% - 80px);
}

.lw-price {
  margin-left: auto;
  padding: 1px 0 0 20px;
}

.lw-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.lw-actions .lw-content {
  margin-right: auto;
  padding-right: 16px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
}

.lw-actions_equal {
  margin: 0 -10px;
}

.lw-actions_equal .lw-btn {
  margin: 0 10px;
  -ms-flex: 1;
  flex: 1;
}

.lw-checkout {
  display: -ms-flexbox;
  display: flex;
  min-height: 100%;
  -ms-flex-direction: column;
  flex-direction: column;
}

.lw-checkout .lw-wrap {
  padding: 40px 50px;
}

.lw-checkout .lw-wrap:last-child {
  display: -ms-flexbox;
  display: flex;
  padding: 20px 50px;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.lw-checkout .lw-row {
  margin: 0 -6px;
}

.lw-checkout .lw-col {
  padding: 0 6px;
}

.lw-checkout .lw-col .lw-content {
  padding-top: 5px;
  text-align: right;
}

.lw-checkout .lw-title {
  font-size: 20px;
}

.lw-checkout .lw-content {
  font-size: 14px;
}

.lw-checkout .lw-checkbox {
  font-size: 16px;
  color: var(--text-secondary);
}

.lw-coupon {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.lw-coupon .lw-title {
  margin: 0 12px 0 0;
  font-size: 18px;
  text-transform: uppercase;
}

.lw-bar {
  text-align: center;
}

.lw-bar .lw-title {
  margin: 0 30px 0 0;
}

.lw-bar .lw-actions {
  margin-left: auto;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.lw-bar .lw-btn {
  margin-left: 10px;
}

.lw-bar_flex {
  display: -ms-flexbox;
  display: flex;
  text-align: left;
  -ms-flex-align: center;
  align-items: center;
}

.lw-guide .lw-row {
  margin-bottom: 20px;
}

.lw-mw {
  max-width: 460px;
  margin: 0 auto;
}

.lw-ma {
  margin: auto;
}

.lw-mr-a {
  margin-right: auto;
}

.lw-ml-a {
  margin-left: auto;
}

.lw-mb {
  margin-bottom: 20px;
}

.lw-mb-xs {
  margin-bottom: 8px;
}

.lw-mb-sm {
  margin-bottom: 16px;
}

.lw-mb-md {
  margin-bottom: 30px;
}

.lw-mb-lg {
  margin-bottom: 40px;
}

.lw-mt {
  margin-top: 20px;
}

.lw-mt-xs {
  margin-top: 8px;
}

.lw-mt-sm {
  margin-top: 16px;
}

.lw-mt-md {
  margin-top: 30px;
}

.lw-mt-lg {
  margin-top: 40px;
}

.lw-p {
  padding: 30px;
}

.lw-p-b {
  padding-bottom: 30px;
}

.lw-p-y {
  padding-top: 30px;
  padding-bottom: 30px;
}

.lw-p-y-sm {
  padding-top: 15px;
  padding-bottom: 15px;
}

.lw-p-x {
  padding-left: 30px;
  padding-right: 30px;
}

.lw-p-x-2 {
  padding-left: 60px;
  padding-right: 60px;
}

.lw-p-sm {
  padding: 15px;
}

.lw-p-lg {
  padding: 45px;
}

.lw-pr {
  padding-right: 30px;
}

.lw-pl {
  padding-left: 30px;
}

.lw-bg-white {
  background: white;
}

.lw-bt {
  border-top: 1px solid var(--border-color);
}

.lw-bb {
  border-bottom: 1px solid var(--border-color);
}

.lw-font-normal {
  font-weight: 400;
}

.lw-font-uppercase {
  text-transform: uppercase;
}

@media only screen and (max-width: 1023px){
  .lw-close{
    opacity: 1;
  }
  .lw-tablet-hide {
    display: none !important;
  }
}

@media only screen and (max-width: 767px){
  .lw-btn-answer{
    display: block;
  }
  .lw-btn_flex{
    display: block;
    text-align: left;
  }
  .lw-preview_custom{
    height: 276px;
    margin-bottom: 20px;
    padding: 0;
  }
  .lw-preview_custom .lw-pic{
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
  .lw-preview_contain .lw-pic{
    object-fit: contain;
  }
  .lw-vote-item{
    margin-top: -1px;
    -ms-flex: 0 0 33.33%;
    flex: 0 0 33.33%;
  }
  .lw-vote-item:nth-child(3n){
    -ms-flex: 0 0 33.34%;
    flex: 0 0 33.34%;
  }
  .lw-foot_flex .lw-btn:not(:last-child){
    border-width: 0 0 1px;
  }
  .lw-foot_flex .lw-btn{
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
  }
  .lw-foot_flex .lw-btn, .lw-foot_flex .lw-btn:first-child{
    border-radius: 0;
  }
  .lw-foot_flex .lw-btn:last-child{
    border-radius: 0 0 6px 6px;
  }
  .lw-slider{
    padding: 0;
  }
  .lw-dots{
    position: static;
    margin: 16px 0 -8px;
    -ms-transform: none;
    transform: none;
  }
  .lw-panel{
    display: block;
  }
  .lw-panel .lw-preview{
    margin: 0 20px 20px 0;
  }
  .lw-panel > .lw-btn{
    margin: 16px 0 0;
  }
  .lw-panel .lw-form{
    margin: 20px 0 0;
  }
  .lw-panel_center{
    display: -ms-flexbox;
    display: flex;
  }
  .lw-panel_center .lw-preview{
    margin-bottom: 0;
  }
  .lw-panel_arrow{
    padding-right: 50px;
  }
  .lw-panel_arrow:before{
    content: '';
    position: absolute;
    top: -20px;
    right: 39px;
    bottom: -20px;
    width: 1px;
    background: var(--border-color);
  }
  .lw-panel_arrow:after{
    right: 5px;
  }
  .lw-inline .lw-field:not(:last-child){
    margin-bottom: 16px;
    border: none;
  }
  .lw-inline .lw-field{
    display: block;
  }
  .lw-inline .lw-label{
    margin: 0 0 4px;
  }
  .lw-inline .lw-input,
  .lw-inline .lw-textarea,
  .lw-inline .lw-select{
    border: 1px solid var(--border-color);
  }
  .lw-form{
    display: block;
  }
  .lw-form .lw-field{
    margin: 0 0 12px;
  }
  .lw-form .lw-btn{
    width: 100%;
  }
  .lw-form_connected .lw-field{
    margin: 0;
  }
  .lw-form_connected .lw-input{
    text-align: center;
  }
  .lw-form_connected .lw-btn{
    border-radius: 0 0 4px 4px;
    border-top: 1px solid var(--border-color);
  }
  .lw-row{
    display: block;
  }
  .lw-col_bg{
    height: 200px;
    border-radius: 6px 6px 0 0;
  }
  .lw-widget{
    width: 100%;
    height: 100%;
    padding: 10px;
    overflow: auto;
  }
  .lw-widget_left_middle{
    top: 0;
  }
  .lw-widget_no_padding{
    padding: 0;
  }
  .lw-widget_left_middle .lw-container{
    width: auto;
    margin: auto auto auto 0;
  }
  .lw-widget_fullscreen .lw-container{
    margin: auto auto 0;
  }
  .lw-widget_top .lw-container{
    margin-top: 0;
    margin-bottom: auto;
  }
  .lw-widget_left .lw-container{
    margin-left: 0;
    margin-right: auto;
  }
  .lw-widget_mat .lw-close{
    top: 10px;
    right: 10px;
  }
  .lw-widget_sidebar{
    padding: 0;
  }
  .lw-widget_sidebar .lw-item{
    height: auto;
    min-height: 100vh;
    max-height: none;
  }
  .lw-container{
    max-width: 100%;
    margin: auto auto 0;
  }
  .lw-container_sidebar{
    max-width: 280px;
    margin: 0 0 0 auto;
  }
  .lw-container_sm{
    max-width: calc(100vw - 20px);
  }
  .lw-container_width_auto{
    width: 100%;
  }
  .lw-container_tools{
    max-width: 70px;
    margin: auto 0 0 auto;
  }
  .lw-container_app{
    max-width: 60px;
    margin: auto 0 0 auto;
  }
  .lw-container_circle{
    width: auto;
    margin: auto 0 0 auto;
  }
  .lw-container_app .lw-drop{
    max-width: calc(100vw - 92px);
  }
  .lw-item{
    max-height: none;
    overflow: visible;
  }
  .lw-product{
    display: block;
  }
  .lw-product .lw-preview{
    margin-bottom: 20px;
  }
  .lw-product .lw-group{
    max-width: 100%;
  }
  .lw-product_cart{
    text-align: center;
  }
  .lw-product_cart .lw-preview{
    margin: 0 auto 20px;
  }
  .lw-price{
    margin: 12px 0 0;
    padding: 0;
  }
  .lw-actions{
    display: block;
  }
  .lw-actions .lw-content{
    margin: 0 0 16px;
    padding: 0;
    text-align: center;
  }
  .lw-actions .lw-btn{
    width: 100%;
    margin: 0;
  }
  .lw-actions .lw-btn:not(:last-child){
    margin-bottom: 12px;
  }
  .lw-actions_equal{
    margin: 0;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .lw-checkout .lw-wrap{
    padding: 20px;
  }
  .lw-checkout .lw-wrap:last-child{
    padding: 20px;
    -ms-flex-direction: column;
    flex-direction: column;
  }
  .lw-checkout .lw-btn{
    width: 100%;
  }
  .lw-checkout .lw-btn:first-child{
    margin-top: 20px;
    -ms-flex-order: 2;
    order: 2;
  }
  .lw-checkout .lw-btn:last-child{
    -ms-flex-order: 1;
    order: 1;
  }
  .lw-checkout .lw-col .lw-content{
    margin: -8px 0 16px;
    text-align: left;
  }
  .lw-coupon{
    display: block;
    text-align: center;
  }
  .lw-coupon .lw-title{
    margin: 0 0 12px;
  }
  .lw-bar .lw-title{
    margin: 0;
  }
  .lw-bar .lw-actions{
    margin-top: 20px;
  }
  .lw-bar .lw-btn{
    width: 100%;
    margin: 0;
  }
  .lw-bar_flex{
    display: block;
  }
  .lw-guide .lw-col{
    margin-bottom: 32px;
  }
  .lw-guide .lw-actions{
    display: block;
  }
  .lw-guide .lw-btn:last-child{
    margin-top: 12px;
  }
  .lw-mb-lg{
    margin-bottom: 20px;
  }
  .lw-mt-lg{
    margin-top: 20px;
  }
  .lw-p{
    padding: 20px;
  }
  .lw-p-y-sm{
    padding-top: 20px;
    padding-bottom: 20px;
  }
  .lw-p-x{
    padding-left: 20px;
    padding-right: 20px;
  }
  .lw-p-x-2{
    padding-left: 20px;
    padding-right: 20px;
  }
  .lw-p-sm{
    padding: 20px;
  }
  .lw-p-lg{
    padding: 20px;
  }
  .lw-pr{
    padding-right: 20px;
  }
  .lw-pl{
    padding-right: 20px;
  }
  .lw-mobile-hide {
    display: none !important;
  }
}