@charset "UTF-8";

/*
 * Theme Name: Vikinger - BuddyPress Social Community
 * Theme URI: https://odindesignthemes.com/vikinger-theme/
 * Author: Odin Design Themes
 * Author URI: https://themeforest.net/user/odin_design
 * Description: The next generation WordPress+Buddypress social community! We carefully designed this theme for you to have all you need to build an incredible community with full profiles, reactions, groups, badges, quests, ranks, credits and much more to come!
 * Version: 1.9.31
 * License: https://themeforest.net/licenses/
 * License URI: https://themeforest.net/licenses/
 * Text Domain: vikinger
*/
/*------------
    RESET
------------*/
/*------------------------------------------------------------------
[Table of contents]

1. RESET
-------------------------------------------------------------------*/
/*------------------
    1. RESET
------------------*/
*,
*::before,
*::after {
  margin: 0;
  padding: 0;
  border: none;
  outline: none;
  box-sizing: border-box;
}

*::before,
*::after {
  display: block;
}

ul,
ol {
  list-style: none;
}

a {
  text-decoration: none;
}

select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

/*-------------
    GENERAL
-------------*/
/*------------------------------------------------------------------
[Table of contents]

1. FONTS
2. WEIGHTS
3. SIZES
4. PARAGRAPH
5. MIXINS
-------------------------------------------------------------------*/
/*-----------------
    1. FONTS
-----------------*/
/*-----------------
    2. WEIGHTS
-----------------*/
/*-----------------
    3. SIZES
-----------------*/
/*-----------------
    4. PARAGRAPH
-----------------*/
/*-----------------
    5. MIXINS
-----------------*/
/*------------------------------------------------------------------
[Table of contents]

1. RAW COLORS
2. SOCIAL COLORS
-------------------------------------------------------------------*/
/*---------------------
    1. RAW COLORS
---------------------*/
/*-----------------------
    1. SOCIAL COLORS
-----------------------*/
/*------------------------------------------------------------------
[Table of contents]

1. THEME COLORS
    1.1 PRIMARY COLORS
    1.2 SECONDARY COLORS
    1.3 TERTIARY COLORS
2. GENERAL COLORS
    2.1 BODY COLORS
    2.2 BOX COLORS
    2.3 TEXT COLORS
    2.4 TEXT SELECTION COLORS
    2.5 LINK COLORS
    2.6 ICON COLORS
    2.7 BORDER COLORS
    2.8 SHADOW COLORS
    2.9 INPUT COLORS
    2.10 BUTTON COLORS
    2.11 PAGE LOADER
    2.12 LOADER BAR
3. COMPONENT COLORS
    3.0 TAB SWITCH
    3.1 FORM SWITCH
    3.2 USER STATUS
    3.3 VIDEO STATUS
    3.4 SECTION MENU
    3.5 CHAT WIDGET
    3.6 NAVIGATION WIDGET
    3.7 XM TOOLTIP TEXT
    3.8 DROPDOWN LIST ITEM
    3.9 PICTURE ITEM
    3.10 TEXT STICKER
    3.11 TAG STICKER
    3.12 DATE STICKER
    3.13 FORUM POST
    3.14 ALBUM PREVIEW
    3.15 PICTURE COLLAGE
    3.16 STATUS COLORS
    3.17 PATTERN COLORS
    3.18 ACCOUNT STAT COLORS
    3.19 STAT COLORS
    3.20 ACTIVITY COLORS
    3.21 CATEGORY COLORS
    3.22 REFERENCE BULLET COLORS
-------------------------------------------------------------------*/
/*-------------------------------------------------------------------
                        1. THEME COLORS
-------------------------------------------------------------------*/
/*-------------------------
    1.1 PRIMARY COLORS
-------------------------*/
/*---------------------------
    1.2 SECONDARY COLORS
---------------------------*/
/*---------------------------
    1.3 TERTIARY COLORS
---------------------------*/
/*-------------------------------------------------------------------
                        2. GENERAL COLORS
-------------------------------------------------------------------*/
/*-----------------------
    2.1 BODY COLORS
-----------------------*/
/*-----------------------
    2.2 BOX COLORS
-----------------------*/
/*-----------------------
    2.3 TEXT COLORS
-----------------------*/
/*-------------------------------
    2.4 TEXT SELECTION COLORS
-------------------------------*/
/*--------------------------
    2.5 LINK COLORS
--------------------------*/
/*-----------------------
    2.6 ICON COLORS
-----------------------*/
/*-----------------------
    2.7 BORDER COLORS
-----------------------*/
/*-----------------------
    2.8 SHADOW COLORS
-----------------------*/
/*-----------------------
    2.9 INPUT COLORS
-----------------------*/
/*------------------------------
    2.10 BUTTON
------------------------------*/
/*-------------------------------------------------------------------
                        3. COMPONENT COLORS
-------------------------------------------------------------------*/
/*---------------------------
    3.0 TAB SWITCH
---------------------------*/
/*---------------------------
    3.1 FORM SWITCH
---------------------------*/
/*-----------------------
    3.3 VIDEO STATUS
-----------------------*/
/*-------------------------
    3.4 SECTION MENU
-------------------------*/
/*-------------------------
    3.5 CHAT WIDGET
-------------------------*/
/*---------------------------
    3.6 NAVIGATION WIDGET
---------------------------*/
/*---------------------------
    3.7 XM TOOLTIP TEXT
---------------------------*/
/*---------------------------
    3.8 DROPDOWN LIST ITEM
---------------------------*/
/*---------------------------
    3.9 PICTURE ITEM
---------------------------*/
/*---------------------------
    3.10 TEXT STICKER
---------------------------*/
/*---------------------------
    3.12 DATE STICKER
---------------------------*/
/*-------------------------------
    3.13 FORUM POST
-------------------------------*/
/*------------------------------
    3.14 ALBUM PREVIEW
------------------------------*/
/*------------------------------
    3.15 PICTURE COLLAGE
------------------------------*/
/*-------------------------
    3.16 STATUS COLORS
-------------------------*/
/*-------------------------
    3.17 PATTERN COLORS
-------------------------*/
/*-----------------------------
    3.18 ACCOUNT STAT COLORS
-----------------------------*/
/*-----------------------
    3.19 STAT COLORS
-----------------------*/
/*--------------------------
    3.20 ACTIVITY COLORS
--------------------------*/
/*--------------------------
    3.21 CATEGORY COLORS
--------------------------*/
/*------------------------------------
    3.22 REFERENCE BULLET COLORS
------------------------------------*/
/*------------------------------------------------------------------
[Table of contents]

1. GENERAL
2. .form
3. .form-row
4. .form-item
6. .form-input
7. .form-title
8. .form-textarea
9. .form-select
11. .checkbox-wrap
14. .interactive-input
19. .form-switch
-------------------------------------------------------------------*/
/*-----------------
    1. GENERAL
-----------------*/
label,
input,
textarea,
select,
button {
  font-family: var(--font-primary);
}

label {
  display: block;
  margin: 0;
  color: var(--color-text);
  line-height: 1em;
}

label.label-disabled {
  opacity: .5;
}

label .label-required {
  color: var(--color-secondary);
  font-weight: 700;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"],
textarea,
select,
button {
  width: 100%;
  border-radius: 12px;
  font-size: 1rem;
  font-weight: 700;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"],
textarea,
select {
  background-color: var(--color-box-background);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  transition: border-color .2s ease-in-out;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="search"]:focus,
input[type="number"]:focus,
textarea:focus,
select:focus {
  border-color: var(--color-secondary);
}

input[type="text"].input-error,
input[type="password"].input-error,
input[type="email"].input-error,
input[type="tel"].input-error,
input[type="search"].input-error,
input[type="number"].input-error,
textarea.input-error,
select.input-error {
  border-color: #f9515c;
}

input[type="text"].input-disabled,
input[type="password"].input-disabled,
input[type="email"].input-disabled,
input[type="tel"].input-disabled,
input[type="search"].input-disabled,
input[type="number"].input-disabled,
textarea.input-disabled,
select.input-disabled {
  opacity: .5;
}

input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"] {
  height: 54px;
  padding: 0 18px;
}

input[type="text"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder,
input[type="search"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 500;
}

input[type="text"]::-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="email"]::-moz-placeholder,
input[type="tel"]::-moz-placeholder,
input[type="search"]::-moz-placeholder,
input[type="number"]::-moz-placeholder {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 500;
}

input[type="text"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder,
input[type="tel"]:-ms-input-placeholder,
input[type="search"]:-ms-input-placeholder,
input[type="number"]:-ms-input-placeholder {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 500;
}

input[type="text"]::-ms-input-placeholder,
input[type="password"]::-ms-input-placeholder,
input[type="email"]::-ms-input-placeholder,
input[type="tel"]::-ms-input-placeholder,
input[type="search"]::-ms-input-placeholder,
input[type="number"]::-ms-input-placeholder {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 500;
}

input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="email"]::placeholder,
input[type="tel"]::placeholder,
input[type="search"]::placeholder,
input[type="number"]::placeholder {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 500;
}

textarea {
  padding: 14px 18px;
  resize: none;
  word-break: break-all;
}

textarea::-webkit-input-placeholder {
  color: var(--color-text-alt-2);
  font-weight: 600;
}

textarea::-moz-placeholder {
  color: var(--color-text-alt-2);
  font-weight: 600;
}

textarea:-ms-input-placeholder {
  color: var(--color-text-alt-2);
  font-weight: 600;
}

textarea::-ms-input-placeholder {
  color: var(--color-text-alt-2);
  font-weight: 600;
}

textarea::placeholder {
  color: var(--color-text-alt-2);
  font-weight: 600;
}

.vk-form-counter {
  width: 100%;
  height: 48px;
  position: relative;
}

.vk-form-counter .vk-form-counter-input {
  width: 100%;
  height: 100%;
  padding: 0 48px 0 18px;
}

.vk-form-counter .vk-form-counter-control {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  width: 48px;
  height: 24px;
  position: absolute;
  right: 0;
  cursor: pointer;
}

.vk-form-counter .vk-form-counter-control .vk-form-counter-icon {
  fill: var(--color-icon-highlighted);
}

.vk-form-counter .vk-form-counter-control.vk-form-counter-control-increase {
  top: 0;
  padding-top: 11px;
}

.vk-form-counter .vk-form-counter-control.vk-form-counter-control-increase .vk-form-counter-icon {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.vk-form-counter .vk-form-counter-control.vk-form-counter-control-decrease {
  -ms-flex-align: end;
  align-items: flex-end;
  bottom: 0;
  padding-bottom: 11px;
}

.vk-form-counter .vk-form-counter-control.vk-form-counter-control-decrease .vk-form-counter-icon {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

/*--------------
    2. FORM
--------------*/
.form {
  width: 100%;
}

.form.disabled {
  opacity: .5;
}

.form+.button {
  margin-top: 40px;
}

.form.padded {
  padding: 0 28px;
}

.form.form-error input[type="text"],
.form.form-error input[type="password"] {
  border: 1px solid #f9515c;
}

.form.form-error .form-input.dark input[type="text"],
.form.form-error .form-input.dark input[type="password"] {
  border: 1px solid #f9515c;
}

/*------------------
    3. FORM ROW
------------------*/
.form-row {
  width: 100%;
}

.form-row+.form-row {
  margin-top: 28px;
}

.form-row.space-between {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
}

.form-row.space-between .form-item {
  width: auto;
}

.form-row.split {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.form-row.split .form-item {
  margin-right: 16px;
}

.form-row.split .form-item:last-child {
  margin-right: 0;
}

.form-row.split .form-item>* {
  margin-bottom: 28px;
}

.form-row.split .form-item>*:last-child {
  margin-bottom: 0;
}

/*------------------
    4. FORM ITEM
------------------*/
.form-item {
  width: 100%;
  position: relative;
}

.form-item.auto-width {
  width: auto;
}

.form-item.centered {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.form-item.aligned-right {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.form-item.split {
  display: -ms-flexbox;
  display: flex;
}

.form-item.split.medium>* {
  margin-right: 16px;
}

.form-item.split.medium>*:last-child {
  margin-right: 0;
}

.form-item.split>* {
  width: 100%;
  margin-right: 12px;
}

.form-item.split>*:last-child {
  margin-right: 0;
}

/*-------------------
    6. FORM INPUT
-------------------*/
.form-input {
  position: relative;
}

.form-input.with-button input {
  padding-right: 82px;
}

.form-input.dark input[type="text"],
.form-input.dark input[type="password"],
.form-input.dark textarea {
  border: none;
  background-color: var(--color-header-input-background);
  color: var(--color-header-text);
}

.form-input.dark input[type="text"]::-webkit-input-placeholder,
.form-input.dark input[type="password"]::-webkit-input-placeholder,
.form-input.dark textarea::-webkit-input-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.form-input.dark input[type="text"]::-moz-placeholder,
.form-input.dark input[type="password"]::-moz-placeholder,
.form-input.dark textarea::-moz-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.form-input.dark input[type="text"]:-ms-input-placeholder,
.form-input.dark input[type="password"]:-ms-input-placeholder,
.form-input.dark textarea:-ms-input-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.form-input.dark input[type="text"]::-ms-input-placeholder,
.form-input.dark input[type="password"]::-ms-input-placeholder,
.form-input.dark textarea::-ms-input-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.form-input.dark input[type="text"]::placeholder,
.form-input.dark input[type="password"]::placeholder,
.form-input.dark textarea::placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.form-input.social-input .social-link {
  position: absolute;
  top: 4px;
  left: 4px;
  pointer-events: none;
}

.form-input.social-input input {
  padding-left: 64px;
}

.form-input.social-input label {
  left: 64px;
}

.form-input.social-input.active label {
  left: 58px;
}

.form-input.currency-decorated::before {
  content: '$';
  color: var(--color-primary-dark);
  font-size: 0.875rem;
  font-weight: 700;
  position: absolute;
  top: 12px;
  left: 22px;
  pointer-events: none;
}

.form-input.currency-decorated input {
  padding-left: 32px;
}

.form-input.required input,
.form-input.required textarea {
  border-color: var(--color-tertiary);
}

.form-input.small label,
.form-input.small input,
.form-input.small textarea {
  font-size: 0.875rem;
}

.form-input.small label {
  top: 16px;
}

.form-input.small input {
  height: 48px;
}

.form-input.small textarea {
  height: 100px;
}

.form-input.small button {
  width: 64px;
  position: absolute;
  top: 0;
  right: 0;
}

.form-input.full {
  height: 100%;
}

.form-input.full textarea {
  height: 100%;
}

.form-input.mid-textarea textarea {
  height: 124px;
}

.form-input.medium-textarea textarea {
  height: 160px;
}

.form-input.active label,
.form-input.active legend {
  background-color: var(--color-box-background);
  padding: 0 6px;
  font-size: 0.75rem;
  top: -6px;
  left: 12px;
}

.form-input label,
.form-input legend {
  color: var(--color-text-alt-2);
  font-size: 1rem;
  font-weight: 600;
  line-height: 1em;
  position: absolute;
  top: 20px;
  left: 20px;
  z-index: 2;
  transition: all .3s ease-in-out;
  pointer-events: none;
}

/*-------------------
    7. FORM TITLE
-------------------*/
.form-title {
  font-size: 0.875rem;
  font-weight: 700;
}

/*----------------------
    8. FORM TEXTAREA
----------------------*/
.form-textarea {
  position: relative;
}

.form-textarea.small label {
  font-size: 0.875rem;
  top: 16px;
  left: 20px;
}

.form-textarea.small textarea {
  padding: 14px 18px;
}

.form-textarea.small.active label {
  top: -6px;
  left: 12px;
}

.form-textarea label {
  color: var(--color-text-alt-2);
  font-size: 1rem;
  font-weight: 600;
  position: absolute;
  top: 26px;
  left: 28px;
  z-index: 2;
  transition: all .3s ease-in-out;
  pointer-events: none;
}

.form-textarea textarea {
  font-size: 0.875rem;
  padding: 26px 28px 0;
  overflow: hidden;
}

.form-textarea.active label {
  background-color: var(--color-box-background);
  padding: 0 6px;
  font-size: 0.75rem;
  top: -6px;
  left: 20px;
}

.form-textarea-shadow {
  width: 100%;
  height: 100%;
  padding: 26px 28px 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 18px;
  word-break: break-all;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  visibility: hidden;
}

.form-textarea-shadow.small {
  padding: 14px 18px;
}

.form-textarea-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.form-textarea-footer .button {
  padding: 0 30px;
}

.form-textarea-limit {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  height: 40px;
}

.form-textarea-limit.small {
  height: 20px;
}

.form-textarea-limit.small .form-textarea-limit-text {
  margin-top: 4px;
  padding: 0 18px;
}

.form-textarea-limit .form-textarea-limit-text {
  margin-top: 10px;
  padding: 0 28px;
  font-size: 0.75rem;
  font-weight: 500;
  opacity: .6;
}

/*----------------------
    9. FORM SELECT
----------------------*/
.form-select-wrap {
  display: -ms-flexbox;
  display: flex;
}

.form-select-wrap .form-select {
  margin-right: 12px;
}

.form-select-wrap .form-select:last-child {
  margin-right: 0;
}

.form-select {
  width: 100%;
  height: 48px;
  position: relative;
}

.form-select.v2 {
  width: auto;
  height: auto;
}

.form-select.v2 select {
  width: auto;
  height: auto;
  padding-right: 20px;
  border: none;
  font-size: 0.75rem;
}

.form-select.v2 .form-select-icon {
  top: 10px;
  right: 0;
}

.form-select select {
  width: 100%;
  height: 100%;
  padding: 0 40px 0 20px;
  font-size: 0.875rem;
  cursor: pointer;
}

.form-select .form-select-icon {
  fill: var(--color-icon-highlighted);
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  position: absolute;
  top: 20px;
  right: 20px;
  pointer-events: none;
}

.form-select label {
  padding: 0 6px;
  background-color: var(--color-box-background);
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 600;
  position: absolute;
  top: -8px;
  left: 12px;
  pointer-events: none;
}

/*------------------------
    11. CHECKBOX WRAP
------------------------*/
.checkbox-wrap {
  position: relative;
}

.checkbox-wrap .checkbox-info {
  margin-top: 12px;
}

.checkbox-wrap .checkbox-info .checkbox-info-text {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.checkbox-wrap.checkbox-rating .rating-list {
  position: absolute;
  top: 6px;
  left: 34px;
  pointer-events: none;
}

.checkbox-wrap.checkbox-rating label {
  padding-left: 104px;
}

.checkbox-wrap input[type="checkbox"],
.checkbox-wrap input[type="radio"] {
  display: none;
}

.checkbox-wrap input[type="checkbox"]:checked+.checkbox-box,
.checkbox-wrap input[type="radio"]:checked+.checkbox-box {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

.checkbox-wrap input[type="checkbox"]:checked+.checkbox-box.round,
.checkbox-wrap input[type="radio"]:checked+.checkbox-box.round {
  border: 6px solid var(--color-primary);
  background-color: var(--color-box-background);
}

.checkbox-wrap input[type="checkbox"]:checked+.checkbox-box .icon-cross,
.checkbox-wrap input[type="radio"]:checked+.checkbox-box .icon-cross {
  fill: var(--color-box-background);
}

.checkbox-wrap label {
  padding-left: 34px;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 22px;
  cursor: pointer;
}

.checkbox-wrap .checkbox-box {
  pointer-events: none;
  position: absolute;
  top: 0;
  left: 0;
}

.checkbox-wrap.small input[type="checkbox"],
.checkbox-wrap.small input[type="radio"] {
  display: none;
}

.checkbox-wrap.small input[type="checkbox"]:checked+.checkbox-box.round,
.checkbox-wrap.small input[type="radio"]:checked+.checkbox-box.round {
  border: 5px solid var(--color-primary);
}

.checkbox-wrap.small label {
  padding-left: 24px;
  font-size: 0.75rem;
  line-height: 16px;
}

.checkbox-wrap.small .checkbox-box {
  width: 16px;
  height: 16px;
  border-radius: 4px;
}

.checkbox-wrap.small .checkbox-box.round {
  border-radius: 50%;
}

.checkbox-wrap.small .checkbox-box .icon-cross {
  width: 8px;
  height: 8px;
}

.checkbox-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background-color: var(--color-box-background);
  transition: border-color .2s ease-in-out, background-color .2s ease-in-out;
}

.checkbox-box.round {
  border-radius: 50%;
}

.checkbox-box.small {
  width: 14px;
  height: 14px;
  border-radius: 4px;
}

.checkbox-box.small .icon-cross {
  width: 8px;
  height: 8px;
}

.checkbox-box.active {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}

.checkbox-box.active .icon-cross {
  fill: var(--color-box-background);
}

.checkbox-box .icon-cross {
  fill: transparent;
  transition: fill .2s ease-in-out;
}

/*----------------------------
    14. INTERACTIVE INPUT
----------------------------*/
.interactive-input {
  width: 100%;
  height: 52px;
  position: relative;
}

.interactive-input.dark input {
  border: none;
  background-color: var(--color-header-input-background);
  color: var(--color-header-text);
}

.interactive-input.dark input::-webkit-input-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.interactive-input.dark input::-moz-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.interactive-input.dark input:-ms-input-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.interactive-input.dark input::-ms-input-placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.interactive-input.dark input::placeholder {
  color: var(--color-header-input-placeholder);
  opacity: 1;
}

.interactive-input.dark .interactive-input-icon-wrap .interactive-input-icon {
  fill: var(--color-header-icon);
}

.interactive-input.dark .interactive-input-action:hover .interactive-input-action-icon {
  fill: var(--color-header-icon-hover);
}

.interactive-input.dark .interactive-input-action .interactive-input-action-icon {
  fill: var(--color-header-icon);
}

.interactive-input.small {
  height: 48px;
}

.interactive-input.interactive-input-actionable .interactive-input-action {
  display: none;
}

.interactive-input.interactive-input-actionable.active .interactive-input-action {
  display: -ms-flexbox;
  display: flex;
}

.interactive-input.interactive-input-actionable.active .interactive-input-icon {
  display: none;
}

.interactive-input .form {
  height: 100%;
}

.interactive-input input {
  height: 100%;
  padding-right: 60px;
}

.interactive-input .loader-spinner-wrap {
  position: absolute;
  top: 17px;
  right: 20px;
}

.interactive-input .interactive-input-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 60px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  pointer-events: none;
}

.interactive-input .interactive-input-icon-wrap.actionable {
  pointer-events: all;
}

.interactive-input .interactive-input-icon-wrap.actionable .interactive-input-icon {
  cursor: pointer;
}

.interactive-input .interactive-input-icon-wrap.actionable .interactive-input-icon:hover {
  fill: var(--color-text);
  opacity: 1;
}

.interactive-input .interactive-input-icon-wrap .interactive-input-icon {
  fill: var(--color-icon);
  opacity: .6;
  transition: fill .2s ease-in-out, opacity .2s ease-in-out;
}

.interactive-input .interactive-input-action {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 60px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
}

.interactive-input .interactive-input-action:hover .interactive-input-action-icon {
  fill: var(--color-text);
  opacity: 1;
}

.interactive-input .interactive-input-action .interactive-input-action-icon {
  fill: var(--color-icon);
  opacity: .6;
  pointer-events: none;
  transition: fill .2s ease-in, opacity .2s ease-in;
}

/*----------------------
    19. FORM SWITCH
----------------------*/
.form-switch {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  width: 52px;
  height: 28px;
  border: 1px solid var(--color-border);
  border-radius: 200px;
  background-color: var(--color-divider);
  cursor: pointer;
  position: relative;
  transition: background-color .3s ease-in-out;
}

.form-switch.active {
  background-color: var(--color-primary);
}

.form-switch.active .form-switch-button {
  left: 26px;
}

.form-switch .form-switch-button {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background-color: #fff;
  position: absolute;
  top: 2px;
  left: 2px;
  transition: left .3s ease-in-out;
}

.form-switch .form-switch-button::before,
.form-switch .form-switch-button::after {
  content: '';
  width: 2px;
  height: 8px;
  background-color: var(--color-icon);
  opacity: .2;
  position: absolute;
  top: 7px;
}

.form-switch .form-switch-button::before {
  left: 8px;
}

.form-switch .form-switch-button::after {
  right: 8px;
}

.form-input-checkbox {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.form-input-checkbox .checkbox-box,
.form-input-checkbox .form-input-checkbox-text {
  cursor: pointer;
}

.form-input-checkbox .checkbox-box+.form-input-checkbox-text {
  margin-left: 12px;
}

.form-input-checkbox .form-input-checkbox-text {
  font-size: 0.875rem;
  font-weight: 700;
}

.error-field-message,
.required-field-message {
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
}

.error-field-message+.button,
.required-field-message+.button {
  margin-top: 16px;
}

.error-field-message.medium,
.required-field-message.medium {
  font-size: 0.875rem;
}

.error-field-message,
.required-field-message {
  color: var(--color-tertiary);
}

/*----------------------------
    FORM INPUT LIST
----------------------------*/
.form-input-list .form-input-list-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.form-input-list .form-input-list-items {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.form-input-list .form-input-list-items .form-input-checkbox,
.form-input-list .form-input-list-items .checkbox-wrap {
  margin: 16px 16px 0 0;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 960px) {
  .form-row.split {
    display: block;
  }

  .form-row.split .form-item {
    margin-bottom: 28px;
  }

  .form-row.split .form-item:last-child {
    margin-bottom: 0;
  }

  .form-row.split .form-item textarea {
    height: 124px;
  }

  .form-item.split.join-on-mobile {
    display: block;
  }

  .form-item.split.join-on-mobile.medium>* {
    margin-right: 0;
  }

  .form-item.split.join-on-mobile>* {
    margin-right: 0;
  }

  .form-item.split.join-on-mobile>*:last-child {
    margin-top: 28px;
  }
}

@media screen and (max-width: 768px) {
  .form-textarea-footer {
    -ms-flex-pack: justify;
    justify-content: space-between;
  }
}

@media screen and (max-width: 480px) {
  .form-input-list .form-input-list-items {
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .form-input-list .form-input-list-items .form-input-checkbox,
  .form-input-list .form-input-list-items .checkbox-wrap {
    margin-top: 16px;
  }

  .form-input-list .form-input-list-items .form-input-checkbox:last-child,
  .form-input-list .form-input-list-items .checkbox-wrap:last-child {
    margin-bottom: 12px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. ICONS
-------------------------------------------------------------------*/
/*-----------------
    1. ICONS
-----------------*/
.icon-facebook,
.icon-twitter,
.icon-twitch,
.icon-youtube,
.icon-instagram,
.icon-patreon,
.icon-discord,
.icon-behance,
.icon-deviantart,
.icon-artstation,
.icon-dribbble,
.icon-spotify,
.icon-snapchat,
.icon-skype,
.icon-reddit,
.icon-pinterest,
.icon-messenger,
.icon-linkedin,
.icon-github,
.icon-whatsapp,
.icon-vk,
.icon-tumblr,
.icon-tiktok,
.icon-unsplash,
.icon-flickr,
.icon-cross {
  fill: #fff;
  width: 12px;
  height: 12px;
}

.icon-logo-vikinger {
  fill: #fff;
  width: 42px;
  height: 60px;
}

.icon-logo-vikinger.small {
  width: 28px;
  height: 40px;
}

.icon-dots {
  fill: #fff;
  width: 10px;
  height: 2px;
}

.icon-public,
.icon-private {
  fill: var(--color-icon-highlighted);
  width: 20px;
  height: 20px;
}

.icon-comment,
.icon-thumbs-up,
.icon-friend,
.icon-info,
.icon-success,
.icon-error,
.icon-group,
.icon-marketplace,
.icon-add-friend,
.icon-remove-friend,
.icon-delete,
.icon-send-message,
.icon-settings,
.icon-cross-thin,
.icon-newsfeed,
.icon-overview,
.icon-members,
.icon-memberships,
.icon-badges,
.icon-quests,
.icon-streams,
.icon-events,
.icon-events-monthly,
.icon-events-weekly,
.icon-events-daily,
.icon-pin,
.icon-ticket,
.icon-forums,
.icon-profile,
.icon-timeline,
.icon-photos,
.icon-videos,
.icon-headphones,
.icon-blog-posts,
.icon-forum,
.icon-store,
.icon-share,
.icon-pinned,
.icon-favorite,
.icon-status,
.icon-big-grid-view,
.icon-small-grid-view,
.icon-list-grid-view,
.icon-poll,
.icon-camera,
.icon-emoji,
.icon-gif,
.icon-tags,
.icon-trophy,
.icon-return,
.icon-clock,
.icon-earnings,
.icon-wallet,
.icon-item,
.icon-revenue,
.icon-credits,
.icon-ranks,
.icon-admin-crown,
.icon-mod-shield,
.icon-ban,
.icon-remove-user {
  fill: var(--color-icon);
  width: 20px;
  height: 20px;
}

.icon-grid,
.icon-magnifying-glass,
.icon-messages,
.icon-shopping-bag,
.icon-notification,
.icon-join-group,
.icon-leave-group,
.icon-plus,
.icon-login,
.icon-gallery,
.icon-link,
.icon-light-theme,
.icon-dark-theme {
  fill: #fff;
  width: 20px;
  height: 20px;
}

.icon-back-arrow {
  width: 14px;
  height: 10px;
}

.icon-small-arrow {
  fill: var(--color-icon);
  width: 6px;
  height: 8px;
}

.icon-big-arrow {
  fill: #3e3f5e;
  width: 8px;
  height: 12px;
}

.icon-more-dots {
  fill: #fff;
  width: 22px;
  height: 6px;
}

.icon-more-dots.small {
  width: 16px;
  height: 5px;
}

.icon-starred {
  fill: #ffe00d;
  width: 11px;
  height: 10px;
}

.icon-star {
  fill: #eaeaf5;
  width: 9px;
  height: 8px;
}

.icon-star.medium {
  width: 13px;
  height: 12px;
}

.icon-play {
  fill: #fff;
  width: 12px;
  height: 14px;
}

.icon-play.medium {
  width: 16px;
  height: 18px;
}

.icon-speaker {
  fill: #fff;
  width: 26px;
  height: 22px;
}

.icon-plus-small,
.icon-minus-small {
  fill: #3e3f5e;
  width: 8px;
  height: 8px;
}

.icon-quote {
  fill: #3e3f5e;
  width: 32px;
  height: 22px;
}

.icon-check {
  width: 12px;
  height: 9px;
}

.icon-check-small {
  width: 6px;
  height: 6px;
}

.demo-icon {
  fill: var(--color-icon-highlighted);
}

.icon-no-results {
  fill: var(--color-icon);
  width: 172px;
  height: 156px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .content-grid
2. .grid
3. .photos-masonry
-------------------------------------------------------------------*/
/*----------------------
    1. CONTENT GRID
----------------------*/
.content-grid {
  max-width: 1184px;
  padding: 32px 0 100px;
  margin: 0 auto;
}

.content-grid.full {
  width: 100%;
  max-width: 100%;
  padding: 0;
}

.content-grid.medium {
  max-width: 784px;
  padding: 0 0 100px;
}

.content-grid .section-navigation {
  margin-top: 16px;
}

.content-grid .section-navigation+#activity-photo-list,
.content-grid .section-navigation+#activity-video-list {
  margin-top: 60px;
}

.content-grid .section-navigation+#activity-photo-list .section-header,
.content-grid .section-navigation+#activity-video-list .section-header {
  margin-bottom: 32px;
}

.content-grid .section-navigation+.bbpress-wrapper {
  margin-top: 60px;
}

.content-grid .section-navigation+.filterable-list,
.content-grid .section-navigation+.grid {
  margin-top: 16px;
}

.content-grid .table {
  margin-top: 16px;
}

.content-grid .table+.page-loader-indicator {
  margin-top: 52px;
}

.content-grid .grid {
  margin-top: 32px;
}

.content-grid .grid:first-child {
  margin-top: 0;
}

.content-grid .grid.medium-space {
  margin-top: 64px;
}

.content-grid .grid.medium-space:first-child {
  margin-top: 0;
}

.content-grid .grid.small-space {
  margin-top: 16px;
}

.content-grid .grid.grid-stretched {
  -ms-flex-align: stretch;
  align-items: stretch;
}

.content-grid .grid .grid {
  margin-top: 0;
}

.content-grid .photos-masonry,
.content-grid .section-slider {
  margin-top: 32px;
}

.content-grid .section-header {
  margin-top: 60px;
}

.content-grid .section-header:first-child {
  margin-top: 0;
}

.content-grid .section-header+.filterable-list {
  margin-top: 32px;
}

.content-grid .section-banner+.filterable-list {
  margin-top: 64px;
}

.content-grid .calendar-widget {
  margin-top: 16px;
}

.content-grid .forum-content .quick-post {
  margin-top: 60px;
}

.content-grid .forum-sidebar {
  padding-top: 40px;
}

.content-grid .account-hub-content .section-header {
  margin-bottom: 28px;
}

.content-grid .account-hub-content .section-header:first-child {
  margin-top: 0;
}

.content-grid .notification-box-list+.page-loader-indicator {
  margin-top: 60px;
}

/*--------------
    2. GRID
--------------*/
.grid {
  display: grid;
  grid-template-columns: 100%;
  grid-gap: 16px;
  -ms-flex-align: start;
  align-items: start;
}

.grid.centered {
  -ms-flex-pack: center;
  justify-content: center;
}

.grid.stretched {
  -ms-flex-align: stretch;
  align-items: stretch;
}

.grid.top-space {
  margin-top: 64px;
}

.grid.grid-3-6-3 {
  grid-template-areas: 'sidebar1 content sidebar2';
  grid-template-columns: 23.9864864865% 49.3243243243% 23.9864864865%;
}

.grid.grid-3-6-3>.grid-column:nth-child(1) {
  grid-area: sidebar1;
}

.grid.grid-3-6-3>.grid-column:nth-child(2) {
  grid-area: content;
}

.grid.grid-3-6-3>.grid-column:nth-child(3) {
  grid-area: sidebar2;
}

.grid.grid-6-3_9 {
  grid-template-areas: 'content sidebar';
  grid-template-columns: 66.0633484163% 32.1266968326%;
}

.grid.grid-6-3_9>.grid-column:nth-child(1) {
  grid-area: content;
}

.grid.grid-6-3_9>.grid-column:nth-child(2) {
  grid-area: sidebar;
}

.grid.grid-3-6_9 {
  grid-template-areas: 'sidebar content';
  grid-template-columns: 32.1266968326% 66.0633484163%;
}

.grid.grid-3-6_9>.grid-column:nth-child(1) {
  grid-area: sidebar;
}

.grid.grid-3-6_9>.grid-column:nth-child(2) {
  grid-area: content;
}

.grid.grid-3-9 {
  grid-template-areas: 'sidebar content';
  grid-template-columns: 23.9864864865% 74.6621621622%;
}

.grid.grid-3-9>.grid-column:nth-child(1) {
  grid-area: sidebar;
}

.grid.grid-3-9>.grid-column:nth-child(2) {
  grid-area: content;
}

.grid.grid-9-3 {
  grid-template-areas: 'content sidebar';
  grid-template-columns: 74.6621621622% 23.9864864865%;
}

.grid.grid-9-3>.grid-column:nth-child(1) {
  grid-area: content;
}

.grid.grid-9-3>.grid-column:nth-child(2) {
  grid-area: sidebar;
}

.grid.grid-8-4 {
  grid-template-areas: 'content sidebar';
  grid-template-columns: 66.2162162162% 32.4324324324%;
}

.grid.grid-8-4>.grid-column:nth-child(1) {
  grid-area: content;
}

.grid.grid-8-4>.grid-column:nth-child(2) {
  grid-area: sidebar;
}

.grid.grid-6-3 {
  grid-template-areas: 'content sidebar';
  grid-template-columns: 49.3243243243% 23.9864864865%;
}

.grid.grid-6-3>.grid-column:nth-child(1) {
  grid-area: content;
}

.grid.grid-6-3>.grid-column:nth-child(2) {
  grid-area: sidebar;
}

.grid.grid_flexible.grid-3-3-3-3 {
  grid-template-columns: repeat(4, 1fr);
}

.grid.grid-half {
  grid-template-columns: 1fr 1fr;
}

.grid.grid-4-4-4 {
  grid-template-columns: repeat(auto-fit, 384px);
}

.grid.grid-6-6 {
  grid-template-columns: repeat(auto-fit, 584px);
}

.grid.grid-4-4 {
  grid-template-columns: repeat(auto-fit, 384px);
}

.grid.grid-3-3-3-3 {
  grid-template-columns: repeat(auto-fit, 284px);
}

.grid.grid-3-3-3 {
  grid-template-columns: repeat(auto-fit, 284px);
}

.grid.grid-2-2-2-2-2-2 {
  grid-template-columns: repeat(auto-fit, 184px);
}

.grid.grid-layout-1 {
  grid-template-columns: repeat(4, 23.9864864865%);
  grid-template-areas: 'sidebar header header header'
    'sidebar content content contentsidebar';
}

.grid.grid-layout-1 .grid-sidebar {
  grid-area: sidebar;
}

.grid.grid-layout-1 .grid-header {
  grid-area: header;
}

.grid.grid-layout-1 .grid-content {
  grid-area: content;
}

.grid.grid-layout-1 .grid-content-sidebar {
  grid-area: contentsidebar;
}

.grid .grid-column {
  display: grid;
  grid-template-columns: 100%;
  grid-gap: 16px;
  min-width: 0;
}

.grid .grid-column .page-loader-indicator {
  margin: 48px auto 0;
}

.grid .grid-column .simple-tab-items {
  margin: 16px 0;
}

/*------------------------
    3. PHOTOS MASONRY
------------------------*/
.photos-masonry {
  display: grid;
  grid-gap: 16px;
  grid-template-rows: repeat(3, 284px);
  grid-template-areas: 'a b c c'
    'a d e f'
    'g h i j';
}

.photos-masonry .photo-preview:nth-child(1) {
  grid-area: a;
}

.photos-masonry .photo-preview:nth-child(2) {
  grid-area: b;
}

.photos-masonry .photo-preview:nth-child(3) {
  grid-area: c;
}

.photos-masonry .photo-preview:nth-child(4) {
  grid-area: d;
}

.photos-masonry .photo-preview:nth-child(5) {
  grid-area: e;
}

.photos-masonry .photo-preview:nth-child(6) {
  grid-area: f;
}

.photos-masonry .photo-preview:nth-child(7) {
  grid-area: g;
}

.photos-masonry .photo-preview:nth-child(8) {
  grid-area: h;
}

.photos-masonry .photo-preview:nth-child(9) {
  grid-area: i;
}

.photos-masonry .photo-preview:nth-child(10) {
  grid-area: j;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .content-grid {
    width: 95%;
    max-width: 1184px;
    padding-left: 0;
  }

  .content-grid.medium {
    max-width: 100%;
  }

  .content-grid .account-hub-sidebar {
    display: none;
  }

  .content-grid .account-hub-content .section-header:first-child {
    margin-top: 0;
  }

  .grid.grid-3-6-3 {
    grid-template-columns: 32.4324324324% 66.2162162162%;
    grid-template-areas: 'sidebar1 content'
      'sidebar2 content';
  }

  .grid.grid-3-6-3.mobile-prefer-content {
    grid-template-areas: 'sidebar1 content';
  }

  .grid.grid-3-6-3.mobile-prefer-content>.grid-column:nth-child(3) {
    display: none;
  }

  .grid.grid-3-9,
  .grid.grid-9-3,
  .grid.grid-8-4 {
    grid-template-columns: 100%;
    grid-template-areas: 'content'
      'sidebar';
  }

  .grid.grid-3-9 .forum-sidebar,
  .grid.grid-9-3 .forum-sidebar,
  .grid.grid-8-4 .forum-sidebar {
    display: none;
  }

  .grid.grid-layout-1 {
    grid-template-areas: 'header header header header'
      'sidebar sidebar contentsidebar contentsidebar'
      'content content content content';
  }

  .grid.grid-half.change-on-desktop {
    grid-template-columns: 100%;
  }

  .grid.centered-on-mobile {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .photos-masonry {
    grid-template-areas: unset;
    grid-template-columns: repeat(auto-fit, 184px);
    grid-template-rows: none;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .photos-masonry .photo-preview {
    height: 184px;
  }

  .photos-masonry .photo-preview:nth-child(1),
  .photos-masonry .photo-preview:nth-child(2),
  .photos-masonry .photo-preview:nth-child(3),
  .photos-masonry .photo-preview:nth-child(4),
  .photos-masonry .photo-preview:nth-child(5),
  .photos-masonry .photo-preview:nth-child(6),
  .photos-masonry .photo-preview:nth-child(7),
  .photos-masonry .photo-preview:nth-child(8),
  .photos-masonry .photo-preview:nth-child(9),
  .photos-masonry .photo-preview:nth-child(10) {
    grid-area: auto;
  }

  .chat-widget,
  .navigation-widget-desktop {
    display: none;
  }

  .chat-widget-wrap .chat-widget {
    display: block;
  }
}

@media screen and (max-width: 1070px) {
  .grid.grid-3-6-3 {
    grid-template-columns: 100%;
    grid-template-areas: 'sidebar1'
      'sidebar2'
      'content';
  }

  .grid.grid-3-6-3.mobile-prefer-content {
    grid-template-areas: 'content'
      'sidebar1'
      'sidebar2';
  }

  .grid.grid-3-6-3.mobile-prefer-content .grid-column:nth-child(1),
  .grid.grid-3-6-3.mobile-prefer-content .grid-column:nth-child(3) {
    display: none;
  }

  .grid.grid-3-9,
  .grid.grid-6-3_9,
  .grid.grid-3-6_9 {
    grid-template-columns: 100%;
    grid-template-areas: 'content'
      'sidebar';
  }
}

@media screen and (max-width: 960px) {
  .grid.grid-half {
    grid-template-columns: 100%;
  }

  .grid.grid-layout-1 {
    grid-template-columns: 100%;
    grid-template-areas: 'header'
      'contentsidebar'
      'sidebar'
      'content';
  }

  .grid.grid-6-6 {
    grid-template-columns: 100%;
  }

  .content-grid {
    padding: 32px 0 100px;
  }

  .content-grid.full:not(.content-grid_open-post) {
    width: 100%;
    padding: 60px 0 0;
  }

  .content-grid .section-banner+.filterable-list {
    margin-top: 32px;
  }

  .content-grid.full.content-grid_open-post .post-open-cover {
    height: 320px;
  }

  .content-grid.full.content-grid_open-post .post-open-body {
    padding-top: 60px;
  }
}

@media screen and (max-width: 680px) {
  .content-grid.medium {
    padding: 0 0 100px;
  }
}

@media screen and (max-width: 460px) {

  .grid.grid-4-4-4,
  .grid.grid-4-4,
  .grid.grid-3-3-3-3 {
    grid-template-columns: 100%;
  }
}

/**
 * Medium Screens, Desktops (1025px — 1200px)
 */
@media screen and (max-width: 1200px) {
  .grid.grid_flexible.grid-3-3-3-3 {
    grid-template-columns: repeat(3, 1fr);
  }
}

/**
 * Small Screens, Laptops (769px — 1024px)
 */
/**
 * Tablets, iPads (481px — 768px)
 */
@media screen and (max-width: 768px) {
  .grid.grid_flexible.grid-3-3-3-3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

/**
 * Mobiles Devices (320px — 480px)
 */
@media screen and (max-width: 480px) {
  .grid.grid_flexible.grid-3-3-3-3 {
    grid-template-columns: 1fr;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. GENERAL
-------------------------------------------------------------------*/
/*-----------------
    1. GENERAL
-----------------*/
*::-moz-selection {
  color: #fff;
  background-color: var(--color-primary);
}

*::selection {
  color: #fff;
  background-color: var(--color-primary);
}

html {
  height: 100%;
}

body {
  font-size: 16px;
  background-color: var(--color-body);
  font-family: var(--font-primary);
  overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6,
a,
p {
  color: var(--color-text);
  line-height: 1em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 700;
}

p a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

p .reaction {
  width: 20px;
  height: 20px;
  margin: 0 2px;
  position: relative;
  top: -2px;
}

p .reaction:first-child {
  margin-left: 0;
}

p a:focus,
li a:focus {
  color: var(--color-primary-dark);
  text-decoration: underline;
}

a:hover {
  color: var(--color-primary-dark);
  text-decoration: none;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 480px) {
  .hide-text-mobile {
    display: none;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .button
-------------------------------------------------------------------*/
/*-----------------------
    1. BUTTON
-----------------------*/
.button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  border-radius: 10px;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
  box-shadow: 3px 5px 10px 0 rgba(62, 63, 94, 0.2);
}

.button.button-loader .button-loading-text,
.button.button-loader .loader-spinner {
  display: none;
}

.button.button-loader.button-loader-loading .button-text {
  display: none;
}

.button.button-loader.button-loader-loading .button-loading-text,
.button.button-loader.button-loader-loading .loader-spinner {
  display: block;
}

.button.button-loader+.error-field-message {
  margin-top: 12px;
}

.button .loader-spinner {
  margin-left: 12px;
  background: linear-gradient(to right, #fff 10%, rgba(35, 210, 226, 0) 42%);
}

.button .loader-spinner:before {
  background-color: #fff;
}

.button .loader-spinner:after {
  transition: background-color .2s ease-in-out;
}

.button[disabled] {
  opacity: .3;
  pointer-events: none;
  box-shadow: none;
}

.button.no-shadow {
  box-shadow: none;
}

.button.full {
  width: 100%;
}

.button.medium {
  height: 54px;
  line-height: 54px;
}

.button.small {
  height: 40px;
  font-size: 0.75rem;
  line-height: 40px;
}

.button:hover {
  color: #fff;
  background-color: #2e2e47;
}

.button.void {
  background-color: transparent;
  color: var(--color-text-alt-2);
  box-shadow: none;
}

.button.void .loader-spinner {
  background: linear-gradient(to right, #23d2e2 10%, rgba(35, 210, 226, 0) 42%);
}

.button.void .loader-spinner:before {
  background-color: #23d2e2;
}

.button.void .button-icon {
  fill: var(--color-icon);
}

.button.void:hover {
  color: #fff;
  background-color: #2e2e47;
}

.button.void:hover .button-icon {
  fill: #fff;
}

.button.void.void-primary:hover {
  background-color: var(--color-primary);
}

.button.void.void-secondary:hover {
  background-color: var(--color-secondary);
}

.button.void.void-secondary:hover .loader-spinner:after {
  background-color: var(--color-secondary);
}

.button.void.void-tertiary:hover {
  background-color: var(--color-tertiary);
}

.button.void.void-tertiary:hover .loader-spinner:after {
  background-color: var(--color-tertiary);
}

.button.white-solid {
  background-color: #fff;
  color: #3e3f5e;
}

.button.white {
  background-color: transparent;
  border: 1px solid var(--color-border);
  color: var(--color-text-alt-2);
  box-shadow: none;
}

.button.white .loader-spinner {
  background: linear-gradient(to right, var(--color-primary-background) 10%, rgba(35, 210, 226, 0) 42%);
}

.button.white .loader-spinner:before {
  background-color: var(--color-primary);
}

.button.white .button-icon {
  fill: var(--color-icon);
}

.button.white:hover {
  color: #fff;
  background-color: #2e2e47;
  border-color: #2e2e47;
}

.button.white.white-tertiary:hover {
  background-color: var(--color-tertiary);
  border-color: var(--color-tertiary);
  box-shadow: var(--color-tertiary-shadow);
}

.button.white.white-tertiary:hover .loader-spinner:after {
  background-color: var(--color-tertiary);
}

.button.primary {
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

.button.primary:hover {
  background-color: var(--color-primary-hover);
}

.button.primary:hover .loader-spinner:after {
  background-color: var(--color-primary-hover);
}

.button.primary .loader-spinner:after {
  background-color: var(--color-primary);
}

.button.secondary {
  background-color: var(--color-secondary);
  box-shadow: var(--color-secondary-shadow);
}

.button.secondary:hover {
  background-color: var(--color-secondary-hover);
}

.button.secondary:hover .loader-spinner:after {
  background-color: var(--color-secondary-hover);
}

.button.secondary .loader-spinner:after {
  background-color: var(--color-secondary);
}

.button.tertiary {
  background-color: var(--color-tertiary);
  box-shadow: var(--color-tertiary-shadow);
}

.button.tertiary:hover {
  background-color: var(--color-tertiary-hover);
}

.button.tertiary:hover .loader-spinner:after {
  background-color: var(--color-tertiary-hover);
}

.button.tertiary .loader-spinner:after {
  background-color: var(--color-tertiary);
}

.button.twitch {
  background-color: #7b5dfa;
  box-shadow: 4px 7px 12px 0 rgba(123, 93, 250, 0.2);
}

.button.twitch:hover {
  background-color: #6a4fdf;
}

.button.twitter {
  background-color: #1abcff;
  box-shadow: 3px 5px 10px 0px rgba(26, 188, 255, 0.2);
}

.button.twitter:hover {
  background-color: #0aabed;
}

.button.add-field-button {
  width: 128px;
  margin-top: 40px;
}

.button.padded {
  padding: 0 24px;
}

.button .button-icon {
  fill: #fff;
  transition: fill .2s ease-in-out;
}

.button .button-icon.spaced {
  margin-right: 6px;
}

.button.with-only-icon .loader-spinner {
  margin-left: 0;
}

.button.button-loading .button-icon {
  display: none;
}

.button.button-loading .button-loader {
  display: block;
}

.button .button-loader {
  display: none;
}

.button-post-comment {
  width: 80px;
}

.button-show-more {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 44px;
  border-radius: 10px;
  background-color: var(--color-box-background-alt);
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 3px 5px 10px 0 rgba(62, 63, 94, 0.2);
}

/*------------------------------------------------------------------
[Table of contents]

1. .lined-text
2. .social-links
3. .social-link
4. .tab-switch
5. .tab-switch-button
6. .action-request-list
7. .action-request
8. .burger-icon
9. .action-list
10. .action-item
11. .user-stats
12. .user-stat
13. .badge-list
14. .badge-item
15. .tag-list
16. .tag-item
17. .xm-tooltip-text
18. .user-short-description
19. .slider-control
20. .slider-roster
21. .slider-roster-item
22. .tag-sticker
23. .text-sticker
24. .date-sticker
25. .decorated-text
26. .simple-dropdown
27. .paragraph
28. .information-line-list
29. .information-line
30. .information-block-list
31. .information-block
32. .timeline-information-list
33. .timeline-information
34. .rating-list
35. .rating
36. .filters
37. .filter-tabs
38. .filter-tab
39. .view-actions
40. .view-action
41. .tweets
42. .tweet
43. .play-button
44. .iframe-wrap
45. .popup-video
46. .popup-picture
47. .popup-event
48. .popup-close-button
49. .decorated-feature-list
50. .decorated-feature
51. .meta-line
52. .reaction-options
53. .post-options
54. .post-option
55. .post-settings
56. .slider-line
57. .stat-block-list
58. .stat-block
59. .achievement-status-list
60. .achievement-status
61. .page-loader
62. .reaction-count-list
63. .reaction-count
64. .upload-item-list
65. .upload-item
66. .simple-accordion-list
67. .simple-accordion
68. .week-box
69. .week-box-item
70. .forum-category
71. .discussion-preview
72. .page-items
73. .page-item
74. .quick-post
75. .option-items
76. .option-item
77. .stats-box
78. .stats-box-slider
79. .reaction-stats
80. .reaction-stat
81. .simple-tab-items
82. .simple-tab-item
83. .banner-promo
84. .poll-box
85. .poll-results
86. .poll-result
87. .picture-collage
88. .quote-box
89. .stats-decoration
90. .percentage-diff
91. .percentage-diff-icon-wrap
92. .sidebar-box
93. .sidebar-menu
94. .sidebar-menu-item
95. .sidebar-menu-header
96. .sidebar-menu-body
97. .price-title
98. .promo-line
99. .tab-box
100. .bullet-item-list
101. .bullet-item
102. .ordered-item-list
103. .ordered-item
104. .profile-stats
105. .featured-stat-list
106. .featured-stat
107. .featured-stat-box
108. .achievement-box
109. .level-progress-box
110. .level-progress-badge
111. .exp-line-list
112. .exp-line
113. .account-stat-box
114. .reference-item-list
115. .reference-item
116. .reference-bullet
117. .country-stat-list
118. .country-stat
119. .full-width-image
120. .totals-line-list
121. .totals-line
122. .upload-box
123. .draggable-items
124. .draggable-item
125. .switch-option-list
126. .switch-option
127. .notification-box-list
128. .notification-box
129. .create-entity-box
130. .earning-stat-box
131. .status-info
-------------------------------------------------------------------*/
/*--------------------
    1. LINED TEXT
--------------------*/
.lined-text {
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  position: relative;
}

.lined-text::before,
.lined-text::after {
  content: '';
  width: 70px;
  height: 1px;
  background-color: var(--color-divider);
  position: absolute;
  top: 7px;
}

.lined-text::before {
  left: 0;
}

.lined-text::after {
  right: 0;
}

/*-----------------------
    2. SOCIAL LINKS
-----------------------*/
.social-links {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
}

.social-links.align-left {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.social-links.small .social-link {
  margin-right: 8px;
}

.social-links.small .social-link:last-child {
  margin-right: 0;
}

.social-links.vertical {
  -ms-flex-direction: column;
  flex-direction: column;
}

.social-links.vertical .social-link {
  margin: 0 0 16px 0;
}

.social-links.vertical .social-link:last-child {
  margin: 0;
}

.social-links.multiline {
  margin-top: -12px;
}

.social-links.multiline .social-link {
  margin: 12px 12px 0 0;
}

.social-links.multiline .social-link:last-child {
  margin-right: 0;
}

.social-links .social-link {
  margin-right: 12px;
}

.social-links .social-link:last-child {
  margin-right: 0;
}

/*-----------------------
    3. SOCIAL LINK
-----------------------*/
.social-link {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background-color: #3e3f5e;
  transition: -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out;
  transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.social-link.small {
  width: 32px;
  height: 32px;
  border-radius: 8px;
}

.social-link.small .social-link-icon {
  width: 10px;
  height: 10px;
}

.social-link.no-hover:hover {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

.social-link:hover {
  -webkit-transform: translate(0, -4px);
  transform: translate(0, -4px);
}

.social-link.facebook {
  background-color: #3763d2;
}

.social-link.twitter {
  background-color: #1abcff;
}

.social-link.twitch {
  background-color: #7b5dfa;
}

.social-link.youtube {
  background-color: #fd434f;
}

.social-link.instagram {
  background-color: #f8468d;
}

.social-link.patreon {
  background-color: #ff7a51;
}

.social-link.discord {
  background-color: #7289da;
}

.social-link.behance {
  background-color: #3486f5;
}

.social-link.deviantart {
  background-color: #32e1d3;
}

.social-link.artstation {
  background-color: #00e194;
}

.social-link.dribbble {
  background-color: #f761ab;
}

.social-link.spotify {
  background-color: #1dd05d;
}

.social-link.snapchat {
  background-color: #ffe400;
}

.social-link.skype {
  background-color: #01a9ea;
}

.social-link.reddit {
  background-color: #f74300;
}

.social-link.pinterest {
  background-color: #cd2e3f;
}

.social-link.messenger {
  background-color: #0084ff;
}

.social-link.linkedin {
  background-color: #0077b5;
}

.social-link.github {
  background-color: #303742;
}

.social-link.whatsapp {
  background-color: #2fbe38;
}

.social-link.vk {
  background-color: #5181b8;
}

.social-link.tumblr {
  background-color: #4c6d93;
}

.social-link.tiktok {
  background-color: #000000;
}

.social-link.unsplash {
  background-color: #000000;
}

.social-link.flickr {
  background-color: #f761ab;
}

.social-link.void {
  background-color: #fff;
  box-shadow: var(--color-overbox-shadow);
}

.social-link.void.facebook .icon-facebook {
  fill: #3763d2;
}

.social-link.void.twitter .icon-twitter {
  fill: #1abcff;
}

/*-----------------------
    4. TAB SWITCH
-----------------------*/
.tab-switch {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.tab-switch .tab-switch-button:first-child {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.tab-switch .tab-switch-button:last-child {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

/*---------------------------
    5. TAB SWITCH BUTTON
---------------------------*/
.tab-switch-button {
  width: 180px;
  height: 54px;
  border: 1px solid #fff;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  line-height: 54px;
  text-align: center;
  cursor: pointer;
  transition: background-color .3s ease-in-out, color .3s ease-in-out;
}

.tab-switch-button.active {
  color: #3e3f5e;
  background-color: #fff;
  cursor: auto;
}

/*-----------------------------
    6. ACTION REQUEST LIST
-----------------------------*/
.action-request-list {
  display: -ms-flexbox;
  display: flex;
}

.action-request-list .action-request {
  margin-right: 12px;
}

.action-request-list .action-request:last-child {
  margin-right: 0;
}

.action-request-list .tag-sticker {
  width: 40px;
  height: 40px;
}

/*------------------------
    7. ACTION REQUEST
------------------------*/
.action-request {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--color-border);
  border-radius: 10px;
  color: #adafca;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: border-color .2s ease-in-out, background-color .2s ease-in-out, color .2s ease-in-out;
}

.action-request.with-text {
  width: auto;
  padding: 0 32px 0 22px;
}

.action-request.with-text .action-request-icon {
  margin-right: 12px;
}

.action-request:hover {
  color: #fff;
}

.action-request:hover .action-request-icon {
  fill: #fff;
  opacity: 1;
}

.action-request.accept:hover {
  background-color: var(--color-secondary);
  border-color: var(--color-secondary);
}

.action-request.accept:hover .loader-spinner:after {
  background-color: var(--color-secondary);
}

.action-request.decline:hover {
  background-color: var(--color-tertiary);
  border-color: var(--color-tertiary);
}

.action-request.decline:hover .loader-spinner:after {
  background-color: var(--color-tertiary);
}

.action-request .action-request-icon {
  fill: var(--color-icon);
  opacity: .6;
  transition: fill .2s ease-in-out, opacity .2s ease-in-out;
  pointer-events: none;
}

.action-request .loader-spinner:after {
  transition: background-color .2s ease-in-out;
}

/*-----------------------------
    8. BURGER ICON
-----------------------------*/
.burger-icon {
  width: 20px;
  height: 14px;
  position: relative;
}

.burger-icon.open .burger-icon-bar:nth-child(1) {
  width: 100%;
}

.burger-icon.open .burger-icon-bar:nth-child(2) {
  width: 14px;
}

.burger-icon.open .burger-icon-bar:nth-child(3) {
  width: 10px;
}

.burger-icon.inverted .burger-icon-bar {
  left: 0;
}

.burger-icon.inverted .burger-icon-bar:nth-child(1) {
  width: 100%;
}

.burger-icon.inverted .burger-icon-bar:nth-child(2) {
  width: 14px;
}

.burger-icon.inverted .burger-icon-bar:nth-child(3) {
  width: 10px;
}

.burger-icon .burger-icon-bar {
  height: 2px;
  background-color: #fff;
  position: absolute;
  right: 0;
  transition: width .4s ease-in-out;
}

.burger-icon .burger-icon-bar:nth-child(1) {
  top: 0;
  width: 10px;
}

.burger-icon .burger-icon-bar:nth-child(2) {
  top: 6px;
  width: 14px;
}

.burger-icon .burger-icon-bar:nth-child(3) {
  top: 12px;
  width: 100%;
}

/*-----------------------------
    9. ACTION LIST
-----------------------------*/
.action-list {
  display: -ms-flexbox;
  display: flex;
  padding: 0 18px;
  position: relative;
}

.action-list::after,
.action-list::before {
  content: '';
  width: 1px;
  height: 32px;
  background-color: var(--color-border);
  position: absolute;
}

.action-list::after {
  left: 0;
}

.action-list::before {
  right: 0;
}

.action-list.dark::after,
.action-list.dark::before {
  background-color: var(--color-header-divider);
}

.action-list.dark .action-list-item:hover .action-list-item-icon,
.action-list.dark .action-list-item.active .action-list-item-icon,
.action-list.dark .action-list-item.unread .action-list-item-icon,
.action-list.dark .action-list-item-icon-wrap:hover .action-list-item-icon,
.action-list.dark .action-list-item-icon-wrap.active .action-list-item-icon,
.action-list.dark .action-list-item-icon-wrap.unread .action-list-item-icon {
  fill: var(--color-header-icon-hover);
}

.action-list.dark .action-list-item .action-list-item-icon,
.action-list.dark .action-list-item-icon-wrap .action-list-item-icon {
  fill: var(--color-header-icon);
}

.action-list .action-list-item:hover .action-list-item-icon,
.action-list .action-list-item.active .action-list-item-icon,
.action-list .action-list-item.unread .action-list-item-icon,
.action-list .action-list-item-icon-wrap:hover .action-list-item-icon,
.action-list .action-list-item-icon-wrap.active .action-list-item-icon,
.action-list .action-list-item-icon-wrap.unread .action-list-item-icon {
  fill: #3e3f5e;
}

.action-list .action-list-item.unread,
.action-list .action-list-item-icon-wrap.unread {
  position: relative;
}

.action-list .action-list-item.unread::after,
.action-list .action-list-item-icon-wrap.unread::after {
  content: '';
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: var(--color-primary-light);
  position: absolute;
}

.action-list .action-list-item.unread::after {
  top: 26px;
  right: 10px;
}

.action-list .action-list-item-icon-wrap.unread::after {
  top: -4px;
  right: -4px;
}

.action-list .action-list-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 100%;
  padding: 0 14px;
  cursor: pointer;
}

.action-list .action-list-item .action-list-item-icon {
  fill: var(--color-icon);
  transition: fill .3s ease-in-out;
}

.action-list .action-list-item.action-list-item-hidden {
  display: none;
}

/*-----------------------------
    10. ACTION ITEM
-----------------------------*/
.action-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

.action-item .action-item-icon {
  fill: #adafca;
}

.action-item .action-item-text {
  margin-left: 28px;
  font-size: 0.875rem;
  font-weight: 700;
}

.action-item.hoverable .action-item-icon {
  fill: var(--color-header-icon);
  transition: fill .3s ease-in-out;
}

.action-item.hoverable:hover .action-item-icon {
  fill: var(--color-header-icon-hover);
}

.action-item.dark .action-item-icon {
  fill: var(--color-header-profile-settings-icon);
}

/*-----------------------------
    11. USER STATS
-----------------------------*/
.user-stats {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.user-stats .user-stat {
  width: 100%;
  position: relative;
}

.user-stats .user-stat.big::after {
  top: 8px;
}

.user-stats .user-stat::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 6px;
  right: 0;
}

.user-stats .user-stat:last-child::after {
  display: none;
}

/*-----------------------------
    12. USER STAT
-----------------------------*/
.user-stat.big .reference-bullet {
  margin: 0 auto 20px;
}

.user-stat.big .user-stat-title {
  font-size: 1.375rem;
}

.user-stat.big .user-stat-text {
  font-size: 0.75rem;
}

.user-stat .user-stat-title,
.user-stat .user-stat-text {
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

.user-stat .user-stat-title {
  font-size: 0.875rem;
}

.user-stat .user-stat-title .user-stat-title-icon.positive {
  fill: var(--color-primary);
}

.user-stat .user-stat-title .user-stat-title-icon.negative {
  fill: #f9515c;
}

.user-stat .user-stat-icon {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
}

.user-stat .user-stat-icon+.user-stat-text {
  margin-top: 12px;
}

.user-stat .user-stat-image {
  display: block;
  width: 24px;
  height: 16px;
}

.user-stat .user-stat-image+.user-stat-text {
  margin-top: 15px;
}

.user-stat .user-stat-text {
  margin-top: 10px;
  color: var(--color-text-alt-2);
  font-size: 0.6875rem;
}

.user-stat .rating-list {
  margin-top: 10px;
}

/*-----------------------------
    13. BADGE LIST
-----------------------------*/
.badge-list {
  display: grid;
  -ms-flex-pack: center;
  justify-content: center;
  grid-template-columns: repeat(auto-fit, 32px);
  grid-gap: 14px;
}

.badge-list.align-left {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.badge-list.medium {
  grid-gap: 18px 14px;
}

.badge-list.small {
  grid-gap: 8px;
}

/*-----------------------------
    14. BADGE ITEM
-----------------------------*/
.badge-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 32px;
  position: relative;
}

.badge-item.badge-item-more {
  height: 35px;
}

.badge-item.badge-item-more img {
  position: absolute;
  top: 0;
  left: 0;
}

.badge-item img {
  width: 100%;
  height: auto;
}

.badge-item .badge-item-text {
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  position: relative;
  top: 1px;
  z-index: 2;
}

/*-----------------------------
    15. TAG LIST
-----------------------------*/
.tag-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -12px;
}

.tag-list .tag-item {
  margin: 12px 12px 0 0;
}

/*-----------------------------
    16. TAG ITEM
-----------------------------*/
.tag-item {
  display: block;
  height: 24px;
  padding: 0 12px;
  border-radius: 200px;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 24px;
}

.tag-item.secondary {
  background-color: var(--color-secondary);
  transition: background-color .2s ease-in-out;
}

.tag-item.secondary:hover {
  color: #fff;
  background-color: var(--color-primary);
}

.tag-item.secondary:focus {
  border: none;
  background-color: var(--color-primary);
}

/*-----------------------------
    17. XM TOOLTIP TEXT
-----------------------------*/
.xm-tooltip-text {
  padding: 0 12px;
  border-radius: 200px;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 24px;
}

/*--------------------------------
    18. USER SHORT DESCRIPTION
--------------------------------*/
.user-short-description {
  padding-top: 84px;
  position: relative;
}

.user-short-description.big {
  padding-top: 52px;
}

.user-short-description.big .user-short-description-avatar {
  top: -116px;
  margin-left: -74px;
}

.user-short-description.big .user-short-description-title {
  font-size: 1.5rem;
}

.user-short-description.big .user-short-description-text {
  font-size: 0.875rem;
}

.user-short-description.small {
  padding-top: 62px;
}

.user-short-description.small .user-short-description-avatar {
  margin-left: -50px;
}

.user-short-description.landscape {
  padding: 0 0 0 32px;
}

.user-short-description.landscape .user-short-description-avatar {
  top: 0;
  margin-left: 0;
}

.user-short-description.landscape .user-short-description-title,
.user-short-description.landscape .user-short-description-text {
  text-align: left;
}

.user-short-description.landscape.tiny .user-short-description-avatar {
  left: -25px;
  top: 50%;
  margin-top: -26px;
}

.user-short-description .user-short-description-avatar {
  position: absolute;
  top: -54px;
  left: 50%;
  margin-left: -60px;
}

.user-short-description .user-short-description-title,
.user-short-description .user-short-description-text {
  font-weight: 700;
  text-align: center;
}

.user-short-description .user-short-description-title {
  font-size: 1.125rem;
}

.user-short-description .user-short-description-title a {
  color: var(--color-text);
  font-weight: 700;
}

.user-short-description .user-short-description-title.small {
  font-size: 0.875rem;
}

.user-short-description .vikinger-pmpro-level-tag {
  margin-top: 4px;
}

.user-short-description .vikinger-pmpro-level-tag.vikinger-pmpro-level-tag_small {
  margin-top: 2px;
}

.user-short-description .vikinger-user-tag {
  margin-top: 4px;
}

.user-short-description .vikinger-user-tag.vikinger-user-tag_small {
  margin-top: 2px;
}

.user-short-description .user-short-description-text {
  margin-top: 6px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
}

.user-short-description .user-short-description-text a {
  color: var(--color-text);
  font-weight: 500;
}

.user-short-description .user-short-description-text a:hover {
  color: var(--color-primary-dark);
}

/*-----------------------------
    19. USER PREVIEW WIDGET
-----------------------------*/
.user-preview-widget {
  border-radius: 12px;
  padding-bottom: 28px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.user-preview-widget .user-preview-widget-cover {
  height: 132px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.user-preview-widget .user-short-description.small {
  padding-top: 44px;
}

.user-preview-widget .user-short-description.small .user-short-description-avatar {
  top: -72px;
}

.user-preview-widget>.tag-sticker {
  position: absolute;
  top: 104px;
  right: 32px;
}

.user-preview-widget .user-preview-widget-footer>* {
  position: absolute;
  bottom: 32px;
}

.user-preview-widget .user-preview-widget-footer>*:first-child {
  left: 32px;
}

.user-preview-widget .user-preview-widget-footer>*:last-child {
  right: 32px;
}

.user-preview-widget .user-preview-widget-footer .button {
  width: 64px;
}

.user-preview-widget .user-preview-widget-footer .user-stats .user-stat {
  padding: 0;
}

.user-preview-widget .user-preview-widget-footer .user-stats .user-stat .user-stat-title,
.user-preview-widget .user-preview-widget-footer .user-stats .user-stat .user-stat-text {
  text-align: right;
}

/*-----------------------------
    19. SLIDER CONTROL
-----------------------------*/
.slider-control {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

.slider-control.medium {
  width: 32px;
  height: 32px;
}

.slider-control.solid {
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  border-radius: 10px;
  transition: background-color .2s ease-in-out;
}

.slider-control.solid .slider-control-icon {
  fill: var(--color-icon-highlighted);
  opacity: 1;
}

.slider-control.solid:hover {
  background-color: var(--color-primary);
}

.slider-control.solid:hover .slider-control-icon {
  fill: #fff;
}

.slider-control.negative .slider-control-icon {
  fill: #fff;
}

.slider-control.negative.disabled,
.slider-control.negative[aria-disabled=true] {
  opacity: .4;
}

.slider-control.negative.disabled:hover .slider-control-icon,
.slider-control.negative[aria-disabled=true]:hover .slider-control-icon {
  fill: #fff;
  opacity: .4;
}

.slider-control.negative:hover .slider-control-icon {
  fill: #fff;
  opacity: 1;
}

.slider-control.disabled,
.slider-control[aria-disabled=true] {
  opacity: .5;
}

.slider-control.disabled:hover .slider-control-icon,
.slider-control[aria-disabled=true]:hover .slider-control-icon {
  fill: var(--color-icon);
  opacity: .5;
}

.slider-control .slider-control-icon {
  fill: var(--color-icon);
  pointer-events: none;
  opacity: .6;
  transition: fill .2s ease-in-out, opacity .2s ease-in-out;
}

.slider-control.left .slider-control-icon {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.slider-control:hover .slider-control-icon {
  fill: var(--color-icon-highlighted);
  opacity: 1;
}

/*-----------------------------
    20. SLIDER ROSTER
-----------------------------*/
.slider-roster {
  display: -ms-flexbox;
  display: flex;
}

.slider-roster .slider-roster-item {
  margin-right: 8px;
}

.slider-roster .slider-roster-item:last-child {
  margin-right: 0;
}

/*-----------------------------
    21. SLIDER ROSTER ITEM
-----------------------------*/
.slider-roster-item {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background-color: var(--color-icon-highlighted);
  opacity: .2;
  cursor: pointer;
}

.slider-roster-item.active {
  opacity: 1;
}

/*-----------------------------
    22. TAG STICKER
-----------------------------*/
.tag-sticker {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
}

.tag-sticker.small {
  height: 36px;
}

.tag-sticker.tertiary {
  background-color: var(--color-tertiary);
}

.tag-sticker .tag-sticker-icon {
  fill: var(--color-icon-highlighted);
}

.tag-sticker .tag-sticker-icon.spaced {
  position: relative;
  left: -12px;
}

.tag-sticker .tag-sticker-icon.white {
  fill: #fff;
}

.tag-sticker .tag-sticker-icon.primary {
  fill: var(--color-primary);
}

.tag-sticker .tag-sticker-icon.secondary {
  fill: var(--color-secondary);
}

.tag-sticker .tag-sticker-icon.tertiary {
  fill: var(--color-tertiary);
}

/*-----------------------------
    23. TEXT STICKER
-----------------------------*/
.text-sticker {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 32px;
  padding: 0 14px;
  border-radius: 200px;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 32px;
}

.text-sticker.round {
  border-radius: 12px;
}

.text-sticker .highlighted {
  color: var(--color-primary-dark);
}

.text-sticker .text-sticker-icon {
  margin-right: 6px;
  fill: var(--color-primary-dark);
}

.text-sticker .text-sticker-icon.tertiary {
  fill: var(--color-tertiary);
}

.text-sticker .text-sticker-image {
  margin-left: 4px;
  width: auto;
  height: 14px;
}

.text-sticker.small-text {
  font-size: 0.75rem;
}

.text-sticker.small {
  height: 24px;
  padding: 0 12px;
  font-size: 0.75rem;
  line-height: 24px;
}

.text-sticker.medium {
  height: 44px;
  padding: 0 16px;
  line-height: 44px;
}

.text-sticker.negative {
  color: #fff;
  background: #15151f;
}

.text-sticker.void {
  box-shadow: none;
  background-color: transparent;
}

/*-----------------------------
    24. DATE STICKER
-----------------------------*/
.date-sticker {
  width: 44px;
}

.date-sticker .date-sticker-day,
.date-sticker .date-sticker-month {
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

.date-sticker .date-sticker-day {
  padding: 10px 0 6px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background-color: #3e3f5e;
  font-size: 1.25rem;
}

.date-sticker .date-sticker-month {
  padding: 4px 0;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-primary);
  font-size: 0.75rem;
}

/*-----------------------------
    25. DECORATED TEXT
-----------------------------*/
.decorated-text {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.decorated-text .decorated-text-icon {
  margin-right: 8px;
  fill: var(--color-primary);
}

.decorated-text .decorated-text-content {
  font-size: 0.875rem;
  font-weight: 500;
}

/*-----------------------------
    26. SIMPLE DROPDOWN
-----------------------------*/
.simple-dropdown {
  width: 140px;
  padding: 10px 0;
  border-radius: 12px;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-dark-shadow);
}

.simple-dropdown.padded {
  padding: 12px 16px 16px;
}

.simple-dropdown .simple-dropdown-link {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  padding: 8px 16px;
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: color .2s ease-in-out, padding-left .2s ease-in-out;
}

.simple-dropdown .simple-dropdown-link:hover {
  padding-left: 20px;
  color: var(--color-primary-dark);
}

.simple-dropdown .simple-dropdown-link .loader-spinner-wrap .loader-spinner::after {
  background-color: var(--color-box-over-box-light-background);
}

.simple-dropdown .simple-dropdown-text {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 500;
}

.simple-dropdown .simple-dropdown-text+.simple-dropdown-text {
  margin-top: 4px;
}

.simple-dropdown .simple-dropdown-text .reaction {
  margin-right: 4px;
}

.simple-dropdown .simple-dropdown-text .bold {
  font-weight: 700;
}

/*-----------------------------
    27. PARAGRAPH
-----------------------------*/
.paragraph {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  word-break: break-word;
}

/*--------------------------------
    28. INFORMATION LINE LIST
--------------------------------*/
.information-line-list .information-line {
  margin-bottom: 14px;
}

.information-line-list .information-line:last-child {
  margin-bottom: 0;
}

/*-----------------------------
    29. INFORMATION LINE
-----------------------------*/
.information-line {
  display: -ms-flexbox;
  display: flex;
}

.information-line .information-line-title,
.information-line .information-line-text {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  word-break: break-word;
}

.information-line .information-line-title {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 80px;
  color: var(--color-text-alt);
}

.information-line .information-line-text a {
  word-break: break-word;
}

.information-line .information-line-text .bold {
  font-weight: 700;
}

/*---------------------------------
    30. INFORMATION BLOCK LIST
---------------------------------*/
.information-block-list .information-block {
  margin-bottom: 26px;
}

.information-block-list .information-block:last-child {
  margin-bottom: 0;
}

/*-----------------------------
    31. INFORMATION BLOCK
-----------------------------*/
.information-block .information-block-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.information-block .information-block-text {
  margin-top: 10px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

/*------------------------------------
    32. TIMELINE INFORMATION LIST
------------------------------------*/
.timeline-information-list .timeline-information {
  padding-bottom: 24px;
}

.timeline-information-list .timeline-information:last-child {
  padding-bottom: 0;
}

.timeline-information-list .timeline-information:last-child::before {
  display: none;
}

/*---------------------------------
    33. TIMELINE INFORMATION
---------------------------------*/
.timeline-information {
  padding-left: 28px;
  position: relative;
}

.timeline-information::before {
  content: '';
  width: 1px;
  height: 100%;
  background-color: var(--color-divider);
  position: absolute;
  top: 0;
  left: 6px;
}

.timeline-information::after {
  content: '';
  width: 13px;
  height: 13px;
  border: 4px solid var(--color-primary);
  border-radius: 50%;
  position: absolute;
  top: -2px;
  left: 0;
}

.timeline-information .timeline-information-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.timeline-information .timeline-information-date {
  margin-top: 6px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.timeline-information .timeline-information-text {
  margin-top: 8px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

/*---------------------------------
    34. RATING LIST
---------------------------------*/
.rating-list {
  display: -ms-flexbox;
  display: flex;
}

.rating-list.form-rating .rating {
  cursor: pointer;
}

.rating-list .rating {
  margin-right: 3px;
}

.rating-list .rating.medium {
  margin-right: 4px;
}

.rating-list .rating:last-child {
  margin-right: 0;
}

.rating-list .rating:last-child.medium {
  margin-right: 0;
}

/*---------------------------------
    35. RATING
---------------------------------*/
.rating {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 9px;
  height: 8px;
}

.rating.dark .rating-icon {
  fill: #8f91ac;
}

.rating.dark.filled .rating-icon {
  fill: #fff10d;
}

.rating.medium {
  width: 13px;
  height: 12px;
}

.rating.filled .rating-icon {
  fill: #ffe00d;
}

.rating .rating-icon {
  fill: #eaeaf5;
}

/*---------------------------------
    36. FILTERS
---------------------------------*/
.filters {
  display: -ms-flexbox;
  display: flex;
}

.filters .filter {
  margin-right: 20px;
  padding-bottom: 4px;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  opacity: .6;
  cursor: pointer;
  transition: color .2s ease-in-out, opacity .2s ease-in-out;
}

.filters .filter.active,
.filters .filter:hover {
  color: var(--color-text);
  opacity: 1;
}

.filters .filter.active {
  border-bottom: 2px solid var(--color-primary);
}

.filters .filter:last-child {
  margin-right: 0;
}

/*---------------------------------
    37. FILTER TABS
---------------------------------*/
.filter-tabs {
  display: -ms-flexbox;
  display: flex;
}

.filter-tabs .filter-tab::before {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 38px;
  left: 0;
}

.filter-tabs .filter-tab:last-child::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 38px;
  right: 0;
}

/*---------------------------------
    38. FILTER TAB
---------------------------------*/
.filter-tab {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 162px;
  height: 100%;
  border-bottom: 4px solid transparent;
  cursor: pointer;
  position: relative;
  transition: border-color .2s ease-in-out;
}

.filter-tab.secondary.active {
  border-bottom-color: var(--color-secondary);
}

.filter-tab.active {
  border-bottom-color: var(--color-primary);
}

.filter-tab.active .filter-tab-text {
  color: var(--color-text);
}

.filter-tab .filter-tab-text {
  padding: 4px 0;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  transition: color .2s ease-in-out;
}

/*---------------------------------
    39. VIEW ACTIONS
---------------------------------*/
.view-actions {
  display: -ms-flexbox;
  display: flex;
}

.view-actions .view-action {
  margin-right: 26px;
}

.view-actions .view-action:last-child {
  margin-right: 0;
}

/*---------------------------------
    40. VIEW ACTION
---------------------------------*/
.view-action {
  cursor: pointer;
}

.view-action.active .view-action-icon,
.view-action:hover .view-action-icon {
  fill: var(--color-icon-highlighted);
  opacity: 1;
}

.view-action .view-action-icon {
  fill: var(--color-icon);
  opacity: .4;
  transition: opacity .2s ease-in-out, fill .2s ease-in-out;
}

/*---------------------------------
    41. TWEETS
---------------------------------*/
.tweets .tweet {
  margin-bottom: 28px;
}

.tweets .tweet:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    42. TWEET
---------------------------------*/
.tweet .tweet-author {
  display: block;
  min-height: 32px;
  padding-left: 40px;
  position: relative;
}

.tweet .tweet-author .tweet-author-image {
  position: absolute;
  top: 0;
  left: 0;
}

.tweet .tweet-author .tweet-author-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.tweet .tweet-author .tweet-author-text {
  margin-top: 6px;
  font-size: 0.75rem;
  font-weight: 500;
}

.tweet .tweet-text {
  display: block;
  margin-top: 16px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.tweet .tweet-text .highlighted {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.tweet .tweet-timestamp {
  margin-top: 12px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

/*---------------------------------
    43. PLAY BUTTON
---------------------------------*/
.play-button {
  width: 46px;
  height: 46px;
  padding: 12px 0 0 15px;
  border: 4px solid var(--color-primary);
  border-radius: 50%;
  background-color: rgba(21, 21, 31, 0.96);
}

.play-button .play-button-icon {
  display: block;
}

.play-button.medium {
  width: 60px;
  height: 60px;
  border-width: 6px;
  padding: 15px 0 0 18px;
}

.play-button.centered {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0;
}

.post-format-tag,
.gallery-popup-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background-color: var(--color-primary);
  box-shadow: 3px 5px 20px 0px rgba(94, 92, 154, 0.3);
}

.post-format-tag .post-format-tag-icon {
  fill: #fff;
}

.gallery-popup-button {
  cursor: pointer;
  transition: background-color .2s ease-in-out;
}

.gallery-popup-button:hover {
  background-color: var(--color-primary-hover);
}

/*---------------------------------
    44. MEDIA LINK PREVIEW
---------------------------------*/
.media-link-preview {
  position: relative;
}

.media-link-preview.disabled {
  opacity: .5;
}

.media-link-preview .media-link-preview-close-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 18px;
  height: 18px;
  border-bottom-left-radius: 6px;
  background-color: var(--color-tertiary);
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  cursor: pointer;
}

.media-link-preview .media-link-preview-close-button .media-link-preview-close-button-icon {
  width: 8px;
  height: 8px;
  pointer-events: none;
}

/*---------------------------------
    44. IFRAME WRAP
---------------------------------*/
.iframe-wrap {
  width: 100%;
  padding-top: 56.25%;
  position: relative;
}

.iframe-wrap iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

/*---------------------------------
    44. VIDEO WRAP
---------------------------------*/
.video-wrap {
  width: 100%;
  padding-top: 56.25%;
  position: relative;
}

.video-wrap video {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

/*---------------------------------
    45. POPUP VIDEO
---------------------------------*/
.popup-video {
  width: 80%;
  opacity: 0;
  visibility: hidden;
}

/*---------------------------------
    46. POPUP PICTURE
---------------------------------*/
.popup-picture {
  height: 100%;
  display: -ms-flexbox;
  display: flex;
}

.popup-picture .widget-box {
  width: 384px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.popup-picture .widget-box .widget-box-status .widget-box-status-header .user-status {
  padding-right: 0;
}

.popup-picture .widget-box .meta-line.settings {
  margin-left: 22px;
}

.popup-picture .widget-box .meta-line.settings .post-settings {
  width: 22px;
}

.popup-picture .popup-picture-image-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: #15151f;
}

.popup-picture .popup-picture-image-wrap .popup-picture-image {
  max-width: 100%;
  max-height: 90%;
}

.popup-picture .popup-picture-image-wrap .video-wrap video {
  max-height: 90%;
  top: 5%;
}

/*---------------------------------
    47. POPUP EVENT
---------------------------------*/
.popup-event {
  width: 90%;
  max-width: 584px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  opacity: 0;
  visibility: hidden;
}

.popup-event .popup-event-cover {
  width: 100%;
  height: 204px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.popup-event .popup-event-info {
  padding: 32px 28px;
  position: relative;
}

.popup-event .popup-event-info .user-avatar-list {
  margin-top: 18px;
}

.popup-event .popup-event-info .g-map {
  height: 260px;
  margin-top: 22px;
}

.popup-event .popup-event-title {
  font-size: 1.5rem;
  font-weight: 700;
}

.popup-event .popup-event-subtitle {
  margin-top: 32px;
  font-size: 1rem;
  font-weight: 700;
}

.popup-event .popup-event-text {
  margin-top: 16px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  color: var(--color-text);
}

.popup-event .decorated-feature-list {
  margin-top: 14px;
}

.popup-event .popup-event-button {
  width: 200px;
  position: absolute;
  top: -30px;
  right: 28px;
}

.popup-event>.content-actions {
  border-top: 1px solid var(--color-divider);
  margin: 0 28px;
}

/*---------------------------------
    48. POPUP CLOSE BUTTON
---------------------------------*/
.popup-close-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background-color: var(--color-secondary-dark);
  cursor: pointer;
  position: absolute;
  top: -20px;
  right: -20px;
  z-index: 2;
  transition: background-color .2s ease-in-out;
}

.popup-close-button:hover {
  background-color: var(--color-primary);
}

.popup-close-button .popup-close-button-icon {
  pointer-events: none;
}

/*---------------------------------
    49. DECORATED FEATURE LIST
---------------------------------*/
.decorated-feature-list {
  margin-top: -18px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.decorated-feature-list .decorated-feature {
  width: 50%;
  margin-top: 18px;
}

/*---------------------------------
    50. DECORATED FEATURE
---------------------------------*/
.decorated-feature {
  display: -ms-flexbox;
  display: flex;
}

.decorated-feature .decorated-feature-icon {
  margin-top: 6px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  fill: var(--color-primary);
}

.decorated-feature .decorated-feature-info {
  margin-left: 12px;
}

.decorated-feature .decorated-feature-title {
  font-size: 1rem;
  font-weight: 700;
}

.decorated-feature .decorated-feature-text {
  margin-top: 2px;
  color: #8f91ac;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

/*---------------------------------
    51. META LINE
---------------------------------*/
.meta-line {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.meta-line+.meta-line {
  margin-left: 22px;
}

.meta-line .meta-line-list+.meta-line-text {
  margin-left: 10px;
}

.meta-line.settings {
  margin-left: 14px;
}

.meta-line.settings .post-settings {
  width: 22px;
  height: 22px;
}

.meta-line.settings+.meta-line {
  margin-left: 14px;
}

.meta-line .meta-line-text {
  font-size: 0.75rem;
  font-weight: 700;
}

.meta-line .meta-line-text.meta-line-text-trigger {
  cursor: pointer;
}

.meta-line .meta-line-text a {
  color: var(--color-text);
  font-weight: 700;
}

.meta-line .meta-line-link {
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  transition: color .2s ease-in-out;
}

.meta-line .meta-line-link.light {
  color: var(--color-text-alt-2);
}

.meta-line .meta-line-link:hover {
  color: var(--color-primary-dark);
}

.meta-line .meta-line-timestamp {
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

.meta-line .meta-line-timestamp a {
  color: var(--color-text);
  font-weight: 700;
}

.meta-line .meta-line-timestamp a:hover {
  color: var(--color-primary-dark);
}

.meta-line .meta-line-timestamp.meta-line-timestamp_edited {
  margin-top: -8px;
}

.meta-line .meta-line-timestamp .user-avatar {
  display: inline-block;
  position: relative;
  top: 6px;
  left: auto;
  margin: 0 4px;
}

/*---------------------------------
    52. REACTION OPTIONS
---------------------------------*/
.reaction-options {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 64px;
  padding: 0 16px;
  border-radius: 200px;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-dark-shadow);
}

.reaction-options.small {
  height: 40px;
}

.reaction-options.small .reaction-option {
  width: 20px;
  height: 20px;
}

.reaction-options .reaction-option {
  width: 40px;
  height: 40px;
  margin-right: 8px;
  cursor: pointer;
  transition: -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out;
  transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.reaction-options .reaction-option:last-child {
  margin-right: 0;
}

.reaction-options .reaction-option:hover {
  -webkit-transform: translate(0, -4px);
  transform: translate(0, -4px);
}

.reaction-options .reaction-option .reaction-option-image {
  width: 100%;
  height: 100%;
}

/*---------------------------------
    53. POST OPTIONS
---------------------------------*/
.post-options {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  height: 65px;
  padding: 0 28px;
  border-top: 1px solid var(--color-divider);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-box-background-alt);
}

.post-options .post-option,
.post-options .post-option-wrap {
  width: 160px;
  margin-right: 8px;
}

.post-options .post-option:last-child,
.post-options .post-option-wrap:last-child {
  margin-right: 0;
}

.post-options .post-option .post-option,
.post-options .post-option-wrap .post-option {
  width: 100%;
  margin-right: 0;
}

/*---------------------------------
    54. POST OPTION
---------------------------------*/
.post-option {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 160px;
  height: 44px;
  border-radius: 12px;
  cursor: pointer;
  transition: box-shadow .2s ease-in-out, background-color .2s ease-in-out;
}

.post-option.no-text {
  width: 80px;
}

.post-option.no-text .post-option-icon {
  margin-right: 0;
}

.post-option.reaction-active,
.post-option.active,
.post-option:hover {
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
}

.post-option.reaction-active .post-option-icon,
.post-option.active .post-option-icon,
.post-option:hover .post-option-icon {
  fill: var(--color-primary);
  opacity: 1;
}

.post-option.reaction-active .post-option-text,
.post-option.active .post-option-text,
.post-option:hover .post-option-text {
  color: var(--color-text);
}

.post-option .post-option-icon,
.post-option .post-option-image {
  margin-right: 16px;
}

.post-option .post-option-icon {
  fill: var(--color-icon);
  opacity: .6;
  transition: fill .2s ease-in-out, opacity .2s ease-in-out;
}

.post-option .post-option-icon.icon-thumbs-up {
  position: relative;
  top: -2px;
}

.post-option .post-option-image {
  width: 20px;
  height: 20px;
}

.post-option .post-option-text {
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  transition: color .2s ease-in-out;
}

/*---------------------------------
    55. POST SETTINGS
---------------------------------*/
.post-settings {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 30px;
  cursor: pointer;
}

.post-settings .post-settings-icon {
  fill: var(--color-icon);
  opacity: 1;
  transition: fill .2s ease-in-out;
}

.post-settings.active .post-settings-icon,
.post-settings:hover .post-settings-icon {
  fill: var(--color-icon-highlighted);
}

/*---------------------------------
    56. SLIDER LINE
---------------------------------*/
.slider-line {
  height: 120px;
  padding: 0 48px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.slider-line.small {
  height: 100px;
}

.slider-line.small .slider-controls {
  top: 40px;
}

.slider-line.small .slider-slides .user-stat {
  height: 100px;
}

.slider-line.medium {
  height: 160px;
}

.slider-line.medium .slider-controls {
  top: 70px;
}

.slider-line.medium .slider-slides.with-separator .slider-slide::before {
  height: 40px;
  top: 60px;
}

.slider-line.medium .slider-slides.with-separator .slider-slide:last-child::after {
  height: 40px;
  top: 60px;
}

.slider-line.medium .slider-slides .reaction-stat {
  height: 160px;
}

.slider-line .slider-controls {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding: 0 14px;
  position: absolute;
  top: 50px;
  left: 0;
  z-index: 1;
}

.slider-line .slider-slides {
  position: relative;
  z-index: 2;
}

.slider-line .slider-slides.with-separator .slider-slide {
  position: relative;
}

.slider-line .slider-slides.with-separator .slider-slide::before {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 40px;
  left: 0;
}

.slider-line .slider-slides.with-separator .slider-slide:last-child::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 40px;
  right: 0;
}

.slider-line .slider-slides .stat-block {
  height: 120px;
  padding-left: 28px;
  -ms-flex-align: center;
  align-items: center;
}

.slider-line .slider-slides .user-stat {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
}

.slider-line .slider-slides .reaction-stat {
  -ms-flex-pack: center;
  justify-content: center;
}

/*---------------------------------
    57. STAT BLOCK LIST
---------------------------------*/
.stat-block-list .stat-block {
  margin-bottom: 22px;
}

.stat-block-list .stat-block:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    58. STAT BLOCK
---------------------------------*/
.stat-block {
  display: -ms-flexbox;
  display: flex;
  min-height: 48px;
}

.stat-block .stat-block-decoration {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: linear-gradient(-145deg, #41efff, #615dfa);
  margin-right: 16px;
}

.stat-block .stat-block-decoration .stat-block-decoration-icon {
  fill: #fff;
}

.stat-block .stat-block-info {
  margin-top: 6px;
}

.stat-block .stat-block-info .stat-block-title {
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.stat-block .stat-block-info .stat-block-text {
  margin-top: 8px;
  font-size: 1rem;
  font-weight: 700;
}

/*---------------------------------
    59. ACHIEVEMENT STATUS LIST
---------------------------------*/
.achievement-status-list {
  display: -ms-flexbox;
  display: flex;
}

.achievement-status-list .achievement-status {
  width: 50%;
}

.achievement-status-list .achievement-status .achievement-status-info {
  position: relative;
}

.achievement-status-list .achievement-status .achievement-status-info::after {
  content: '';
  width: 1px;
  height: 100%;
  background-color: var(--color-divider);
  position: absolute;
  top: 0;
  right: 0;
}

.achievement-status-list .achievement-status:last-child .achievement-status-info::after {
  display: none;
}

/*---------------------------------
    60. ACHIEVEMENT STATUS
---------------------------------*/
.achievement-status {
  text-align: center;
}

.achievement-status .achievement-status-progress {
  font-size: 1.375rem;
  font-weight: 700;
}

.achievement-status .achievement-status-info {
  margin-top: 14px;
}

.achievement-status .achievement-status-info .achievement-status-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.achievement-status .achievement-status-info .achievement-status-text {
  margin-top: 6px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.achievement-status .achievement-status-image {
  display: block;
  margin: 22px auto 0;
}

/*---------------------------------
    61. PAGE LOADER
---------------------------------*/
.page-loader {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: var(--color-loading-screen-background);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999999;
  transition: opacity .4s ease-in-out, visibility .4s ease-in-out;
}

.page-loader.hidden {
  opacity: 0;
  visibility: hidden;
}

.page-loader .page-loader-logo {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
}

.page-loader .page-loader-info .page-loader-info-title,
.page-loader .page-loader-info .page-loader-info-text {
  color: #fff;
  text-transform: uppercase;
  text-align: center;
}

.page-loader .page-loader-info .page-loader-info-title {
  margin-top: 24px;
  font-family: var(--font-secondary);
  font-size: 1.75rem;
  font-weight: 900;
}

.page-loader .page-loader-info .page-loader-info-text {
  margin-top: 10px;
  font-size: 0.75rem;
  font-weight: 700;
}

.page-loader .page-loader-indicator {
  margin-top: 60px;
}

/*---------------------------------
    62. REACTION COUNT LIST
---------------------------------*/
.reaction-count-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
}

.reaction-count-list.landscape {
  -ms-flex-direction: row;
  flex-direction: row;
}

.reaction-count-list.landscape .reaction-count {
  margin: 0 32px 0 0;
}

.reaction-count-list.landscape .reaction-count:last-child {
  margin: 0;
}

.reaction-count-list .reaction-count {
  margin-bottom: 22px;
}

.reaction-count-list .reaction-count:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    63. REACTION COUNT
---------------------------------*/
.reaction-count {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.reaction-count.negative .reaction-count-icon {
  fill: var(--color-primary-light);
}

.reaction-count.negative .reaction-count-text {
  color: #fff;
}

.reaction-count .reaction-count-icon {
  fill: var(--color-primary);
}

.reaction-count .reaction-count-text {
  margin-left: 16px;
  font-size: 0.75rem;
  font-weight: 700;
  position: relative;
  top: 1px;
}

/*---------------------------------
    64. UPLOAD ITEM LIST
---------------------------------*/
.upload-item-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, 168px);
  grid-gap: 16px 22px;
  -ms-flex-pack: center;
  justify-content: center;
}

/*---------------------------------
    65. UPLOAD ITEM
---------------------------------*/
.upload-item:first-child {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 168px;
  background-color: var(--color-primary);
  border-radius: 12px;
  cursor: pointer;
}

.upload-item:first-child .icon-plus {
  pointer-events: none;
}

.upload-item .upload-item-image {
  width: 100%;
  height: 168px;
  border-radius: 12px;
}

.upload-item .form-input,
.upload-item .checkbox-wrap {
  margin-top: 16px;
}

/*---------------------------------
    66. SIMPLE ACCORDION LIST
---------------------------------*/
.simple-accordion-list .simple-accordion {
  margin-bottom: 22px;
}

.simple-accordion-list .simple-accordion:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    67. SIMPLE ACCORDION
---------------------------------*/
.simple-accordion .simple-accordion-header {
  position: relative;
}

.simple-accordion .simple-accordion-header.selected .simple-accordion-icon .icon-plus-small {
  display: none;
}

.simple-accordion .simple-accordion-header.selected .simple-accordion-icon .icon-minus-small {
  display: block;
}

.simple-accordion .simple-accordion-header .simple-accordion-title {
  padding-right: 16px;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 20px;
  cursor: pointer;
}

.simple-accordion .simple-accordion-header .simple-accordion-icon {
  position: absolute;
  top: 4px;
  right: 0;
  cursor: pointer;
}

.simple-accordion .simple-accordion-header .simple-accordion-icon .icon-plus-small,
.simple-accordion .simple-accordion-header .simple-accordion-icon .icon-minus-small {
  fill: var(--color-primary);
}

.simple-accordion .simple-accordion-header .simple-accordion-icon .icon-plus-small {
  display: block;
}

.simple-accordion .simple-accordion-header .simple-accordion-icon .icon-minus-small {
  display: none;
}

.simple-accordion .simple-accordion-header .simple-accordion-content {
  margin-top: 20px;
}

.simple-accordion .simple-accordion-header .simple-accordion-content .simple-accordion-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

/*---------------------------------
    68. WEEK BOX
---------------------------------*/
.week-box {
  display: -ms-flexbox;
  display: flex;
  background-color: var(--color-box-background);
  border-radius: 12px;
  box-shadow: var(--color-overbox-shadow);
}

.week-box .week-box-item {
  width: 14.2857142857%;
  position: relative;
}

.week-box .week-box-item::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 40px;
  right: 0;
}

.week-box .week-box-item:last-child::after {
  display: none;
}

/*---------------------------------
    69. WEEK BOX ITEM
---------------------------------*/
.week-box-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 100px;
}

.week-box-item.active {
  border-bottom: 4px solid var(--color-primary);
}

.week-box-item.active .week-box-item-title {
  color: var(--color-primary-dark);
}

.week-box-item.active .week-box-item-text {
  color: var(--color-text);
}

.week-box-item .week-box-item-title,
.week-box-item .week-box-item-text {
  font-weight: 700;
  text-transform: uppercase;
}

.week-box-item .week-box-item-title {
  font-size: 1.375rem;
}

.week-box-item .week-box-item-text {
  margin-top: 10px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
}

/*---------------------------------
    70. FORUM CATEGORY
---------------------------------*/
.forum-category {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.forum-category .forum-category-image {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.forum-category .forum-category-info {
  margin-left: 28px;
}

.forum-category .forum-category-info .forum-category-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.forum-category .forum-category-info .forum-category-title a {
  color: var(--color-text);
  font-weight: 700;
}

.forum-category .forum-category-info .forum-category-text {
  margin-top: 14px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.forum-category .forum-category-info .forum-category-link {
  margin-top: 16px;
  font-size: 0.875rem;
  font-weight: 700;
}

.forum-category .forum-category-info .forum-category-link a {
  color: var(--color-text);
  font-weight: 700;
}

.forum-category .forum-category-info .forum-category-link a:hover {
  color: var(--color-primary-dark);
}

/*---------------------------------
    71. DISCUSSION PREVIEW
---------------------------------*/
.discussion-preview.pinned .discussion-preview-title {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.discussion-preview.pinned .discussion-preview-title::before {
  content: 'Pinned';
  height: 20px;
  padding: 0 8px;
  margin-right: 12px;
  border-radius: 200px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 20px;
}

.discussion-preview .discussion-preview-title {
  font-size: 1rem;
  font-weight: 700;
}

.discussion-preview .discussion-preview-title+.discussion-preview-meta {
  margin-top: 8px;
}

.discussion-preview .page-items {
  margin-top: 12px;
}

.discussion-preview .discussion-preview-meta {
  margin-top: 14px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.discussion-preview .discussion-preview-meta .discussion-preview-meta-text {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
}

.discussion-preview .discussion-preview-meta .discussion-preview-meta-text a {
  color: var(--color-text);
  font-weight: 700;
}

.discussion-preview .discussion-preview-meta .discussion-preview-meta-text a.highlighted {
  color: var(--color-primary-dark);
}

.discussion-preview .discussion-preview-meta .discussion-preview-meta-text .separator {
  margin: 0 8px;
}

.discussion-preview .discussion-preview-meta .user-avatar,
.discussion-preview .discussion-preview-meta .user-avatar-circle {
  margin: 0 6px;
}

/*---------------------------------
    72. PAGE ITEMS
---------------------------------*/
.page-items {
  display: -ms-flexbox;
  display: flex;
}

.page-items .page-item {
  margin-right: 6px;
}

.page-items .page-item:last-child {
  margin-right: 0;
}

/*---------------------------------
    73. PAGE ITEM
---------------------------------*/
.page-item {
  height: 24px;
  padding: 0 8px;
  border-radius: 8px;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 24px;
}

.page-item.void {
  box-shadow: none;
}

/*---------------------------------
    74. QUICK POST
---------------------------------*/
.quick-post {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.quick-post.disabled {
  pointer-events: none;
}

.quick-post.disabled .video-wrap {
  opacity: .5;
}

.quick-post.medium .quick-post-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  min-height: 82px;
  padding-left: 28px;
}

.quick-post.medium .quick-post-body .form-textarea textarea {
  min-height: 200px;
}

.quick-post.medium .quick-post-footer {
  min-height: 92px;
}

.quick-post.medium .quick-post-footer .quick-post-footer-actions .button {
  width: 120px;
}

.quick-post.medium .quick-post-footer .quick-post-footer-actions .button:last-child {
  width: 140px;
}

.quick-post .quick-post-header {
  border-bottom: 1px solid var(--color-divider);
}

.quick-post .quick-post-header .quick-post-header-filters-wrap {
  min-height: 80px;
  padding: 0 28px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
}

.quick-post .quick-post-header .quick-post-header-filters-wrap .quick-post-header-filters .form-row.split .form-item {
  min-width: 120px;
}

.quick-post .quick-post-header .quick-post-header-title {
  font-size: 1rem;
  font-weight: 700;
}

.quick-post .quick-post-header .option-items {
  height: 65px;
  background-color: var(--color-box-background);
  border-top-right-radius: 12px;
  border-top-left-radius: 12px;
}

.quick-post .quick-post-header .option-items .option-item {
  width: 33.3333333333%;
}

.quick-post .quick-post-header .option-items .option-item::after {
  top: 22px;
}

.quick-post .quick-post-body {
  position: relative;
}

.quick-post .quick-post-body.with-share-data {
  background-color: var(--color-box-background-alt);
  padding-bottom: 28px;
}

.quick-post .quick-post-body.with-share-data>.widget-box {
  margin: 0 28px;
}

.quick-post .quick-post-body.with-share-data .widget-box-status {
  padding-bottom: 32px;
  margin-bottom: 0;
}

.quick-post .quick-post-body .form-textarea {
  background-color: var(--color-box-background-alt);
}

.quick-post .quick-post-body .form-textarea textarea {
  background-color: var(--color-box-background-alt);
  border-radius: 0;
  border: none;
}

.quick-post .quick-post-body .form-textarea textarea::-webkit-input-placeholder {
  font-weight: 500;
}

.quick-post .quick-post-body .form-textarea textarea::-moz-placeholder {
  font-weight: 500;
}

.quick-post .quick-post-body .form-textarea textarea:-ms-input-placeholder {
  font-weight: 500;
}

.quick-post .quick-post-body .form-textarea textarea::-ms-input-placeholder {
  font-weight: 500;
}

.quick-post .quick-post-body .form-textarea textarea::placeholder {
  font-weight: 500;
}

.quick-post .quick-post-body .form-textarea-limit {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  background-color: var(--color-box-background-alt);
}

.quick-post .quick-post-body .form-textarea-limit .loader-spinner-wrap .loader-spinner::after {
  background-color: var(--color-box-background-alt);
}

.quick-post .quick-post-body .form-textarea-limit .form-textarea-limit-text {
  color: var(--color-text-alt-2);
}

.quick-post .quick-post-body .uploadable-item-list {
  padding: 18px 28px;
  border-top: 1px solid var(--color-divider);
}

.quick-post .quick-post-footer-wrap {
  padding: 0 28px;
  border-top: 1px solid var(--color-divider);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.quick-post .quick-post-footer-errors {
  padding-top: 12px;
}

.quick-post .quick-post-footer-errors .quick-post-footer-error {
  margin-bottom: 12px;
}

.quick-post .quick-post-footer-errors .quick-post-footer-error:last-child {
  margin-bottom: 0;
}

.quick-post .quick-post-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  min-height: 76px;
}

.quick-post .quick-post-footer .quick-post-footer-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.quick-post .quick-post-footer .quick-post-footer-actions .quick-post-footer-action {
  margin-right: 22px;
}

.quick-post .quick-post-footer .quick-post-footer-actions .quick-post-footer-action:last-child {
  margin-right: 0;
}

.quick-post .quick-post-footer .quick-post-footer-actions .button {
  width: 80px;
  margin-right: 6px;
}

.quick-post .quick-post-footer .quick-post-footer-actions .button:last-child {
  margin-right: 0;
}

.quick-post .quick-post-footer .quick-post-footer-action {
  cursor: pointer;
}

.quick-post .quick-post-footer .quick-post-footer-action:hover .quick-post-footer-action-icon {
  fill: var(--color-icon-highlighted);
}

.quick-post .quick-post-footer .quick-post-footer-action .quick-post-footer-action-icon {
  transition: fill .2s ease-in-out;
}

/*---------------------------------
    75. MENTION LIST
---------------------------------*/
.mention-list {
  width: 180px;
  padding: 8px 0;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: absolute;
  z-index: 10000;
  overflow-y: auto;
}

.mention-list .mention-list-error-text {
  padding: 0 16px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 28px;
}

.mention-list .mention-list-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 28px;
  padding: 0 16px;
  cursor: pointer;
}

.mention-list .mention-list-item.active {
  background-color: var(--color-box-hover-background);
}

.mention-list .mention-list-item .user-avatar,
.mention-list .mention-list-item .user-avatar-circle {
  margin-right: 6px;
  position: relative;
  top: auto;
  left: auto;
}

.mention-list .mention-list-item .mention-list-item-text {
  font-size: 0.75rem;
  font-weight: 700;
}

.mention-list .mention-list-item .mention-list-item-text .highlighted {
  color: var(--color-primary);
}

/*---------------------------------
    75. OPTION ITEMS
---------------------------------*/
.option-items {
  display: -ms-flexbox;
  display: flex;
}

.option-items .option-item {
  position: relative;
}

.option-items .option-item::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 0;
  right: 0;
}

.option-items .option-item:last-child::after {
  display: none;
}

/*---------------------------------
    76. OPTION ITEM
---------------------------------*/
.option-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
}

.option-item.active {
  border-bottom: 4px solid var(--color-primary);
}

.option-item.active .option-item-icon {
  fill: var(--color-icon-highlighted);
}

.option-item.active .option-item-title {
  color: var(--color-text);
}

.option-item .option-item-icon {
  margin-right: 16px;
  fill: var(--color-icon);
}

.option-item .option-item-title {
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
}

/*---------------------------------
    77. STATS BOX
---------------------------------*/
.stats-box {
  height: 220px;
  padding: 90px 28px 0;
  border-radius: 12px;
}

.stats-box.small {
  height: 142px;
  padding-top: 32px;
}

.stats-box.small .stats-box-value {
  font-size: 1.75rem;
}

.stats-box.small .stats-box-title {
  font-size: 0.875rem;
}

.stats-box.small.stat-profile-views {
  background: url("img/graph/stat/01.jpg") no-repeat center;
  background-size: cover;
}

.stats-box.small.stat-posts-created {
  background: url("img/graph/stat/02.jpg") no-repeat center;
  background-size: cover;
}

.stats-box.small.stat-reactions-received {
  background: url("img/graph/stat/03.jpg") no-repeat center;
  background-size: cover;
}

.stats-box.small.stat-comments-received {
  background: url("img/graph/stat/04.jpg") no-repeat center;
  background-size: cover;
}

.stats-box.stat-profile-views {
  background: url("img/graph/stat/01-big.png") no-repeat center;
  background-size: cover;
}

.stats-box.stat-posts-created {
  background: url("img/graph/stat/02-big.png") no-repeat center;
  background-size: cover;
}

.stats-box.stat-reactions-received {
  background: url("img/graph/stat/03-big.png") no-repeat center;
  background-size: cover;
}

.stats-box.stat-comments-received {
  background: url("img/graph/stat/04-big.png") no-repeat center;
  background-size: cover;
}

.stats-box .stats-box-value,
.stats-box .stats-box-diff-value,
.stats-box .stats-box-title,
.stats-box .stats-box-text {
  color: #fff;
}

.stats-box .stats-box-value-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
  align-items: flex-start;
}

.stats-box .stats-box-value-wrap .stats-box-diff {
  margin-left: 12px;
}

.stats-box .stats-box-value {
  font-size: 2rem;
  font-weight: 700;
}

.stats-box .stats-box-diff {
  margin-left: 12px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  position: relative;
  top: 2px;
}

.stats-box .stats-box-diff .stats-box-diff-icon {
  margin-right: 4px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  border: 2px solid #fff;
}

.stats-box .stats-box-diff .stats-box-diff-icon .icon-plus-small,
.stats-box .stats-box-diff .stats-box-diff-icon .icon-minus-small {
  width: 6px;
  height: 6px;
}

.stats-box .stats-box-diff .stats-box-diff-icon.positive {
  border-color: var(--color-primary-light);
}

.stats-box .stats-box-diff .stats-box-diff-icon.positive .icon-plus-small {
  fill: var(--color-primary-light);
}

.stats-box .stats-box-diff .stats-box-diff-icon.negative {
  border-color: #ff5384;
}

.stats-box .stats-box-diff .stats-box-diff-icon.negative .icon-minus-small {
  fill: #ff5384;
}

.stats-box .stats-box-diff .stats-box-diff-value {
  font-size: 0.75rem;
  font-weight: 700;
  position: relative;
  top: 1px;
}

.stats-box .stats-box-title {
  margin-top: 10px;
  font-size: 1rem;
  font-weight: 700;
}

.stats-box .stats-box-text {
  margin-top: 2px;
  font-size: 0.75rem;
  font-weight: 500;
}

/*---------------------------------
    78. STATS BOX SLIDER
---------------------------------*/
.stats-box-slider {
  position: relative;
}

.stats-box-slider .stats-box-slider-controls {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 100%;
  padding: 28px 28px 0;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.stats-box-slider .stats-box-slider-controls .stats-box-slider-controls-title {
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
}

.stats-box-slider .stats-box-slider-controls .slider-controls {
  display: -ms-flexbox;
  display: flex;
}

.stats-box-slider .stats-box-slider-controls .slider-controls .slider-control:first-child {
  margin-right: 2px;
}

/*---------------------------------
    79. REACTION STATS
---------------------------------*/
.reaction-stats {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.reaction-stats .reaction-stat {
  width: 114px;
  position: relative;
}

.reaction-stats .reaction-stat::after {
  content: '';
  width: 1px;
  height: 40px;
  background-color: var(--color-divider);
  position: absolute;
  top: 32px;
  right: 0;
}

.reaction-stats .reaction-stat:last-child::after {
  display: none;
}

/*---------------------------------
    80. REACTION STAT
---------------------------------*/
.reaction-stat {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.reaction-stat .reaction-stat-image {
  width: 40px;
  height: 40px;
}

.reaction-stat .reaction-stat-title {
  margin-top: 16px;
  font-size: 1.375rem;
  font-weight: 700;
}

.reaction-stat .reaction-stat-text {
  margin-top: 8px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*---------------------------------
    81. SIMPLE TAB ITEMS
---------------------------------*/
.simple-tab-items {
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid var(--color-divider);
}

.simple-tab-items .simple-tab-item {
  margin-right: 40px;
}

.simple-tab-items .simple-tab-item:last-child {
  margin-right: 0;
}

.simple-tab-items .form {
  display: none;
}

/*---------------------------------
    82. SIMPLE TAB ITEM
---------------------------------*/
.simple-tab-item {
  height: 36px;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  opacity: .6;
  cursor: pointer;
}

.simple-tab-item.active {
  border-bottom: 4px solid var(--color-primary);
  color: var(--color-text);
  opacity: 1;
}

/*---------------------------------
    83. BANNER PROMO
---------------------------------*/
.banner-promo {
  display: block;
  width: 100%;
  max-width: 284px;
  height: auto;
  border-radius: 12px;
  margin: 0 auto;
}

.banner-promo img {
  width: 100%;
  height: 100%;
  border-radius: 12px;
}

/*---------------------------------
    84. POLL BOX
---------------------------------*/
.poll-box {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-over-box-background);
  box-shadow: var(--color-overbox-shadow);
}

.poll-box .poll-title {
  font-size: 1rem;
  font-weight: 700;
}

.poll-box .poll-text {
  margin-top: 4px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  color: var(--color-text-alt);
}

.poll-box .form,
.poll-box .poll-results {
  margin-top: 28px;
}

.poll-box .poll-box-actions {
  margin-top: 40px;
}

.poll-box .poll-box-actions .button {
  width: 140px;
  margin-right: 16px;
}

.poll-box .poll-box-actions .button:last-child {
  margin-right: 0;
}

/*---------------------------------
    85. POLL RESULTS
---------------------------------*/
.poll-results .poll-result {
  margin-bottom: 22px;
}

.poll-results .poll-result:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    86. POLL RESULT
---------------------------------*/
.poll-result .progress-stat {
  max-width: 472px;
}

.poll-result .meta-line {
  margin-top: 10px;
}

/*---------------------------------
    87. PICTURE COLLAGE
---------------------------------*/
.picture-collage .picture-collage-row {
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 6px;
}

.picture-collage .picture-collage-row:last-child {
  margin-bottom: 0;
}

.picture-collage .picture-collage-row.medium .picture-collage-item {
  width: 50%;
  height: 240px;
}

.picture-collage .picture-collage-row .picture-collage-item {
  width: 33.3333333333%;
  height: 160px;
  margin-right: 6px;
  position: relative;
  cursor: pointer;
}

.picture-collage .picture-collage-row .picture-collage-item:last-child {
  margin-right: 0;
}

.picture-collage .picture-collage-row .picture-collage-item .photo-preview-wrap {
  width: 100%;
  height: 100%;
}

.picture-collage .picture-collage-row .picture-collage-item .photo-preview-wrap .photo-preview {
  width: 100%;
  height: 100%;
}

.picture-collage .picture-collage-row .picture-collage-item .picture-collage-item-overlay {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background-color: rgba(35, 210, 226, 0.9);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}

.picture-collage .picture-collage-row .picture-collage-item .picture-collage-item-overlay .picture-collage-item-overlay-text {
  color: #fff;
  font-size: 1.5rem;
  font-weight: 700;
}

/*---------------------------------
    88. QUOTE BOX
---------------------------------*/
.quote-box {
  padding: 26px 28px;
  border-radius: 12px;
  background-color: var(--color-box-over-box-background);
  box-shadow: var(--color-overbox-shadow);
  position: relative;
}

.quote-box .quote-box-icon {
  fill: var(--color-primary);
  opacity: .1;
  position: absolute;
  top: 14px;
  left: 14px;
}

.quote-box .quote-box-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

/*---------------------------------
    89. STATS DECORATION
---------------------------------*/
.stats-decoration {
  height: 96px;
  padding: 28px 0 0 88px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.stats-decoration.secondary .stats-decoration-icon-wrap {
  background-color: var(--color-secondary);
}

.stats-decoration.primary .stats-decoration-icon-wrap {
  background-color: var(--color-primary);
}

.stats-decoration.v2 {
  height: 118px;
  padding: 24px 0 0 28px;
}

.stats-decoration.v2 .stats-decoration-title {
  font-size: 1.75rem;
}

.stats-decoration.v2 .stats-decoration-subtitle {
  margin-top: 8px;
  font-size: 0.875rem;
  font-weight: 700;
}

.stats-decoration.v2 .stats-decoration-text {
  margin-top: 6px;
}

.stats-decoration.v2 .percentage-diff {
  position: absolute;
  top: 24px;
  right: 28px;
}

.stats-decoration.v2.big {
  height: 213px;
  padding: 46px 0 0;
  text-align: center;
}

.stats-decoration.v2.big.secondary {
  background: url("img/graph/stat/05-big.png") repeat-x center bottom var(--color-box-background);
}

.stats-decoration.v2.big.primary {
  background: url("img/graph/stat/06-big.png") repeat-x center bottom var(--color-box-background);
}

.stats-decoration.v2.big .stats-decoration-title {
  font-size: 3rem;
}

.stats-decoration .stats-decoration-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  position: absolute;
  top: 26px;
  left: 28px;
  z-index: 1;
}

.stats-decoration .stats-decoration-icon-wrap .stats-decoration-icon {
  fill: #fff;
}

.stats-decoration .stats-decoration-title {
  font-size: 1.375rem;
  font-weight: 700;
}

.stats-decoration .stats-decoration-text {
  margin-top: 8px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*---------------------------------
    90. PERCENTAGE DIFF
---------------------------------*/
.percentage-diff {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.percentage-diff .percentage-diff-icon-wrap {
  margin-right: 4px;
}

.percentage-diff .percentage-diff-text {
  font-size: 0.75rem;
  font-weight: 700;
}

/*-----------------------------------
    91. PERCENTAGE DIFF ICON WRAP
-----------------------------------*/
.percentage-diff-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 16px;
  height: 16px;
  border: 2px solid transparent;
  border-radius: 50%;
}

.percentage-diff-icon-wrap.positive {
  border-color: var(--color-primary);
}

.percentage-diff-icon-wrap.positive .percentage-diff-icon {
  fill: var(--color-primary);
}

.percentage-diff-icon-wrap.negative {
  border-color: #ff5384;
}

.percentage-diff-icon-wrap.negative .percentage-diff-icon {
  fill: #ff5384;
}

.percentage-diff-icon-wrap .percentage-diff-icon {
  width: 6px;
  height: 6px;
}

/*---------------------------------
    92. SIDEBAR BOX
---------------------------------*/
.sidebar-box {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.sidebar-box.no-padding {
  padding: 0;
}

.sidebar-box.margin-top {
  margin-top: 56px;
}

.sidebar-box .sidebar-box-title {
  margin-top: 36px;
  font-size: 1rem;
  font-weight: 700;
}

.sidebar-box .sidebar-box-title.medium-space {
  margin-top: 60px;
}

.sidebar-box .sidebar-box-title:first-child {
  margin-top: 0;
}

.sidebar-box .sidebar-menu+.button {
  margin-top: 28px;
}

.sidebar-box .sidebar-menu+.sidebar-box-footer {
  border-top: 1px solid var(--color-divider);
}

.sidebar-box .sidebar-box-footer {
  padding: 28px;
}

.sidebar-box .sidebar-box-footer .button:first-child {
  margin-top: 0;
}

.sidebar-box .sidebar-box-items {
  margin-top: 36px;
}

.sidebar-box .sidebar-box-items:first-child {
  margin-top: 0;
}

.sidebar-box .sidebar-box-items.small-space {
  margin-top: 32px;
}

.sidebar-box .sidebar-box-items .form-input.small {
  width: 80px;
}

.sidebar-box .sidebar-box-items .user-status+.badge-list {
  margin-top: 20px;
}

.sidebar-box .sidebar-box-items .totals-line-list+.totals-line-list {
  margin-top: 26px;
}

.sidebar-box .sidebar-box-items .totals-line-list+.button {
  margin-top: 36px;
}

.sidebar-box .sidebar-box-items .totals-line-list+.price-title {
  margin-top: 32px;
}

.sidebar-box .sidebar-box-items .price-title {
  text-align: center;
}

.sidebar-box .sidebar-box-items .price-title+.totals-line-list {
  margin-top: 32px;
}

.sidebar-box .sidebar-box-items .badge-list+.button {
  margin-top: 32px;
}

.sidebar-box .sidebar-box-items .price-title+.form {
  margin-top: 40px;
}

.sidebar-box .sidebar-box-items .form .checkbox-wrap+.checkbox-wrap {
  margin-top: 22px;
}

.sidebar-box .sidebar-box-items .form+.button {
  margin-top: 30px;
}

.sidebar-box .sidebar-box-items .button+.user-stats {
  margin-top: 60px;
}

.sidebar-box .button {
  width: 100%;
  margin-top: 22px;
}

.sidebar-box .button.small-space {
  margin-top: 16px;
}

/*---------------------------------
    93. SIDEBAR MENU
---------------------------------*/
.sidebar-menu .sidebar-menu-item:first-child .sidebar-menu-header {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.sidebar-menu .sidebar-menu-item:last-child {
  border-bottom: none;
}

.sidebar-menu .sidebar-menu-item:last-child:not(.selected) .sidebar-menu-header {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.sidebar-menu .sidebar-menu-item:last-child .sidebar-menu-body {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.sidebar-menu.round-borders .sidebar-menu-item:last-child .sidebar-menu-header,
.sidebar-menu.round-borders .sidebar-menu-item:last-child .sidebar-menu-body {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

/*---------------------------------
    94. SIDEBAR MENU ITEM
---------------------------------*/
.sidebar-menu-item {
  border-bottom: 1px solid var(--color-divider);
}

.sidebar-menu-item.sidebar-menu-item-disable-header .sidebar-menu-body {
  border-top: none;
  border-radius: 12px;
  background-color: var(--color-box-background);
}

.sidebar-menu-item.selected .sidebar-menu-header .sidebar-menu-header-control-icon .sidebar-menu-header-control-icon-open {
  display: block;
}

.sidebar-menu-item.selected .sidebar-menu-header .sidebar-menu-header-control-icon .sidebar-menu-header-control-icon-closed {
  display: none;
}

/*---------------------------------
    95. SIDEBAR MENU HEADER
---------------------------------*/
.sidebar-menu-header {
  height: 112px;
  padding: 28px 26px 0 60px;
  background-color: var(--color-box-background);
  cursor: pointer;
  position: relative;
}

.sidebar-menu-header .sidebar-menu-header-icon {
  fill: var(--color-primary);
  position: absolute;
  top: 28px;
  left: 28px;
}

.sidebar-menu-header .sidebar-menu-header-control-icon .sidebar-menu-header-control-icon-open,
.sidebar-menu-header .sidebar-menu-header-control-icon .sidebar-menu-header-control-icon-closed {
  fill: var(--color-icon-highlighted);
  position: absolute;
  top: 32px;
  right: 28px;
}

.sidebar-menu-header .sidebar-menu-header-control-icon .sidebar-menu-header-control-icon-open {
  display: none;
}

.sidebar-menu-header .sidebar-menu-header-title {
  font-size: 1rem;
  font-weight: 700;
}

.sidebar-menu-header .sidebar-menu-header-text {
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.3333333333em;
}

/*---------------------------------
    96. SIDEBAR MENU BODY
---------------------------------*/
.sidebar-menu-body {
  padding: 12px 0 12px 60px;
  border-top: 1px solid var(--color-divider);
  background-color: var(--color-box-background-alt);
}

.sidebar-menu-body.secondary .sidebar-menu-link:hover,
.sidebar-menu-body.secondary .sidebar-menu-link.active {
  color: var(--color-secondary);
}

.sidebar-menu-body .sidebar-menu-link {
  display: block;
  height: 34px;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 34px;
  cursor: pointer;
  transition: color .25s ease-in-out, -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out, color .25s ease-in-out;
  transition: transform .2s ease-in-out, color .25s ease-in-out, -webkit-transform .2s ease-in-out;
}

.sidebar-menu-body .sidebar-menu-link:hover,
.sidebar-menu-body .sidebar-menu-link.active {
  color: var(--color-primary-dark);
  -webkit-transform: translate(4px, 0);
  transform: translate(4px, 0);
}

/*---------------------------------
    97. PRICE TITLE
---------------------------------*/
.price-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.price-title.separator-bottom {
  padding-bottom: 32px;
  border-bottom: 1px solid var(--color-divider);
}

.price-title .currency {
  color: var(--color-primary-dark);
}

.price-title.big {
  font-size: 2.875rem;
}

/*---------------------------------
    98. PROMO LINE
---------------------------------*/
.promo-line {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  min-height: 98px;
  padding: 0 20px 0 32px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.promo-line .promo-line-text {
  width: 310px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.promo-line .promo-line-actions {
  display: -ms-flexbox;
  display: flex;
}

.promo-line .promo-line-actions .form-input {
  margin-right: 16px;
}

.promo-line .form-input {
  width: 240px;
}

.promo-line .button {
  width: 180px;
}

/*---------------------------------
    99. TAB BOX
---------------------------------*/
.tab-box {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.tab-box .tab-box-options {
  display: -ms-flexbox;
  display: flex;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.tab-box .tab-box-options .tab-box-option:first-child {
  border-top-left-radius: 12px;
}

.tab-box .tab-box-options .tab-box-option:last-child {
  border-right: none;
  border-top-right-radius: 12px;
}

.tab-box .tab-box-option {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 66px;
  border-bottom: 1px solid var(--color-divider);
  border-right: 1px solid var(--color-divider);
  background-color: var(--color-box-background-alt);
  cursor: pointer;
}

.tab-box .tab-box-option .tab-box-option-title {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
}

.tab-box .tab-box-option .tab-box-option-title .highlighted {
  color: var(--color-primary-dark);
}

.tab-box .tab-box-option.active {
  background-color: var(--color-box-background);
  border-bottom: none;
}

.tab-box .tab-box-option.active .tab-box-option-title {
  color: var(--color-text);
}

.tab-box .tab-box-item .tab-box-item-content {
  padding: 0 28px 48px;
}

.tab-box .tab-box-item .tab-box-item-content .tab-box-item-title {
  margin-top: 48px;
  font-size: 1.375rem;
  font-weight: 700;
}

.tab-box .tab-box-item .tab-box-item-content .tab-box-item-paragraph {
  margin-top: 28px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.tab-box .tab-box-item .tab-box-item-content .bullet-item-list {
  margin-top: 32px;
}

/*---------------------------------
    100. BULLET ITEM LIST
---------------------------------*/
.bullet-item-list .bullet-item {
  margin-bottom: 12px;
}

.bullet-item-list .bullet-item:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    101. BULLET ITEM
---------------------------------*/
.bullet-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.bullet-item .bullet-item-icon {
  margin-right: 12px;
  fill: var(--color-primary);
}

.bullet-item .bullet-item-text {
  font-size: 0.875rem;
  font-weight: 700;
}

/*---------------------------------
    102. ORDERED ITEM LIST
---------------------------------*/
.ordered-item-list .ordered-item {
  margin-bottom: 12px;
}

.ordered-item-list .ordered-item:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    103. ORDERED ITEM
---------------------------------*/
.ordered-item {
  display: -ms-flexbox;
  display: flex;
}

.ordered-item .ordered-item-bullet {
  width: 28px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.7142857143em;
}

.ordered-item .ordered-item-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

/*---------------------------------
    104. PROFILE STATS
---------------------------------*/
.profile-stats {
  padding-bottom: 32px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.profile-stats.fixed-height {
  height: 558px;
  padding-bottom: 0;
}

.profile-stats .profile-stats-cover {
  height: 160px;
  padding-top: 34px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background: url("img/banner/banner-profile-stats.jpg") no-repeat center;
  background-size: cover;
}

.profile-stats .profile-stats-cover .profile-stats-cover-title,
.profile-stats .profile-stats-cover .profile-stats-cover-text {
  color: #fff;
  text-align: center;
}

.profile-stats .profile-stats-cover .profile-stats-cover-title {
  font-size: 1.5rem;
  font-weight: 700;
}

.profile-stats .profile-stats-cover .profile-stats-cover-text {
  margin-top: 4px;
  font-size: 1rem;
  font-weight: 500;
}

.profile-stats .profile-stats-info .user-avatar,
.profile-stats .profile-stats-info .user-avatar-circle {
  margin: -60px auto 0;
}

.profile-stats .profile-stats-info .featured-stat-list {
  margin-top: 18px;
}

.profile-stats .profile-stats-info .featured-stat-list+.featured-stat-list {
  margin-top: 38px;
}

/*---------------------------------
    105. FEATURED STAT LIST
---------------------------------*/
.featured-stat-list {
  display: -ms-flexbox;
  display: flex;
}

.featured-stat-list .featured-stat {
  width: 100%;
  position: relative;
}

.featured-stat-list .featured-stat::after {
  content: '';
  width: 1px;
  height: 40px;
  background-color: var(--color-divider);
  position: absolute;
  top: 52px;
  right: 0;
}

.featured-stat-list .featured-stat:last-child::after {
  display: none;
}

/*---------------------------------
    106. FEATURED STAT
---------------------------------*/
.featured-stat {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.featured-stat .featured-stat-icon {
  fill: var(--color-icon-highlighted);
}

.featured-stat .featured-stat-title {
  margin-top: 20px;
  font-size: 1.375rem;
  font-weight: 700;
}

.featured-stat .featured-stat-subtitle {
  margin-top: 12px;
  font-size: 0.875rem;
  font-weight: 700;
}

.featured-stat .featured-stat-text {
  margin-top: 6px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.featured-stat .progress-arc-wrap+.featured-stat-subtitle {
  margin-top: 20px;
}

/*---------------------------------
    107. FEATURED STAT BOX
---------------------------------*/
.featured-stat-box {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.featured-stat-box.reactioner .featured-stat-box-cover {
  background: url("img/banner/banner-reaction.jpg") no-repeat center;
  background-size: cover;
}

.featured-stat-box.commenter .featured-stat-box-cover {
  background: url("img/banner/banner-commenter.jpg") no-repeat center;
  background-size: cover;
}

.featured-stat-box .featured-stat-box-cover {
  height: 120px;
  padding-top: 32px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.featured-stat-box .featured-stat-box-cover .featured-stat-box-cover-title,
.featured-stat-box .featured-stat-box-cover .featured-stat-box-cover-text {
  color: #fff;
  text-align: center;
}

.featured-stat-box .featured-stat-box-cover .featured-stat-box-cover-title {
  font-size: 1.5rem;
  font-weight: 700;
}

.featured-stat-box .featured-stat-box-cover .featured-stat-box-cover-text {
  margin-top: 6px;
  font-size: 0.875rem;
  font-weight: 500;
}

.featured-stat-box .featured-stat-box-info {
  padding-bottom: 28px;
}

.featured-stat-box .featured-stat-box-info .user-avatar,
.featured-stat-box .featured-stat-box-info .user-avatar-circle {
  margin: -30px auto 0;
}

.featured-stat-box .featured-stat-box-title,
.featured-stat-box .featured-stat-box-subtitle,
.featured-stat-box .featured-stat-box-text {
  text-align: center;
}

.featured-stat-box .featured-stat-box-title {
  margin-top: 8px;
  font-size: 1.375rem;
  font-weight: 700;
}

.featured-stat-box .featured-stat-box-subtitle {
  margin-top: 14px;
  font-size: 0.875rem;
  font-weight: 700;
}

.featured-stat-box .featured-stat-box-text {
  margin-top: 4px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*---------------------------------
    108. ACHIEVEMENT BOX
---------------------------------*/
.achievement-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  min-height: 142px;
  padding: 0 28px;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
}

.achievement-box.secondary {
  background: url("img/achievement/banner/01.jpg") no-repeat center;
  background-size: cover;
}

.achievement-box.primary {
  background: url("img/achievement/banner/02.jpg") no-repeat center;
  background-size: cover;
}

.achievement-box .achievement-box-info-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.achievement-box .achievement-box-info-wrap .achievement-box-image {
  margin-right: 16px;
}

.achievement-box .achievement-box-info-wrap .achievement-box-title,
.achievement-box .achievement-box-info-wrap .achievement-box-text {
  color: #fff;
}

.achievement-box .achievement-box-info-wrap .achievement-box-title {
  font-size: 1.5rem;
  font-weight: 700;
}

.achievement-box .achievement-box-info-wrap .achievement-box-text {
  margin-top: 8px;
  font-size: 0.875rem;
  font-weight: 500;
}

.achievement-box .achievement-box-info-wrap .achievement-box-text .bold {
  margin-right: 4px;
  font-weight: 700;
}

.achievement-box .button {
  width: 140px;
}

/*---------------------------------
    109. LEVEL PROGRESS BOX
---------------------------------*/
.level-progress-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  min-height: 120px;
  padding: 0 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.level-progress-box .level-progress-badge {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: 28px;
}

.level-progress-box .progress-stat {
  width: 100%;
}

/*---------------------------------
    110. LEVEL PROGRESS BADGE
---------------------------------*/
.level-progress-badge {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  width: 88px;
  height: 86px;
  background: url("img/badge/level-badge.png") no-repeat center;
}

.level-progress-badge .level-progress-badge-title,
.level-progress-badge .level-progress-badge-text {
  color: #fff;
  text-align: center;
}

.level-progress-badge .level-progress-badge-title {
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
}

.level-progress-badge .level-progress-badge-text {
  margin-top: -3px;
  font-size: 1.75rem;
  font-weight: 700;
}

/*---------------------------------
    111. EXP LINE LIST
---------------------------------*/
.exp-line-list .exp-line {
  margin-bottom: 22px;
}

.exp-line-list .exp-line:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    112. EXP LINE
---------------------------------*/
.exp-line {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding-right: 100px;
  position: relative;
}

.exp-line .exp-line-icon {
  fill: var(--color-icon);
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: 18px;
}

.exp-line .text-sticker {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: 28px;
}

.exp-line .exp-line-text {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4285714286em;
}

.exp-line .exp-line-timestamp {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  position: absolute;
  top: 10px;
  right: 0;
}

/*---------------------------------
    113. ACCOUNT STAT BOX
---------------------------------*/
.account-stat-box {
  padding: 32px 28px 100px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.account-stat-box.account-stat-active-users {
  background: url("img/graph/stat/07.png") no-repeat center bottom var(--color-box-background);
  background-size: contain;
}

.account-stat-box.account-stat-active-users .account-stat-box-icon-wrap {
  background-color: #615dfa;
}

.account-stat-box.account-stat-visits {
  background: url("img/graph/stat/08.png") no-repeat center bottom var(--color-box-background);
  background-size: contain;
}

.account-stat-box.account-stat-visits .account-stat-box-icon-wrap {
  background-color: #4f8dff;
}

.account-stat-box.account-stat-session-duration {
  background: url("img/graph/stat/09.png") no-repeat center bottom var(--color-box-background);
  background-size: contain;
}

.account-stat-box.account-stat-session-duration .account-stat-box-icon-wrap {
  background-color: #3ad2fe;
}

.account-stat-box.account-stat-returning-visitors {
  background: url("img/graph/stat/10.png") no-repeat center bottom var(--color-box-background);
  background-size: contain;
}

.account-stat-box.account-stat-returning-visitors .account-stat-box-icon-wrap {
  background-color: #23d2e2;
}

.account-stat-box .percentage-diff {
  position: absolute;
  top: 24px;
  right: 28px;
}

.account-stat-box .account-stat-box-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  margin: 0 auto;
}

.account-stat-box .account-stat-box-icon-wrap .account-stat-box-icon {
  fill: #fff;
}

.account-stat-box .account-stat-box-title {
  margin-top: 24px;
  font-size: 3rem;
  font-weight: 700;
  text-align: center;
}

.account-stat-box .account-stat-box-subtitle {
  margin-top: 16px;
  font-size: 1.125rem;
  font-weight: 700;
  text-align: center;
}

.account-stat-box .account-stat-box-text {
  margin-top: 10px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

/*---------------------------------
    114. REFERENCE ITEM LIST
---------------------------------*/
.reference-item-list {
  display: -ms-flexbox;
  display: flex;
}

.reference-item-list .reference-item {
  margin-right: 32px;
}

.reference-item-list .reference-item:last-child {
  margin-right: 0;
}

.reference-item-list.centered {
  -ms-flex-pack: center;
  justify-content: center;
}

/*---------------------------------
    115. REFERENCE ITEM
---------------------------------*/
.reference-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.reference-item .reference-bullet {
  margin-right: 6px;
}

.reference-item .reference-item-text {
  font-size: 0.75rem;
  font-weight: 700;
}

/*---------------------------------
    116. REFERENCE BULLET
---------------------------------*/
.reference-bullet {
  width: 8px;
  height: 8px;
  border-radius: 2px;
}

.reference-bullet.secondary {
  background-color: var(--color-secondary);
}

.reference-bullet.blue {
  background-color: #4f8dff;
}

.reference-bullet.light-blue {
  background-color: #3ad2fe;
}

.reference-bullet.primary {
  background-color: var(--color-primary);
}

/*---------------------------------
    117. COUNTRY STAT LIST
---------------------------------*/
.country-stat-list .country-stat {
  margin-bottom: 26px;
}

.country-stat-list .country-stat:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    118. COUNTRY STAT
---------------------------------*/
.country-stat {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  padding-left: 30px;
  position: relative;
}

.country-stat.with-progress {
  padding-left: 50px;
}

.country-stat.with-progress .country-stat-image {
  width: 38px;
  height: 26px;
}

.country-stat .country-stat-image {
  width: 20px;
  height: 14px;
  position: absolute;
  top: -1px;
  left: 0;
}

.country-stat .country-stat-title,
.country-stat .country-stat-text {
  font-size: 0.875rem;
  font-weight: 700;
}

/*---------------------------------
    119. FULL WIDTH IMAGE
---------------------------------*/
.full-width-image {
  width: 100%;
  height: auto;
}

/*---------------------------------
    120. TOTALS LINE LIST
---------------------------------*/
.totals-line-list.separator-bottom {
  padding-bottom: 26px;
  border-bottom: 1px solid var(--color-divider);
}

.totals-line-list .totals-line {
  margin-bottom: 26px;
}

.totals-line-list .totals-line:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    121. TOTALS LINE
---------------------------------*/
.totals-line {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.totals-line .totals-line-title {
  font-size: 0.875rem;
  font-weight: 500;
}

.totals-line .totals-line-title .bold {
  color: var(--color-text);
  font-weight: 700;
}

.totals-line .totals-line-text {
  margin-top: 4px;
  font-size: 0.75rem;
  font-weight: 500;
}

.totals-line .price-title {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/*---------------------------------
    122. UPLOAD BOX
---------------------------------*/
.upload-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  min-height: 140px;
  padding: 32px 28px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  cursor: pointer;
  transition: box-shadow .25s ease-in-out, -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out, box-shadow .25s ease-in-out;
  transition: transform .2s ease-in-out, box-shadow .25s ease-in-out, -webkit-transform .2s ease-in-out;
}

.upload-box:hover {
  box-shadow: var(--color-overbox-dark-shadow);
  -webkit-transform: translate(0, -4px);
  transform: translate(0, -4px);
}

.upload-box:hover .upload-box-icon {
  fill: var(--color-primary);
}

.upload-box.upload-box-shadowed {
  box-shadow: var(--color-overbox-dark-shadow);
}

.upload-box.active {
  box-shadow: var(--color-overbox-dark-shadow);
}

.upload-box.active .upload-box-icon {
  fill: var(--color-primary);
}

.upload-box .upload-box-file-input {
  display: none;
}

.upload-box .upload-box-icon {
  fill: var(--color-icon);
  transition: fill .25s ease-in-out;
}

.upload-box .upload-box-title {
  margin-top: 26px;
  font-size: 0.875rem;
  font-weight: 700;
  max-width: 228px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.upload-box .upload-box-text {
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

/*---------------------------------
    123. DRAGGABLE ITEMS
---------------------------------*/
.draggable-items {
  display: grid;
  grid-template-columns: repeat(auto-fit, 60px);
  grid-gap: 24px;
  -ms-flex-pack: center;
  justify-content: center;
}

/*---------------------------------
    124. DRAGGABLE ITEM
---------------------------------*/
.draggable-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  background-color: var(--color-box-over-box-background);
  box-shadow: var(--color-overbox-shadow);
  cursor: pointer;
}

.draggable-item.empty {
  border: 2px dashed var(--color-divider);
  background-color: transparent;
  box-shadow: none;
  cursor: auto;
}

/*---------------------------------
    125. SWITCH OPTION LIST
---------------------------------*/
.switch-option-list .switch-option {
  margin-bottom: 26px;
}

.switch-option-list .switch-option:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    126. SWITCH OPTION
---------------------------------*/
.switch-option {
  position: relative;
}

.switch-option .switch-option-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.switch-option .switch-option-text {
  margin-top: 4px;
  color: #8f91ac;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.switch-option .form-switch {
  position: absolute;
  top: 0;
  right: 0;
}

.switch-option .button {
  width: 260px;
  margin-top: 32px;
}

.switch-option .switch-option-meta {
  color: #8f91ac;
  font-size: 0.875rem;
  font-weight: 500;
  position: absolute;
  bottom: 12px;
  right: 0;
}

.switch-option .switch-option-meta .bold {
  color: #3e3f5e;
  font-weight: 700;
}

/*---------------------------------
    127. NOTIFICATION BOX LIST
---------------------------------*/
.notification-box-list .notification-box {
  margin-bottom: 12px;
}

.notification-box-list .notification-box:last-child {
  margin-bottom: 0;
}

/*---------------------------------
    128. NOTIFICATION BOX
---------------------------------*/
.notification-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  min-height: 88px;
  padding: 22px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.notification-box.unread {
  background-color: var(--color-box-background-alt);
}

.notification-box.unread .user-status .user-status-icon {
  fill: var(--color-icon);
  opacity: 1;
}

.notification-box:hover .notification-box-close-button {
  display: -ms-flexbox;
  display: flex;
}

.notification-box:hover .mark-unread-button,
.notification-box:hover .mark-read-button {
  display: block;
}

.notification-box .user-status {
  width: 100%;
}

.notification-box .notification-box-close-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 6px;
  right: 6px;
  cursor: pointer;
}

.notification-box .notification-box-close-button .notification-box-close-button-icon {
  fill: var(--color-icon-highlighted);
  width: 8px;
  height: 8px;
}

.notification-box .notification-box-close-button,
.notification-box .mark-unread-button,
.notification-box .mark-read-button {
  display: none;
}

.notification-box .mark-unread-button,
.notification-box .mark-read-button {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  position: absolute;
  top: 12px;
  right: 30px;
  cursor: pointer;
}

.notification-box .mark-unread-button {
  border: 2px solid var(--color-primary);
}

.notification-box .mark-read-button {
  background-color: var(--color-primary);
}

/*---------------------------------
    129. CREATE ENTITY BOX
---------------------------------*/
.create-entity-box {
  height: 284px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.create-entity-box.v2 {
  height: 360px;
}

.create-entity-box.v2 .create-entity-box-cover {
  height: 180px;
}

.create-entity-box.v2 .create-entity-box-avatar {
  top: 36px;
}

.create-entity-box.v2 .create-entity-box-info {
  padding-top: 28px;
}

.create-entity-box.v2 .create-entity-box-title {
  font-size: 1rem;
  text-align: left;
}

.create-entity-box.v2 .create-entity-box-category {
  margin-top: 8px;
}

.create-entity-box .create-entity-box-cover {
  height: 70px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  border-bottom: 1px dashed var(--color-divider);
  background-color: var(--color-box-background-alt);
}

.create-entity-box .create-entity-box-avatar {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100px;
  height: 110px;
  position: absolute;
  top: 16px;
  left: 50%;
  margin-left: -50px;
}

.create-entity-box .create-entity-box-avatar .user-avatar-border {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.create-entity-box .create-entity-box-avatar.primary .create-entity-box-avatar-icon {
  fill: var(--color-primary);
}

.create-entity-box .create-entity-box-avatar .create-entity-box-avatar-icon {
  fill: var(--color-secondary);
  position: relative;
  z-index: 2;
}

.create-entity-box .create-entity-box-info {
  padding: 60px 28px 0;
}

.create-entity-box .create-entity-box-title {
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
}

.create-entity-box .create-entity-box-category {
  padding-left: 16px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  position: relative;
}

.create-entity-box .create-entity-box-category::before {
  content: '';
  width: 8px;
  height: 8px;
  border: 2px solid var(--color-icon);
  border-radius: 50%;
  position: absolute;
  top: 1px;
  left: 0;
}

.create-entity-box .create-entity-box-text {
  margin-top: 6px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
  text-align: center;
}

.create-entity-box .button {
  margin-top: 36px;
}

/*---------------------------------
    130. EARNING STAT BOX
---------------------------------*/
.earning-stat-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  min-height: 100px;
  padding: 0 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.earning-stat-box .earning-stat-box-info {
  padding-left: 66px;
  position: relative;
}

.earning-stat-box .earning-stat-box-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  position: absolute;
  top: 0;
  left: 0;
}

.earning-stat-box .earning-stat-box-icon-wrap .earning-stat-box-icon {
  fill: #fff;
}

.earning-stat-box .earning-stat-box-icon-wrap.stat-item {
  background-color: #615dfa;
}

.earning-stat-box .earning-stat-box-icon-wrap.stat-earning {
  background-color: #4f8dff;
}

.earning-stat-box .earning-stat-box-icon-wrap.stat-revenue {
  background-color: #3ad2fe;
}

.earning-stat-box .earning-stat-box-icon-wrap.stat-balance {
  background-color: #23d2e2;
}

.earning-stat-box .earning-stat-box-title {
  font-size: 1.75rem;
  font-weight: 700;
}

.earning-stat-box .earning-stat-box-title .currency {
  font-size: 1.125rem;
}

.earning-stat-box .earning-stat-box-text {
  margin-top: 2px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*---------------------------------
    131. STATUS INFO
---------------------------------*/
.status-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.status-info.success .status-icon-wrap {
  background-color: var(--color-primary);
}

.status-info .status-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
}

.status-info .status-icon-wrap .status-icon {
  fill: #fff;
  width: 20px;
  height: 16px;
}

.status-info .status-title {
  margin-top: 22px;
  font-size: 0.875rem;
  font-weight: 700;
}

.status-info .status-text {
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

.status-info .status-description {
  margin-top: 28px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

/*----------------------------
    NOTIFICATION SECTION
----------------------------*/
.notification-section {
  margin-top: 100px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.notification-section .notification-section-icon {
  opacity: .4;
  margin-left: 26px;
}

.notification-section .notification-section-title {
  margin-top: 54px;
  color: var(--color-text);
  font-size: 1.25rem;
  font-weight: 700;
  text-align: center;
}

.notification-section .notification-section-text {
  margin-top: 12px;
  font-size: 1rem;
  font-weight: 500;
  text-align: center;
}

/*----------------------------
    QUICK FILTERS
----------------------------*/
.quick-filters {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  height: 80px;
  padding: 0 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.quick-filters .quick-filters-tabs {
  display: -ms-flexbox;
  display: flex;
  margin-right: 26px;
}

.quick-filters .quick-filters-tabs .quick-filters-tab {
  height: 80px;
  margin-right: 12px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  border-bottom: 4px solid transparent;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 80px;
  cursor: pointer;
  transition: border-bottom-color .2s ease-in-out, color .2s ease-in-out;
}

.quick-filters .quick-filters-tabs .quick-filters-tab:last-child {
  margin-right: 0;
}

.quick-filters .quick-filters-tabs .quick-filters-tab.active {
  border-bottom-color: var(--color-primary);
  color: var(--color-text);
}

.quick-filters .quick-filters-form-mobile {
  display: none;
}

.quick-filters .quick-filters-form {
  width: 160px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

/*----------------------------
    REACTION BOX
----------------------------*/
.reaction-box {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.reaction-box .reaction-box-options {
  display: -ms-flexbox;
  display: flex;
  height: 52px;
  padding: 0 28px;
  border-bottom: 1px solid var(--color-divider);
}

.reaction-box .reaction-box-options .reaction-box-option {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin-right: 12px;
  border-bottom: 4px solid transparent;
  cursor: pointer;
}

.reaction-box .reaction-box-options .reaction-box-option:last-child {
  margin-right: 0;
}

.reaction-box .reaction-box-options .reaction-box-option.active {
  border-bottom-color: var(--color-primary);
}

.reaction-box .reaction-box-options .reaction-box-option .reaction-box-option-image {
  width: 20px;
  height: 20px;
  margin-right: 6px;
  position: relative;
  top: -1px;
}

.reaction-box .reaction-box-options .reaction-box-option .reaction-box-option-text {
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
}

.reaction-box .reaction-box-content .reaction-box-item {
  height: 406px;
  padding: 32px 28px;
  overflow-y: auto;
}

/*-------------------------
    UPLOADABLE ITEM LIST
-------------------------*/
.uploadable-item-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, 96px);
  grid-gap: 12px;
}

.uploadable-item-list.disabled {
  opacity: .5;
}

.uploadable-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 96px;
  border-radius: 12px;
  position: relative;
}

.uploadable-item .uploadable-item-remove-button {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
}

.uploadable-item-remove-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 18px;
  height: 18px;
  border-radius: 6px;
  background-color: var(--color-tertiary);
  cursor: pointer;
}

.uploadable-item-remove-button .uploadable-item-remove-button-icon {
  width: 8px;
  height: 8px;
  pointer-events: none;
}

.uploadable-item-selector {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 96px;
  border-radius: 12px;
  border: 2px dashed var(--color-border);
}

.uploadable-item-selector .uploadable-item-selector-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 12px;
  background-color: var(--color-primary);
  cursor: pointer;
}

.uploadable-item-selector .uploadable-item-selector-button .uploadable-item-selector-button-icon {
  fill: #fff;
  width: 12px;
  height: 12px;
  pointer-events: none;
}

.uploadable-item-selector-input {
  display: none;
}

/*---------------------------------
    52. MESSAGE BOX
---------------------------------*/
.message-box {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  padding: 80px 0 50px;
  position: relative;
}

.message-box.no-padding-bottom {
  padding-bottom: 0;
}

.message-box .message-box-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  position: absolute;
  top: -16px;
  left: 50%;
  margin-left: -30px;
}

.message-box .message-box-icon-wrap.primary {
  background-color: var(--color-primary);
}

.message-box .message-box-icon-wrap.secondary {
  background-color: var(--color-secondary);
}

.message-box .message-box-icon-wrap.tertiary {
  background-color: var(--color-tertiary);
}

.message-box .message-box-icon-wrap .message-box-icon {
  fill: #fff;
}

.message-box .message-box-title {
  font-size: 1.125rem;
  font-weight: 700;
  text-align: center;
}

.message-box .message-box-text {
  width: 70%;
  margin: 20px auto 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

.message-box .message-box-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 50px;
  padding-bottom: 32px;
}

.message-box .message-box-actions .message-box-action {
  width: 140px;
  margin-right: 16px;
  cursor: pointer;
}

.message-box .message-box-actions .message-box-action:last-child {
  margin-right: 0;
}

/*---------------------------------
    52.1 ALERT BOX
---------------------------------*/
.alert-box {
  min-height: 100px;
  border-radius: 12px;
  padding: 32px 32px 26px 108px;
  background-color: #4f8dff;
  position: relative;
}

.alert-box.alert-box-success {
  background-color: #00c7d9;
}

.alert-box.alert-box-info {
  background-color: #615dfa;
}

.alert-box.alert-box-error {
  background-color: #fd4350;
}

.alert-box .alert-box-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 60px;
  height: 60px;
  border-radius: 12px;
  position: absolute;
  top: 20px;
  left: 20px;
  box-shadow: 3px 5px 20px 0 rgba(0, 0, 0, 0.16);
}

.alert-box .alert-box-icon-wrap .alert-box-icon {
  fill: #fff;
}

.alert-box .alert-box-title,
.alert-box .alert-box-text {
  color: #fff;
}

.alert-box .alert-box-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.alert-box .alert-box-text {
  margin-top: 6px;
  font-size: 1rem;
  line-height: 1.5em;
}

.alert-line {
  min-height: 60px;
  border-radius: 12px;
  padding: 20px 28px 20px 64px;
  background-color: #4f8dff;
  position: relative;
}

.alert-line.alert-line-success {
  background-color: #00c7d9;
}

.alert-line.alert-line-info {
  background-color: #615dfa;
}

.alert-line.alert-line-error {
  background-color: #fd4350;
}

.alert-line .alert-line-icon {
  fill: #fff;
  position: absolute;
  top: 20px;
  left: 20px;
}

.alert-line .alert-line-text {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.5em;
}

.alert-line .alert-line-text .bold {
  font-weight: 700;
}

/*---------------------------------
    125. ITEM LIST OPTIONS
---------------------------------*/
.item-list-options {
  display: -ms-flexbox;
  display: flex;
}

.item-list-options>* {
  margin-right: 32px;
}

.item-list-options>*:last-child {
  margin-right: 0;
}

.item-list-options .item-list-option-wrap {
  display: -ms-flexbox;
  display: flex;
}

.item-list-options .item-list-option-wrap .loader-spinner-wrap {
  margin-left: 12px;
}

.item-list-options .item-list-option-wrap .loader-spinner-wrap .loader-spinner::after {
  background-color: var(--color-body);
}

.item-list-options .item-list-option {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  transition: color .2s ease-in-out;
}

.item-list-options .item-list-option:hover {
  color: var(--color-text);
}

/*---------------------------------
    126. POINT ITEM
---------------------------------*/
.point-item-list {
  display: -ms-flexbox;
  display: flex;
}

.point-item-list .point-item {
  margin-right: 14px;
}

.point-item-list .point-item:last-child {
  margin-right: 0;
}

.point-item-list.negative .point-item .point-item-text {
  color: var(--color-text);
}

.point-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.point-item .point-item-image {
  margin-right: 12px;
  width: 14px;
  height: auto;
}

.point-item .point-item-text {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
}

/*---------------------------------
    127. POINT REWARD BOX
---------------------------------*/
.point-reward-box {
  display: -ms-flexbox;
  display: flex;
  padding: 32px 0 32px 90px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.point-reward-box .point-reward-box-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  position: absolute;
  top: 22px;
  left: 28px;
}

.point-reward-box .point-reward-box-icon-wrap .point-reward-box-icon {
  fill: var(--color-icon-highlighted);
}

.point-reward-box .text-sticker {
  position: absolute;
  top: 10px;
  right: -6px;
}

.point-reward-box .point-reward-box-info.point-reward-box-info-description {
  width: 320px;
  padding-right: 32px;
}

.point-reward-box .point-reward-box-info .point-reward-box-title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.2857142857em;
}

.point-reward-box .point-reward-box-info .point-reward-box-text {
  margin-top: 6px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

/*---------------------------------
    127. POINT ITEM BOX
---------------------------------*/
.point-item-box {
  padding: 32px 26px 50px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.point-item-box .point-item-box-image-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 86px;
  height: 86px;
  margin: 0 auto;
  border-radius: 50%;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
}

.point-item-box .point-item-box-image {
  width: 40px;
  height: auto;
}

.point-item-box .point-item-box-title,
.point-item-box .point-item-box-subtitle {
  font-weight: 700;
  text-align: center;
}

.point-item-box .point-item-box-title {
  margin-top: 40px;
  font-size: 2.25rem;
}

.point-item-box .point-item-box-subtitle {
  margin-top: 8px;
  font-size: 1.125rem;
}

.point-item-box .point-item-box-text {
  width: 170px;
  margin: 20px auto 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

/*---------------------------------
    128. POINT ITEM LINE
---------------------------------*/
.point-item-line-list .point-item-line {
  margin-bottom: 26px;
}

.point-item-line-list .point-item-line:last-child {
  margin-bottom: 0;
}

.point-item-line {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.point-item-line .point-item-line-image {
  width: 28px;
  height: auto;
  margin-right: 12px;
}

.point-item-line .point-item-line-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.point-item-line .point-item-line-text {
  margin-top: 4px;
  font-size: 0.75rem;
  font-weight: 500;
}

/*---------------------------------
    129. ACHIEVEMENT ITEM BOX
---------------------------------*/
.achievement-item-box {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.achievement-item-box .text-sticker {
  position: absolute;
  top: 10px;
  right: -6px;
}

.achievement-item-box .achievement-item-box-info {
  padding-top: 32px;
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.achievement-item-box .achievement-item-box-info .achievement-item-box-info-top {
  padding: 0 40px;
}

.achievement-item-box .achievement-item-box-info .achievement-item-box-info-top.big-padding-bottom {
  padding-bottom: 48px;
}

.achievement-item-box .achievement-item-box-image-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 86px;
  height: 86px;
  margin: 0 auto;
  border-radius: 50%;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
}

.achievement-item-box .achievement-item-box-image-wrap .achievement-item-box-image {
  width: 46px;
  height: auto;
}

.achievement-item-box .achievement-item-box-image-wrap+.achievement-item-box-title {
  margin-top: 40px;
}

.achievement-item-box .achievement-item-box-image {
  display: block;
  width: 82px;
  height: auto;
  margin: 0 auto;
}

.achievement-item-box .achievement-item-box-title {
  margin-top: 36px;
  font-size: 1.125rem;
  font-weight: 700;
  text-align: center;
}

.achievement-item-box .achievement-item-box-text {
  width: 180px;
  margin: 16px auto 0;
}

.achievement-item-box .achievement-item-box-text p {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

.achievement-item-box .achievement-item-box-subtitle {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.achievement-item-box .achievement-item-box-requirements {
  margin-top: 32px;
}

.achievement-item-box .achievement-item-box-requirements .checklist-items {
  margin-top: 12px;
}

.achievement-item-box .achievement-item-box-unlock-form {
  margin: 36px 40px 0;
}

.achievement-item-box .achievement-item-box-unlock-form .button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
}

.achievement-item-box .achievement-item-box-unlock-form .button .achievement-item-box-unlocked-button-image {
  width: 14px;
  height: auto;
  margin-left: 6px;
}

.achievement-item-box .achievement-item-box-unlocked-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 36px 40px 0;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  border-radius: 200px;
  color: var(--color-text);
  cursor: auto;
}

.achievement-item-box .achievement-item-box-unlocked-button .achievement-item-box-unlocked-button-user {
  margin-left: 4px;
}

.achievement-item-box .achievement-item-box-unlocked-button .achievement-item-box-unlocked-button-image {
  width: 14px;
  height: auto;
  margin-left: 6px;
}

.achievement-item-box .progress-stat {
  max-width: 204px;
  margin: 54px auto 28px;
}

.achievement-item-box .achievement-item-box-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  padding: 22px 0;
  min-height: 90px;
  border-top: 1px solid var(--color-divider);
  background-color: var(--color-box-background-alt);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.achievement-item-box .achievement-item-box-footer .achievement-item-box-footer-title {
  font-size: 0.75rem;
  font-weight: 700;
}

.achievement-item-box .achievement-item-box-footer .achievement-item-box-footer-title+.achievement-item-box-footer-title {
  margin-top: 18px;
}

.achievement-item-box .achievement-item-box-footer .user-avatar-list {
  margin-top: 10px;
  padding: 0 28px;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-pack: center;
  justify-content: center;
}

/*---------------------------------
    130. CHECKLIST ITEM
---------------------------------*/
.checklist-items {
  max-height: 80px;
  padding-right: 12px;
  overflow: hidden auto;
}

.checklist-items .checklist-item:last-child {
  margin-bottom: 0;
}

.checklist-item {
  display: -ms-flexbox;
  display: flex;
}

.checklist-item .checklist-item-box {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  margin: 3px 8px 0 0;
  border-radius: 4px;
  background-color: var(--color-divider);
}

.checklist-item .checklist-item-box .checklist-item-box-icon {
  fill: #fff;
  display: none;
}

.checklist-item .checklist-item-box.active {
  background: linear-gradient(45deg, #615dfa, #23d2e2);
}

.checklist-item .checklist-item-box.active .checklist-item-box-icon {
  display: block;
}

.checklist-item .checklist-item-text {
  font-size: 0.875rem;
  line-height: 1.4285714286em;
  font-weight: 500;
}

/*---------------------------------
    131. NO RESULTS TEXT
---------------------------------*/
.no-results-text {
  color: var(--color-text-alt-2);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

/*---------------------------------
    132. LOGO
---------------------------------*/
.logo .logo-image {
  display: block;
}

/*---------------------------------
    133. SOCIAL ITEM
---------------------------------*/
.social-items {
  display: -ms-flexbox;
  display: flex;
}

.social-items .social-item {
  margin-right: 24px;
}

.social-items .social-item:last-child {
  margin-right: 0;
}

.social-item {
  transition: -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out;
  transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.social-item:hover {
  -webkit-transform: translate(0, -2px);
  transform: translate(0, -2px);
}

.social-item.facebook:hover .social-item-icon {
  fill: #3763d2;
}

.social-item.twitter:hover .social-item-icon {
  fill: #1abcff;
}

.social-item.instagram:hover .social-item-icon {
  fill: #f8468d;
}

.social-item.youtube:hover .social-item-icon {
  fill: #fd434f;
}

.social-item.twitch:hover .social-item-icon {
  fill: #7b5dfa;
}

.social-item.linkedin:hover .social-item-icon {
  fill: #0077b5;
}

.social-item.pinterest:hover .social-item-icon {
  fill: #cd2e3f;
}

.social-item.tiktok:hover .social-item-icon {
  fill: #000000;
}

.social-item.github:hover .social-item-icon {
  fill: #303742;
}

.social-item.messenger:hover .social-item-icon {
  fill: #0084ff;
}

.social-item.reddit:hover .social-item-icon {
  fill: #f74300;
}

.social-item.whatsapp:hover .social-item-icon {
  fill: #2fbe38;
}

.social-item.dribbble:hover .social-item-icon {
  fill: #f761ab;
}

.social-item.discord:hover .social-item-icon {
  fill: #7289da;
}

.social-item.spotify:hover .social-item-icon {
  fill: #1dd05d;
}

.social-item .social-item-icon {
  fill: var(--color-icon-highlighted);
  width: 12px;
  height: 12px;
  transition: fill .2s ease-in-out;
}

/*---------------------------------
    134. ACCOUNT HUB CONTENT
---------------------------------*/
.account-hub-content .account-hub-content-options {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-top: 48px;
}

.account-hub-content .account-hub-content-options .button {
  padding: 0 32px;
}

/*---------------------------------
    134. LOAD MORE TEXT
---------------------------------*/
.load-more-text {
  border-top: 1px solid var(--color-divider);
  height: 53px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 53px;
  text-align: center;
  cursor: pointer;
}

.load-more-text .loader-spinner-wrap {
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
}

/*---------------------------------
    134. MENTION BLOCK
---------------------------------*/
.mention-block {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.mention-block .mention-block-avatar {
  margin-right: 8px;
}

.mention-block .mention-block-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.mention-block .mention-block-action {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 18px;
  height: 18px;
  margin-left: 8px;
  background-color: #3e3f5e;
  border-radius: 6px;
  cursor: pointer;
  transition: background-color .2s ease-in-out;
}

.mention-block .mention-block-action .mention-block-action-icon {
  width: 8px;
  height: 8px;
  pointer-events: none;
}

.mention-block .mention-block-action:hover {
  background-color: #fd4350;
}

.author-preview {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
}

.author-preview.author-preview-landscape {
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: center;
  align-items: center;
}

.author-preview.author-preview-landscape .author-preview-info {
  margin: 0 0 0 8px;
}

.author-preview .author-preview-avatar {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.author-preview .author-preview-info {
  margin-top: 8px;
}

.author-preview .author-preview-title {
  font-size: 0.875rem;
  font-weight: 700;
  word-break: break-word;
}

.author-preview .author-preview-text {
  margin-top: 4px;
  font-size: 0.75rem;
  font-weight: 500;
  word-break: break-word;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .popup-picture {
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .popup-picture .widget-box {
    display: block;
    width: 100%;
    border-top-left-radius: 0;
    border-bottom-right-radius: 12px;
  }

  .popup-picture .popup-picture-image-wrap {
    -ms-flex-order: -1;
    order: -1;
  }

  .notification-box .notification-box-close-button {
    display: -ms-flexbox;
    display: flex;
  }

  .notification-box .mark-unread-button,
  .notification-box .mark-read-button {
    display: block;
  }

  .point-reward-box {
    margin-top: 25px;
    padding: 54px 32px 32px;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .point-reward-box .point-reward-box-icon-wrap {
    top: -14px;
    left: 50%;
    margin-left: -23px;
  }

  .point-reward-box .point-reward-box-info.point-reward-box-info-description {
    width: auto;
    padding-right: 0;
    margin-bottom: 18px;
  }
}

@media screen and (max-width: 1070px) {
  .week-box {
    display: none;
  }

  .promo-line {
    display: block;
    padding: 32px 28px;
  }

  .promo-line .promo-line-text {
    width: auto;
  }

  .promo-line .promo-line-actions {
    margin-top: 24px;
  }
}

@media screen and (max-width: 960px) {
  .switch-option .form-switch {
    margin-top: 12px;
    position: relative;
    top: auto;
    right: auto;
  }

  .switch-option .button {
    margin-top: 22px;
  }

  .switch-option .switch-option-meta {
    margin-top: 16px;
    position: static;
  }

  .earning-stat-box.full {
    width: 100%;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .earning-stat-box .user-stats {
    display: none;
  }

  .popup-close-button {
    right: 0;
  }

  .quick-post .quick-post-header .quick-post-header-filters-wrap .form-row.split {
    display: -ms-flexbox;
    display: flex;
  }

  .quick-post .quick-post-header .quick-post-header-filters-wrap .form-row.split .form-item {
    margin-bottom: 0;
  }
}

@media screen and (max-width: 680px) {
  .achievement-box {
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 28px 18px;
  }

  .achievement-box .button {
    margin-top: 16px;
  }

  .level-progress-box {
    display: block;
    height: auto;
    padding: 32px 28px;
  }

  .level-progress-box .level-progress-badge {
    margin: 0 auto;
  }

  .level-progress-box .progress-stat {
    margin-top: 28px;
  }

  .exp-line {
    display: block;
    padding: 32px 0 0;
  }

  .exp-line .exp-line-icon {
    position: absolute;
    top: 0;
    left: 0;
  }

  .exp-line .text-sticker {
    height: 24px;
    padding: 0 12px;
    line-height: 24px;
    position: absolute;
    top: 0;
    right: 0;
  }

  .exp-line .exp-line-timestamp {
    margin-top: 8px;
    position: static;
  }

  .quick-filters {
    padding: 0 16px;
  }

  .quick-filters .quick-filters-tabs {
    display: none;
  }

  .quick-filters .quick-filters-form {
    width: 100%;
    -ms-flex-negative: 1;
    flex-shrink: 1;
    margin-right: 12px;
  }

  .quick-filters .quick-filters-form:last-child {
    margin-right: 0;
  }

  .quick-filters .quick-filters-form-mobile {
    display: block;
  }

  .quick-post .quick-post-header .quick-post-header-filters-wrap {
    -ms-flex-direction: column;
    flex-direction: column;
    padding: 28px;
  }

  .quick-post .quick-post-header .quick-post-header-filters-wrap .quick-post-header-filters {
    margin-top: 28px;
  }
}

@media screen and (max-width: 479px) {
  .post-option {
    width: 80px;
  }

  .post-option .post-option-image {
    margin-right: 0;
  }

  .post-option .post-option-text {
    display: none;
  }

  .post-option .post-option-icon {
    margin-right: 0;
  }

  .reaction-options {
    height: 40px;
  }

  .reaction-options .reaction-option {
    width: 20px;
    height: 20px;
  }

  .simple-tab-items {
    border-bottom: none;
  }

  .simple-tab-items .simple-tab-item {
    display: none;
  }

  .simple-tab-items .form {
    display: block;
  }

  .quick-post.medium .quick-post-footer .quick-post-footer-actions .button {
    width: 80px;
  }

  .quick-post.medium .quick-post-footer .quick-post-footer-actions .button:last-child {
    width: 80px;
  }

  .promo-line .promo-line-actions {
    display: block;
  }

  .promo-line .promo-line-actions .form-input,
  .promo-line .promo-line-actions .button {
    width: 100%;
  }

  .promo-line .promo-line-actions .form-input {
    margin-right: 0;
  }

  .promo-line .promo-line-actions .button {
    margin-top: 16px;
  }

  .switch-option .button {
    width: 100%;
  }

  .action-request.with-text {
    width: 40px;
    padding: 0;
  }

  .action-request.with-text .action-request-icon {
    margin-right: 0;
  }

  .action-request.with-text .action-request-text {
    display: none;
  }

  .alert-box {
    padding: 16px 28px 26px 28px;
  }

  .alert-box .alert-box-icon-wrap {
    margin: 0 auto 32px;
    position: static;
  }

  .alert-box .alert-box-title,
  .alert-box .alert-box-text {
    text-align: center;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .table-wrap
2. .table
-------------------------------------------------------------------*/
/*--------------------
    1. TABLE WRAP
--------------------*/
.table-wrap {
  overflow-x: auto;
}

/*----------------
    2. TABLE
----------------*/
.table {
  width: 100%;
  display: table;
}

.table.table-forum-category .forum-category {
  width: 384px;
}

.table.table-quests .table-body .table-column:first-child {
  width: 240px;
}

.table.table-quests .table-body .table-column:last-child {
  width: 284px;
}

.table.table-quests .progress-stat-wrap {
  width: 256px;
}

.table.table-top-friends .progress-stat-wrap {
  width: 228px;
}

.table.table-top-friends .table-row .table-column:first-child {
  width: 172px;
}

.table.table-cart .table-header-column:last-child,
.table.table-cart .table-column:last-child {
  width: 20px;
}

.table.table-cart .product-preview {
  width: 330px;
}

.table.table-cart .form-select {
  width: 156px;
}

.table.table-cart .price-title {
  width: 76px;
  margin: 0 auto;
}

.table.table-payments .table-header-column:first-child .table-text,
.table.table-payments .table-column:first-child .table-text {
  width: 100px;
}

.table.table-sales .table-header-column:first-child .table-text,
.table.table-sales .table-column:first-child .table-text {
  width: 100px;
}

.table.table-sales .table-header-column:nth-child(2) .table-link,
.table.table-sales .table-column:nth-child(2) .table-link {
  width: 210px;
}

.table.table-sales .table-column:last-child {
  width: 16px;
}

.table.table-sales .table-row:first-child {
  height: 55px;
}

.table.table-sales .table-row:first-child .table-column {
  padding-top: 15px;
}

.table.table-sales .table-row:last-child {
  height: 55px;
}

.table.table-sales .table-row:last-child .table-column {
  padding-bottom: 15px;
}

.table.table-downloads .table-header-column:last-child,
.table.table-downloads .table-column:last-child {
  width: 216px;
}

.table.table-downloads .product-preview {
  min-width: 220px;
}

.table.table-downloads .price-title {
  width: 76px;
}

.table.join-rows .table-header-column {
  border-bottom: 1px solid var(--color-divider);
}

.table.join-rows .table-header-column:first-child {
  padding-left: 0;
}

.table.join-rows .table-header-column:last-child {
  padding-right: 0;
}

.table.join-rows .table-body {
  border-radius: 0;
  box-shadow: none;
}

.table.join-rows .table-body .table-row {
  background-color: transparent;
}

.table.join-rows .table-body .table-row.micro:first-child {
  height: 55px;
}

.table.join-rows .table-body .table-row.micro:first-child .table-column {
  padding-top: 15px;
}

.table.join-rows .table-body .table-row.tiny:first-child {
  height: 77px;
}

.table.join-rows .table-body .table-row.tiny:first-child .table-column {
  padding-top: 11px;
}

.table.join-rows .table-body .table-row:first-child .table-column:first-child {
  border-top-left-radius: 0;
}

.table.join-rows .table-body .table-row:first-child .table-column:last-child {
  border-top-right-radius: 0;
}

.table.join-rows .table-body .table-row:last-child .table-column:first-child {
  border-bottom-left-radius: 0;
}

.table.join-rows .table-body .table-row:last-child .table-column:last-child {
  border-bottom-right-radius: 0;
}

.table.join-rows .table-body .table-row:nth-child(2n+2) {
  background-color: transparent;
}

.table.join-rows .table-body .table-row .table-column:first-child {
  padding-left: 0;
}

.table.join-rows .table-body .table-row .table-column:last-child {
  padding-right: 0;
}

.table.split-rows {
  border-collapse: separate;
  border-spacing: 0 12px;
}

.table.split-rows .table-header-column {
  height: 16px;
}

.table.split-rows .table-body {
  box-shadow: none;
}

.table.split-rows .table-row {
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
}

.table.split-rows .table-row .table-column:first-child {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.table.split-rows .table-row .table-column:last-child {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

.table.split-rows .table-row:first-child .table-column:first-child {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.table.split-rows .table-row:first-child .table-column:last-child {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

.table.split-rows .table-row:last-child .table-column:first-child {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.table.split-rows .table-row:last-child .table-column:last-child {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

.table .table-header {
  display: table-header-group;
}

.table .table-header-column {
  display: table-cell;
  vertical-align: middle;
  height: 40px;
}

.table .table-header-column.centered {
  text-align: center;
}

.table .table-header-column.align-right {
  text-align: right;
}

.table .table-header-column.padded {
  padding: 0 24px;
}

.table .table-header-column.padded-medium {
  padding: 0 46px;
}

.table .table-header-column.padded-left {
  padding-left: 24px;
}

.table .table-header-column.padded-big-left {
  padding-left: 60px;
}

.table .table-header-column:first-child {
  padding-left: 28px;
}

.table .table-header-column:last-child {
  padding-right: 28px;
}

.table .table-header-column .table-header-title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.table .table-body {
  display: table-row-group;
  box-shadow: var(--color-box-shadow);
  border-radius: 12px;
}

.table .table-body.same-color-rows .table-row:nth-child(2n+2) {
  background-color: var(--color-box-background);
}

.table .table-body .table-row:first-child .table-column:first-child {
  border-top-left-radius: 12px;
}

.table .table-body .table-row:first-child .table-column:last-child {
  border-top-right-radius: 12px;
}

.table .table-body .table-row:last-child .table-column:first-child {
  border-bottom-left-radius: 12px;
}

.table .table-body .table-row:last-child .table-column:last-child {
  border-bottom-right-radius: 12px;
}

.table .table-body .table-row:nth-child(2n+2) {
  background-color: var(--color-box-background-alt);
}

.table .table-row {
  display: table-row;
  background-color: var(--color-box-background);
  height: 100px;
}

.table .table-row.micro {
  height: 40px;
}

.table .table-row.tiny {
  height: 66px;
}

.table .table-row.small {
  height: 86px;
}

.table .table-row.medium {
  height: 108px;
}

.table .table-row.mid {
  height: 148px;
}

.table .table-row.big {
  height: 160px;
}

.table .table-row.big.auto {
  height: auto;
}

.table .table-row.big.auto .table-column {
  padding-top: 44px;
  padding-bottom: 44px;
}

.table .table-column {
  display: table-cell;
  vertical-align: middle;
}

.table .table-column.centered {
  text-align: center;
}

.table .table-column.align-right {
  text-align: right;
}

.table .table-column.padded {
  padding: 0 24px;
}

.table .table-column.padded-medium {
  padding: 0 46px;
}

.table .table-column.padded-left {
  padding-left: 24px;
}

.table .table-column.padded-big-left {
  padding-left: 60px;
}

.table .table-column:first-child {
  padding-left: 28px;
}

.table .table-column:last-child {
  padding-right: 28px;
}

.table .table-column .table-information {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.table .table-column .table-information .table-image {
  margin-right: 16px;
}

.table .table-column .table-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.table .table-column .table-title .highlighted {
  color: var(--color-primary-dark);
}

.table .table-column .table-text {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.1428571429em;
}

.table .table-column .table-text .light {
  color: var(--color-text-alt);
}

.table .table-column .table-link {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
}

.table .table-column .table-link .highlighted {
  color: var(--color-primary-dark);
}

.table .table-column .table-link+.table-link {
  margin-top: 12px;
}

.table .table-column .table-actions {
  display: -ms-flexbox;
  display: flex;
}

.table .table-column .table-actions .button {
  width: 100px;
  margin-right: 16px;
}

.table .table-column .table-actions .button:last-child {
  margin-right: 0;
}

.table .table-column .table-action {
  cursor: pointer;
}

.table .table-column .table-action .icon-delete {
  opacity: .4;
  transition: opacity .2s ease-in-out, fill .2s ease-in-out;
}

.table .table-column .table-action .icon-delete:hover {
  fill: var(--color-icon-highlighted);
  opacity: 1;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1260px) {

  .table.table-forum-category .table-header-column:last-child,
  .table.table-forum-category .table-column:last-child,
  .table.table-forum-discussion .table-header-column:last-child,
  .table.table-forum-discussion .table-column:last-child {
    display: none;
  }

  .table.table-forum-category .table-row:first-child .table-column:nth-last-child(2),
  .table.table-forum-discussion .table-row:first-child .table-column:nth-last-child(2) {
    border-top-right-radius: 12px;
  }

  .table.table-forum-category .table-row:last-child .table-column:nth-last-child(2),
  .table.table-forum-discussion .table-row:last-child .table-column:nth-last-child(2) {
    border-bottom-right-radius: 12px;
  }

  .table.table-forum-category .forum-category {
    width: auto;
  }

  .table.table-quests .table-header-column:nth-child(3),
  .table.table-quests .table-column:nth-child(3) {
    display: none;
  }

  .table.table-top-friends .table-header-column:nth-child(4),
  .table.table-top-friends .table-header-column:nth-child(5),
  .table.table-top-friends .table-column:nth-child(4),
  .table.table-top-friends .table-column:nth-child(5) {
    display: none;
  }
}

@media screen and (max-width: 960px) {

  .table.table-forum-category .table-header-column.padded-medium,
  .table.table-forum-category .table-column.padded-medium,
  .table.table-forum-discussion .table-header-column.padded-medium,
  .table.table-forum-discussion .table-column.padded-medium {
    padding: 0 28px;
  }

  .table.table-forum-category .table-header-column:nth-last-child(3),
  .table.table-forum-category .table-column:nth-last-child(3),
  .table.table-forum-discussion .table-header-column:nth-last-child(3),
  .table.table-forum-discussion .table-column:nth-last-child(3) {
    display: none;
  }

  .table.table-forum-category .table-column {
    min-height: 160px;
  }

  .table.table-forum-category .forum-category .forum-category-image {
    display: none;
  }

  .table.table-forum-category .forum-category .forum-category-info {
    margin-left: 0;
  }

  .table.table-quests .table-header-column:nth-child(2),
  .table.table-quests .table-column:nth-child(2) {
    display: none;
  }

  .table.table-quests .table-body .table-column:first-child {
    width: auto;
  }

  .table.table-quests .table-body .table-column .progress-stat-wrap {
    width: auto;
  }

  .table.table-quests .table-body .table-column .table-image {
    display: none;
  }

  .table.table-top-friends .table-row:first-child {
    height: auto;
  }

  .table.table-top-friends .table-row:first-child .table-column {
    padding-top: 28px;
  }

  .table.table-top-friends .table-header-column:nth-child(2),
  .table.table-top-friends .table-header-column:nth-child(3),
  .table.table-top-friends .table-column:nth-child(2),
  .table.table-top-friends .table-column:nth-child(3) {
    display: none;
  }

  .table.table-top-friends .table-header-column:last-child,
  .table.table-top-friends .table-column:last-child {
    padding-left: 68px;
  }

  .table.table-top-friends .progress-stat-wrap {
    width: 180px;
  }

  .table.join-rows .table-body .table-row.micro:first-child,
  .table.join-rows .table-body .table-row.tiny:first-child {
    height: auto;
  }

  .table.join-rows .table-body .table-row.micro:first-child .table-column,
  .table.join-rows .table-body .table-row.tiny:first-child .table-column {
    padding-top: 24px;
  }

  .table .table-row {
    height: auto;
  }

  .table .table-row .table-column {
    padding-top: 28px;
    padding-bottom: 28px;
  }

  .table .table-row.micro .table-column,
  .table .table-row.tiny .table-column {
    padding-top: 14px;
    padding-bottom: 14px;
  }

  .table .table-row.medium .table-column,
  .table .table-row.big .table-column {
    padding-top: 28px;
    padding-bottom: 28px;
  }
}

@media screen and (max-width: 460px) {

  .table.table-forum-category .table-header-column:first-child,
  .table.table-forum-category .table-column:first-child,
  .table.table-forum-discussion .table-header-column:first-child,
  .table.table-forum-discussion .table-column:first-child {
    padding-right: 28px;
  }

  .table.table-forum-category .table-header-column:nth-last-child(2),
  .table.table-forum-category .table-column:nth-last-child(2),
  .table.table-forum-discussion .table-header-column:nth-last-child(2),
  .table.table-forum-discussion .table-column:nth-last-child(2) {
    display: none;
  }

  .table.table-forum-category .table-row:first-child .table-column:first-child,
  .table.table-forum-discussion .table-row:first-child .table-column:first-child {
    border-top-right-radius: 12px;
  }

  .table.table-forum-category .table-row:last-child .table-column:first-child,
  .table.table-forum-discussion .table-row:last-child .table-column:first-child {
    border-bottom-right-radius: 12px;
  }

  .table.table-top-friends .table-header-column:last-child,
  .table.table-top-friends .table-column:last-child {
    padding-left: 28px;
  }

  .table.table-top-friends .table-row .table-column:first-child {
    width: auto;
  }

  .table.table-top-friends .user-status .user-status-title,
  .table.table-top-friends .user-status .user-status-text {
    display: none;
  }

  .table.table-top-sellers .product-preview .product-preview-image {
    display: none;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .widget-box
-------------------------------------------------------------------*/
/*--------------------
    1. WIDGET BOX
--------------------*/
.widget-box {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.widget-box.widget-box-deleted {
  -webkit-filter: grayscale(0.8);
  filter: grayscale(0.8);
  opacity: .7 !important;
  pointer-events: none;
}

.widget-box.no-padding {
  padding: 0;
}

.widget-box.no-padding .widget-box-title {
  padding: 0 28px;
}

.widget-box.no-padding .widget-box-title:first-child {
  padding-top: 32px;
}

.widget-box.no-settings .widget-box-status .widget-box-status-content .user-status {
  padding-right: 0;
}

.widget-box.right-padded {
  padding-right: 48px;
}

.widget-box.bottom-padded {
  padding-bottom: 32px;
}

.widget-box.widget-box-bottom-sidebar {
  padding: 0;
  border-radius: 0;
  box-shadow: none;
  background-color: transparent;
}

.widget-box .widget-box-settings {
  position: absolute;
  top: 22px;
  right: 19px;
  z-index: 9999;
}

.widget-box .tag-stickers {
  display: -ms-flexbox;
  display: flex;
  position: absolute;
  top: -8px;
  right: 28px;
}

.widget-box .tag-stickers .tag-sticker {
  margin-right: 8px;
}

.widget-box .tag-stickers .tag-sticker:last-child {
  margin-right: 0;
}

.widget-box .widget-box-controls {
  position: absolute;
  top: 28px;
  right: 22px;
  z-index: 9999;
}

.widget-box .widget-box-controls .slider-controls {
  display: -ms-flexbox;
  display: flex;
}

.widget-box .widget-box-controls .slider-controls .slider-control:first-child {
  margin-right: 2px;
}

.widget-box .widget-box-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.widget-box .widget-box-actions .widget-box-action {
  display: -ms-flexbox;
  display: flex;
}

.widget-box .widget-box-actions .widget-box-action .reference-item-list {
  position: relative;
  top: -3px;
}

.widget-box .widget-box-actions .widget-box-action .form-select.v2 {
  top: -6px;
}

.widget-box .widget-box-footer .reference-item-list {
  margin-top: 12px;
}

.widget-box .widget-box-footer .chart-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 32px;
  padding-left: 36px;
}

.widget-box .widget-box-footer-actions {
  padding: 40px 28px 32px;
}

.widget-box .widget-box-footer-actions .button {
  width: 270px;
}

.widget-box .widget-box-content-slider .reaction-stats+.reaction-stats {
  margin-top: 40px;
}

.widget-box .widget-box-content-slider .badge-item-stat .text-sticker {
  top: 32px;
  right: 18px;
}

.widget-box .widget-box-title {
  font-size: 1rem;
  font-weight: 700;
}

.widget-box .widget-box-title .highlighted {
  color: var(--color-primary-dark);
}

.widget-box .widget-box-title+.widget-box-text {
  margin-top: 8px;
}

.widget-box .widget-box-title+.no-results-text {
  margin: 16px 0 32px;
}

.widget-box .widget-box-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.widget-box .widget-box-text.light {
  color: var(--color-text-alt);
}

.widget-box .widget-box-text .bold {
  font-weight: 700;
}

.widget-box .widget-box-text+.widget-box-text {
  margin-top: 16px;
}

.widget-box .widget-box-text+.button {
  margin-top: 32px;
}

.widget-box .widget-box-content {
  margin-top: 36px;
}

.widget-box .widget-box-content+.widget-box-title {
  margin-top: 36px;
}

.widget-box .widget-box-content:first-child {
  margin-top: 0;
}

.widget-box .widget-box-content.small-margin-top {
  margin-top: 28px;
}

.widget-box .widget-box-content.no-margin-top {
  margin-top: 0;
}

.widget-box .widget-box-content.padded-for-scroll {
  height: 358px;
  padding-bottom: 28px;
}

.widget-box .widget-box-content.padded-for-scroll.small {
  height: 320px;
}

.widget-box .widget-box-content.padded-for-scroll.medium {
  height: 676px;
}

.widget-box .widget-box-content.padded-for-scroll .scroll-content {
  padding: 0 28px;
}

.widget-box .widget-box-content.padded-for-scroll .exp-line-list {
  padding-top: 8px;
}

.widget-box .widget-box-content .paragraph+.information-line-list {
  margin-top: 24px;
}

.widget-box .widget-box-content .loader-spinner-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.widget-box .widget-box-content .form-input-checkbox {
  margin-top: 16px;
}

.widget-box .widget-box-content .widget-box-form {
  margin-top: 32px;
}

.widget-box .widget-box-content .widget-box-form .form-input,
.widget-box .widget-box-content .widget-box-form .form-select {
  margin-top: 28px;
}

.widget-box .widget-box-content .alert-line+.button {
  margin-top: 16px;
}

.widget-box .widget-box-content .filters+.user-status-list,
.widget-box .widget-box-content .filters+.post-preview-line-list,
.widget-box .widget-box-content .filters+.filters-items {
  margin-top: 24px;
}

.widget-box .widget-box-content .filters+.loader-spinner-wrap,
.widget-box .widget-box-content .filters+.no-results-text {
  margin-top: 32px;
}

.widget-box .widget-box-content .week-box:last-child {
  margin: 22px 0 -60px;
}

.widget-box .widget-box-content .calendar {
  margin: 0 auto;
}

.widget-box .widget-box-content .calendar-events-preview {
  margin-top: 24px;
}

.widget-box .widget-box-content .ordered-item-list {
  margin-top: 18px;
}

.widget-box .widget-box-content .progress-arc-wrap {
  margin: 0 auto;
}

.widget-box .widget-box-content .draggable-items+.widget-box-text {
  margin-top: 32px;
}

.widget-box .widget-box-content .user-stats {
  margin-top: 36px;
}

.widget-box .widget-box-content .user-stats.reference .user-stat {
  width: 100%;
}

.widget-box .widget-box-content .user-stats.reference .user-stat::after {
  height: 40px;
  top: 20px;
}

.widget-box .widget-box-content .user-stats+.user-stats {
  margin-top: 32px;
}

.widget-box .widget-box-hollow {
  margin-top: 36px;
  padding: 36px 28px;
  border-top: 1px solid var(--color-divider);
  border-bottom: 1px solid var(--color-divider);
  background-color: var(--color-box-background-alt);
}

.widget-box .widget-box-hollow.height-limit {
  max-height: 322px;
  overflow: hidden auto;
}

.widget-box .achievement-status-list {
  margin-top: 50px;
}

.widget-box .button-show-more {
  margin: -28px 28px 28px;
}

.widget-box .quick-post {
  margin-top: 20px;
  border-radius: 0;
  border-top: 1px solid var(--color-divider);
}

.widget-box .widget-box-status {
  padding-top: 24px;
  margin-bottom: 28px;
  position: relative;
}

.widget-box .widget-box-status.widget-box-status-limited {
  -webkit-mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
  mask-image: linear-gradient(to bottom, black 50%, transparent 100%);
  overflow: hidden;
}

.widget-box .widget-box-status .widget-box-status-header {
  padding: 0 28px;
}

.widget-box .widget-box-status .widget-box-status-header .user-status {
  padding-right: 50px;
}

.widget-box .widget-box-status .widget-box-status-header .user-status .user-status-title .user-avatar,
.widget-box .widget-box-status .widget-box-status-header .user-status .user-status-title .user-avatar-circle {
  display: inline;
  margin-right: 22px;
  margin-left: 4px;
}

.widget-box .widget-box-status .widget-box-status-header .user-status .user-status-title .user-avatar-circle {
  display: -ms-inline-flexbox;
  display: inline-flex;
  margin-right: 4px;
  top: 4px;
}

.widget-box .widget-box-status .widget-box-status-content {
  margin-top: 20px;
}

.widget-box .widget-box-status .widget-box-status-content .widget-box-status-text {
  padding: 0 28px;
}

.widget-box .widget-box-status .widget-box-status-content .widget-box,
.widget-box .widget-box-status .widget-box-status-content .picture-collage,
.widget-box .widget-box-status .widget-box-status-content .user-preview-widget,
.widget-box .widget-box-status .widget-box-status-content .alert-line {
  margin-left: 28px;
  margin-right: 28px;
}

.widget-box .widget-box-status .widget-box-status-content .alert-line {
  margin-top: 16px;
}

.widget-box .widget-box-status .widget-box-status-html-content {
  padding: 0 28px;
  font-family: var(--font-primary);
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
  word-break: break-word;
  white-space: pre-wrap;
}

.widget-box .widget-box-status .widget-box-status-html-content>* {
  margin-top: 12px;
}

.widget-box .widget-box-status .widget-box-status-html-content>*:first-child {
  margin-top: 0;
}

.widget-box .widget-box-status .widget-box-status-html-content img {
  width: 100%;
  height: auto;
}

.widget-box .widget-box-status .widget-box-status-html-content a {
  color: var(--color-primary);
  font-weight: 600;
}

.widget-box .widget-box-status .widget-box-status-html-content ul,
.widget-box .widget-box-status .widget-box-status-html-content ol {
  padding-left: 20px;
}

.widget-box .widget-box-status .widget-box-status-html-content ul ul,
.widget-box .widget-box-status .widget-box-status-html-content ul ol,
.widget-box .widget-box-status .widget-box-status-html-content ol ul,
.widget-box .widget-box-status .widget-box-status-html-content ol ol {
  padding-left: 0;
  margin: 18px;
}

.widget-box .widget-box-status .widget-box-status-html-content ul li,
.widget-box .widget-box-status .widget-box-status-html-content ol li {
  margin-bottom: 16px;
  display: list-item;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
}

.widget-box .widget-box-status .widget-box-status-html-content ul li:last-child,
.widget-box .widget-box-status .widget-box-status-html-content ol li:last-child {
  margin-bottom: 0;
}

.widget-box .widget-box-status .widget-box-status-html-content ul {
  list-style: disc;
}

.widget-box .widget-box-status .widget-box-status-html-content ul ul {
  list-style: circle;
}

.widget-box .widget-box-status .widget-box-status-html-content ul ol {
  list-style: lower-alpha;
}

.widget-box .widget-box-status .widget-box-status-html-content ol {
  list-style: decimal;
}

.widget-box .widget-box-status .widget-box-status-html-content ol ul {
  list-style: circle;
}

.widget-box .widget-box-status .widget-box-status-html-content ol ol {
  list-style: lower-alpha;
}

.widget-box .widget-box-status .widget-box-status-html-content blockquote {
  border-radius: 12px;
  box-shadow: var(--color-overbox-shadow);
  padding: 24px 28px 24px 46px;
  position: relative;
}

.widget-box .widget-box-status .widget-box-status-html-content blockquote::before {
  content: '"';
  color: var(--color-primary);
  font-style: italic;
  font-size: 3.75rem;
  font-weight: 700;
  position: absolute;
  top: 40px;
  left: 8px;
}

.widget-box .widget-box-status .widget-box-status-html-content blockquote p {
  font-style: italic;
}

.widget-box .widget-box-status .widget-box-status-html-content code {
  display: block;
  padding: 4px 8px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background-color: var(--color-box-background-alt);
}

.widget-box .widget-box-status .widget-box-status-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  word-break: break-word;
  white-space: pre-wrap;
}

.widget-box .widget-box-status .widget-box-status-text a {
  font-weight: 500;
}

.widget-box .widget-box-status .widget-box-status-text+.widget-box-status-text {
  margin-top: 26px;
}

.widget-box .widget-box-status .widget-box-status-text+.tag-list {
  margin-top: 8px;
}

.widget-box .widget-box-status .video-wrap {
  margin-top: 20px;
}

.widget-box .widget-box-status .widget-box .photo-preview,
.widget-box .widget-box-status .widget-box .widget-box-picture {
  cursor: auto;
}

.widget-box .widget-box-status .widget-box-picture {
  width: 100%;
  height: auto;
  margin-top: 20px;
  cursor: pointer;
}

.widget-box .widget-box-status .widget-box-picture.widget-box-picture-no-pointer {
  cursor: auto;
}

.widget-box .widget-box-status .widget-box-picture img {
  width: 100%;
  height: 100%;
}

.widget-box .widget-box-status .post-preview,
.widget-box .widget-box-status .quote-box {
  margin-top: 28px;
}

.widget-box .widget-box-status .video-status,
.widget-box .widget-box-status .iframe-wrap,
.widget-box .widget-box-status .poll-box,
.widget-box .widget-box-status .picture-collage,
.widget-box .widget-box-status .widget-box {
  margin-top: 24px;
}

.widget-box .widget-box-status .widget-box .widget-box-status {
  padding-bottom: 32px;
}

.widget-box .widget-box-status .widget-box .widget-box-status .widget-box-status-content .user-status {
  padding-right: 0;
}

.widget-box .widget-box-status .tag-list {
  margin-top: 28px;
}

.widget-box .widget-box-status .tag-list:first-child {
  margin-top: 18px;
}

.widget-box .widget-box-status .user-preview-widget {
  margin-top: 28px;
}

.widget-box .post-footer>.content-actions {
  margin: 0 28px 0;
  border-top: 1px solid var(--color-divider);
}

.widget-box .widget-box-button {
  width: 100%;
  margin-top: 32px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .widget-box .widget-box-footer .chart-info {
    display: none;
  }
}

@media screen and (max-width: 680px) {
  .widget-box .widget-box-status>.text-sticker .text-sticker-icon {
    margin-right: 0;
  }

  .widget-box .widget-box-status>.text-sticker .text-sticker-content {
    display: none;
  }

  .widget-box .widget-box-actions .widget-box-action:last-child .reference-item-list {
    position: absolute;
    top: 60px;
    left: 28px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .loader-bars
-------------------------------------------------------------------*/
/*---------------------
    1. LOADER BARS
---------------------*/
.loader-bars {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  height: 40px;
}

.loader-bars .loader-bar {
  width: 4px;
  height: 100%;
  margin-right: 4px;
  border-radius: 200px;
  -webkit-transform: scaleY(0.2);
  transform: scaleY(0.2);
  -webkit-animation: loader-bars .5s infinite alternate ease-in;
  animation: loader-bars .5s infinite alternate ease-in;
}

.loader-bars .loader-bar:last-child {
  margin-right: 0;
}

.loader-bars .loader-bar:nth-child(1) {
  background-color: var(--color-loading-bar-1);
}

.loader-bars .loader-bar:nth-child(2) {
  background-color: var(--color-loading-bar-2);
  -webkit-animation-delay: .1s;
  animation-delay: .1s;
}

.loader-bars .loader-bar:nth-child(3) {
  background-color: var(--color-loading-bar-3);
  -webkit-animation-delay: .2s;
  animation-delay: .2s;
}

.loader-bars .loader-bar:nth-child(4) {
  background-color: var(--color-loading-bar-4);
  -webkit-animation-delay: .3s;
  animation-delay: .3s;
}

.loader-bars .loader-bar:nth-child(5) {
  background-color: var(--color-loading-bar-5);
  -webkit-animation-delay: .4s;
  animation-delay: .4s;
}

.loader-bars .loader-bar:nth-child(6) {
  background-color: var(--color-loading-bar-6);
  -webkit-animation-delay: .5s;
  animation-delay: .5s;
}

.loader-bars .loader-bar:nth-child(7) {
  background-color: var(--color-loading-bar-7);
  -webkit-animation-delay: .6s;
  animation-delay: .6s;
}

.loader-bars .loader-bar:nth-child(8) {
  background-color: var(--color-loading-bar-8);
  -webkit-animation-delay: .7s;
  animation-delay: .7s;
}

.loader-spinner-wrap {
  display: block;
}

.loader-spinner-wrap.small .loader-spinner {
  width: 15px;
  height: 15px;
}

.loader-spinner {
  display: block;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: linear-gradient(to right, var(--color-primary) 10%, rgba(35, 210, 226, 0) 42%);
  -webkit-animation: loader-spinner 1.4s infinite linear;
  animation: loader-spinner 1.4s infinite linear;
  position: relative;
}

.loader-spinner::before,
.loader-spinner::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
}

.loader-spinner:before {
  width: 50%;
  height: 50%;
  background-color: var(--color-primary);
  border-radius: 100% 0 0 0;
}

.loader-spinner:after {
  width: 75%;
  height: 75%;
  border-radius: 50%;
  background-color: var(--color-box-background);
  margin: auto;
  bottom: 0;
  right: 0;
}

@-webkit-keyframes loader-spinner {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@keyframes loader-spinner {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

@-webkit-keyframes loader-bars {
  0% {
    -webkit-transform: scaleY(0.2);
    transform: scaleY(0.2);
  }

  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
  }
}

@keyframes loader-bars {
  0% {
    -webkit-transform: scaleY(0.2);
    transform: scaleY(0.2);
  }

  100% {
    -webkit-transform: scaleY(1);
    transform: scaleY(1);
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .error-section
-------------------------------------------------------------------*/
/*-----------------------
    1. ERROR SECTION
-----------------------*/
.error-section {
  margin-top: 32px;
  padding-bottom: 60px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.error-section .error-section-title {
  margin-top: 36px;
  color: var(--color-secondary);
  font-size: 9rem;
  font-weight: 700;
}

.error-section .error-section-subtitle {
  margin-top: 12px;
  font-size: 2.25rem;
  font-weight: 700;
}

.error-section .error-section-description {
  width: 90%;
  max-width: 570px;
  margin-top: 32px;
  font-size: 1.125rem;
  line-height: 1.7777777778em;
  font-weight: 500;
  text-align: center;
}

.error-section .error-section-button {
  margin-top: 50px;
  padding: 0 52px;
  font-size: 1rem;
}

/*-----------------------
    2. MEDIA QUERIES
-----------------------*/
@media screen and (max-width: 480px) {
  .error-section {
    margin-top: 16px;
    padding-bottom: 0;
  }

  .error-section .error-section-image {
    width: 100%;
    height: auto;
  }

  .error-section .error-section-title {
    font-size: 6.5rem;
  }

  .error-section .error-section-subtitle {
    width: 90%;
    text-align: center;
  }
}

/*--------------------
    WP LINK POPUP
--------------------*/
#wp-link-backdrop {
  background-color: #15151f !important;
  opacity: .96 !important;
}

#wp-link-wrap {
  height: 380px !important;
  border-radius: 12px;
  padding: 32px 28px;
  overflow: visible !important;
  background-color: var(--color-box-background) !important;
}

#wp-link-wrap.wp-core-ui .button {
  height: 48px;
  padding: 0 48px;
  border-radius: 10px;
  border: 1px solid var(--color-border);
  background-color: transparent;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  line-height: 48px;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
  box-shadow: none;
}

#wp-link-wrap.wp-core-ui .button.button-primary {
  background-color: var(--color-secondary);
  border: none;
  color: #fff;
  box-shadow: var(--color-secondary-shadow);
}

#wp-link-wrap.wp-core-ui .button.button-primary:hover {
  background-color: var(--color-secondary-hover);
}

#wp-link-wrap.wp-core-ui .button.button-primary:hover .loader-spinner:after {
  background-color: var(--color-secondary-hover);
}

#wp-link-wrap #wp-link-close {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  color: #fff;
  background-color: var(--color-secondary-dark);
  cursor: pointer;
  top: -52px;
  right: -48px;
  transition: background-color .2s ease-in-out;
}

#wp-link-wrap #wp-link-close:hover {
  background-color: var(--color-primary);
}

#wp-link-wrap #link-modal-title {
  height: auto;
  border-bottom: none;
  padding: 0;
  background-color: var(--color-box-background);
  font-size: 1rem;
  font-weight: 700;
}

#wp-link-wrap #link-selector,
#wp-link-wrap #link-options {
  padding: 0 !important;
}

#wp-link-wrap #link-selector {
  margin-top: 16px;
}

#wp-link-wrap label {
  color: var(--color-text-alt);
  font-size: 0.875rem;
}

#wp-link-wrap #wp-link-url {
  margin: 12px 0;
}

#wp-link-wrap #wp-link .howto {
  margin: 0;
  color: var(--color-text-alt);
  font-size: 1rem;
  font-weight: 500;
}

#wp-link-wrap #wp-link .link-target {
  padding: 0;
  margin-top: 16px;
}

#wp-link-wrap #wp-link .link-target label {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
}

#wp-link-wrap #wp-link .link-target input[type="checkbox"] {
  width: 22px;
  height: 22px;
  margin-right: 8px;
  border: 1px solid var(--color-border);
  border-radius: 6px;
  background: var(--color-box-background);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

#wp-link-wrap #wp-link .link-target input[type="checkbox"]::before {
  display: none;
  content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNoZWNrYm94X0Nyb3NzX0ljb24iIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiDQoJIHg9IjBweCIgeT0iMHB4IiB3aWR0aD0iMTJweCIgaGVpZ2h0PSIxMnB4IiB2aWV3Qm94PSIwIDAgMTIgMTIiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDEyIDEyIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRkZGRkZGIiBkPSJNMTIsOS42TDkuNiwxMkw2LDguMzk5TDIuNCwxMkwwLDkuNkwzLjYsNkwwLDIuNEwyLjQsMEw2LDMuNg0KCUw5LjYsMEwxMiwyLjRMOC4zOTksNkwxMiw5LjZ6Ii8+DQo8L3N2Zz4NCg==");
  width: 12px;
  height: 12px;
  margin: 0;
  padding: 4px;
}

#wp-link-wrap #wp-link .link-target input[type="checkbox"]:focus,
#wp-link-wrap #wp-link .link-target input[type="checkbox"]:checked {
  box-shadow: none;
  border-color: var(--color-primary);
}

#wp-link-wrap #wp-link .link-target input[type="checkbox"]:checked {
  background: var(--color-primary);
}

#wp-link-wrap #wp-link .link-target input[type="checkbox"]:checked::before {
  display: block;
}

#wp-link-wrap #wplink-link-existing-content,
#wp-link-wrap #search-panel {
  display: none;
}

#wp-link-wrap .submitbox {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 0 !important;
  background-color: var(--color-box-background) !important;
  border-top: none !important;
}

#wp-link-wrap .submitbox #wp-link-cancel,
#wp-link-wrap .submitbox #wp-link-update,
#wp-link-wrap .submitbox #wp-link-submit {
  float: none;
}

#wp-link-wrap .submitbox #wp-link-cancel {
  margin-right: 16px;
}

/*---------------------------
    FORUM HEADING
---------------------------*/
.forum-heading .forum-pretitle {
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
}

.forum-heading .forum-title {
  margin-top: 6px;
  font-size: 1.625rem;
}

.forum-heading+.bbpress-wrapper {
  margin-top: 8px;
}

/*---------------------------
    FORUM TOPIC META
---------------------------*/
.forum-topic-meta .forum-topic-meta-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.forum-topic-meta .forum-topic-meta-author-wrap {
  margin-top: 6px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
}

.forum-topic-meta .forum-topic-meta-author {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.forum-topic-meta .forum-topic-meta-author .forum-topic-meta-author-title {
  margin-right: 8px;
  font-size: 0.75rem;
}

.forum-topic-meta .forum-topic-meta-timestamp {
  font-size: 0.75rem;
  font-weight: 500;
}

.forum-topic-meta-author {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.forum-topic-meta-author .forum-topic-meta-author-avatar {
  margin-right: 4px;
}

.forum-topic-meta-author .forum-topic-meta-author-title {
  color: var(--color-primary-dark);
  font-weight: 700;
}

/*---------------------------
    FORUM REPLY AUTHOR
---------------------------*/
.vikinger-forum-reply-author {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.vikinger-forum-reply-author .vikinger-forum-reply-author-title {
  margin-top: 8px;
  font-size: 0.875rem;
}

.vikinger-forum-reply-author .vikinger-forum-reply-author-title a {
  color: var(--color-text);
  font-weight: 700;
}

.vikinger-forum-reply-author .vikinger-forum-reply-author-text {
  margin-top: 4px;
  font-size: 0.75rem;
}

.vikinger-forum-reply-author .vikinger-forum-reply-author-text a {
  color: var(--color-text-alt);
  font-weight: 500;
}

.vikinger-forum-reply-author .vikinger-forum-reply-author-text a:hover {
  color: var(--color-primary);
}

.vikinger-forum-reply-author .vikinger-forum-reply-author-role {
  height: 20px;
  margin-top: 12px;
  padding: 0 8px;
  border-radius: 200px;
  background-color: var(--color-secondary-dark);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
}

/*---------------------------
    TOP NAVIGATION
---------------------------*/
#bbpress-forums {
  /*------------------
      BBP REPLIES
  ------------------*/
  /*------------------
      BBP HEADER
  ------------------*/
  /*------------------
      BBP BODY
  ------------------*/
}

#bbpress-forums h2:first-child {
  font-size: 1.625rem;
}

#bbpress-forums .bbp-login-form label {
  width: auto;
}

#bbpress-forums .sidebar-menu-body .sidebar-menu-link {
  transition: color .25s ease-in-out, -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out, color .25s ease-in-out;
  transition: transform .2s ease-in-out, color .25s ease-in-out, -webkit-transform .2s ease-in-out;
}

#bbpress-forums .bbp-breadcrumb,
#bbpress-forums div.bbp-search-form {
  float: none;
}

#bbpress-forums .entry-title {
  font-size: 1.625rem;
  margin-bottom: 16px;
}

#bbpress-forums .vikinger-forum-search-bar .vikinger-create-discussion-button {
  padding: 0 32px;
}

#bbpress-forums .vikinger-forum-search-bar #subscription-toggle {
  margin-left: 16px;
}

#bbpress-forums #bbp-user-subscriptions #subscription-toggle {
  display: none;
}

#bbpress-forums #bbp-user-favorites #favorite-toggle {
  display: none;
}

#bbpress-forums .bbp-user-section .bbp-template-notice:last-child {
  margin-bottom: 0;
}

#bbpress-forums .bbp-user-section+.entry-title {
  margin-top: 64px;
}

#bbpress-forums #subscription-toggle,
#bbpress-forums #favorite-toggle {
  float: none;
  display: block;
}

#bbpress-forums #subscription-toggle span,
#bbpress-forums #favorite-toggle span {
  display: block;
  height: 48px;
  border-radius: 10px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-overbox-shadow);
  transition: box-shadow .2s ease-in-out, background-color .2s ease-in-out;
}

#bbpress-forums #subscription-toggle span:hover a,
#bbpress-forums #subscription-toggle span.is-subscribed a,
#bbpress-forums #subscription-toggle span.is-favorite a,
#bbpress-forums #favorite-toggle span:hover a,
#bbpress-forums #favorite-toggle span.is-subscribed a,
#bbpress-forums #favorite-toggle span.is-favorite a {
  color: #fff;
}

#bbpress-forums #subscription-toggle span a,
#bbpress-forums #favorite-toggle span a {
  display: block;
  padding: 0 32px;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 48px;
  text-align: center;
  transition: color .2s ease-in-out;
}

#bbpress-forums #subscription-toggle span:hover,
#bbpress-forums #subscription-toggle span.is-subscribed {
  background-color: var(--color-secondary);
  box-shadow: var(--color-secondary-shadow);
}

#bbpress-forums #favorite-toggle span:hover,
#bbpress-forums #favorite-toggle span.is-favorite {
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

#bbpress-forums .bbp-topic-split,
#bbpress-forums .bbp-reply-move,
#bbpress-forums .bbp-topic-merge {
  margin-top: 32px;
}

#bbpress-forums .vikinger-forum-replies {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-posts {
  width: 884px;
  margin-right: 16px;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar {
  width: 284px;
  margin-top: 40px;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar>* {
  margin-bottom: 16px;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar>*:last-child {
  margin-bottom: 0;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar-actions {
  display: -ms-flexbox;
  display: flex;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar-actions>* {
  width: 100%;
}

#bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar-actions>*:first-child {
  margin-right: 12px;
}

#bbpress-forums .vikinger-forum-topic-tags {
  font-size: 0.875rem;
}

#bbpress-forums ul.bbp-replies,
#bbpress-forums ul.bbp-search-results {
  border: none;
  margin-bottom: 0;
}

#bbpress-forums div.bbp-reply-header,
#bbpress-forums div.bbp-forum-header,
#bbpress-forums div.bbp-topic-header {
  padding: 22px 28px;
  background-color: var(--color-box-background-alt);
  border: none;
}

#bbpress-forums div.bbp-reply-header:first-child,
#bbpress-forums div.bbp-forum-header:first-child,
#bbpress-forums div.bbp-topic-header:first-child {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

#bbpress-forums div.bbp-forum-header .bbp-meta .bbp-forum-post-date {
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-forum-header .bbp-meta .bbp-forum-permalink {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  transition: color .2s ease-in-out;
}

#bbpress-forums div.bbp-forum-header .bbp-meta .bbp-forum-permalink:hover {
  color: var(--color-primary);
}

#bbpress-forums div.bbp-forum-header .bbp-forum-title {
  color: var(--color-text);
}

#bbpress-forums div.bbp-forum-header .bbp-forum-title a {
  color: var(--color-primary);
}

#bbpress-forums div.bbp-topic-header .bbp-meta .bbp-topic-post-date {
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-topic-header .bbp-meta .bbp-topic-permalink {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  transition: color .2s ease-in-out;
}

#bbpress-forums div.bbp-topic-header .bbp-meta .bbp-topic-permalink:hover {
  color: var(--color-primary);
}

#bbpress-forums div.bbp-topic-header .bbp-topic-title {
  color: var(--color-text);
}

#bbpress-forums div.bbp-topic-header .bbp-topic-title a {
  color: var(--color-primary);
}

#bbpress-forums div.bbp-topic-header .bbp-topic-title .bbp-topic-title-meta {
  font-size: 0.875rem;
}

#bbpress-forums div.bbp-topic-header .bbp-topic-title .bbp-topic-title-meta a {
  font-weight: 700;
}

#bbpress-forums div.bbp-reply-header .bbp-meta {
  width: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-reply-post-date {
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-header {
  display: block;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-header .bbp-topic-permalink {
  color: var(--color-primary);
  font-weight: 700;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-reply-permalink,
#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-admin-links {
  font-size: 0.875rem;
  font-weight: 700;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-reply-permalink {
  color: var(--color-text);
  transition: color .2s ease-in-out;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-reply-permalink:hover {
  color: var(--color-primary);
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-admin-links {
  color: var(--color-text-alt-2);
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-admin-links a {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: none;
  transition: color .2s ease-in-out;
}

#bbpress-forums div.bbp-reply-header .bbp-meta .bbp-admin-links a:hover {
  color: var(--color-text);
}

#bbpress-forums div.bbp-topic-author,
#bbpress-forums div.bbp-reply-author {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  float: none;
  width: 156px;
  padding-right: 28px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

#bbpress-forums div.bbp-topic-author .bbp-reply-ip,
#bbpress-forums div.bbp-reply-author .bbp-reply-ip {
  margin-top: 4px;
}

#bbpress-forums div.bbp-topic-author .bbp-reply-ip span.bbp-author-ip,
#bbpress-forums div.bbp-reply-author .bbp-reply-ip span.bbp-author-ip {
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-topic-author .gamipress-bbpress-achievements,
#bbpress-forums div.bbp-reply-author .gamipress-bbpress-achievements {
  margin-top: 4px;
}

#bbpress-forums div.bbp-topic-author .gamipress-bbpress-points,
#bbpress-forums div.bbp-reply-author .gamipress-bbpress-points {
  margin: 8px 0;
}

#bbpress-forums div.bbp-topic-author .gamipress-bbpress-user-points,
#bbpress-forums div.bbp-topic-author .gamipress-bbpress-points-label,
#bbpress-forums div.bbp-reply-author .gamipress-bbpress-user-points,
#bbpress-forums div.bbp-reply-author .gamipress-bbpress-points-label {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-topic-author .bpbm-private-message-link-buddypress,
#bbpress-forums div.bbp-reply-author .bpbm-private-message-link-buddypress {
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-topic-author .bpbm-private-message-link-buddypress:hover,
#bbpress-forums div.bbp-reply-author .bpbm-private-message-link-buddypress:hover {
  color: var(--color-primary-dark);
}

#bbpress-forums div.bbp-topic-content,
#bbpress-forums div.bbp-reply-content {
  width: 100%;
  padding: 0;
  margin-left: 0;
}

#bbpress-forums div.bbp-topic-content>*,
#bbpress-forums div.bbp-reply-content>* {
  margin-top: 24px;
}

#bbpress-forums div.bbp-topic-content>*:first-child,
#bbpress-forums div.bbp-reply-content>*:first-child {
  margin-top: 0;
}

#bbpress-forums div.bbp-topic-content p,
#bbpress-forums div.bbp-reply-content p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
  word-break: break-word;
}

#bbpress-forums div.bbp-topic-content p img,
#bbpress-forums div.bbp-reply-content p img {
  margin-top: 24px;
}

#bbpress-forums div.bbp-topic-content a,
#bbpress-forums div.bbp-reply-content a {
  font-weight: 600;
}

#bbpress-forums div.bbp-topic-content ul,
#bbpress-forums div.bbp-topic-content ol,
#bbpress-forums div.bbp-reply-content ul,
#bbpress-forums div.bbp-reply-content ol {
  margin-top: 24px;
  padding-left: 20px;
}

#bbpress-forums div.bbp-topic-content ul ul,
#bbpress-forums div.bbp-topic-content ul ol,
#bbpress-forums div.bbp-topic-content ol ul,
#bbpress-forums div.bbp-topic-content ol ol,
#bbpress-forums div.bbp-reply-content ul ul,
#bbpress-forums div.bbp-reply-content ul ol,
#bbpress-forums div.bbp-reply-content ol ul,
#bbpress-forums div.bbp-reply-content ol ol {
  padding-left: 0;
  margin: 18px;
}

#bbpress-forums div.bbp-topic-content ul li,
#bbpress-forums div.bbp-topic-content ol li,
#bbpress-forums div.bbp-reply-content ul li,
#bbpress-forums div.bbp-reply-content ol li {
  margin-bottom: 16px;
  display: list-item;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-topic-content ul li:last-child,
#bbpress-forums div.bbp-topic-content ol li:last-child,
#bbpress-forums div.bbp-reply-content ul li:last-child,
#bbpress-forums div.bbp-reply-content ol li:last-child {
  margin-bottom: 0;
}

#bbpress-forums div.bbp-topic-content ul,
#bbpress-forums div.bbp-reply-content ul {
  list-style: disc;
}

#bbpress-forums div.bbp-topic-content ul ul,
#bbpress-forums div.bbp-reply-content ul ul {
  list-style: circle;
}

#bbpress-forums div.bbp-topic-content ul ol,
#bbpress-forums div.bbp-reply-content ul ol {
  list-style: lower-alpha;
}

#bbpress-forums div.bbp-topic-content ol,
#bbpress-forums div.bbp-reply-content ol {
  list-style: decimal;
}

#bbpress-forums div.bbp-topic-content ol ul,
#bbpress-forums div.bbp-reply-content ol ul {
  list-style: circle;
}

#bbpress-forums div.bbp-topic-content ol ol,
#bbpress-forums div.bbp-reply-content ol ol {
  list-style: lower-alpha;
}

#bbpress-forums div.bbp-topic-content blockquote,
#bbpress-forums div.bbp-reply-content blockquote {
  border-radius: 12px;
  box-shadow: var(--color-overbox-shadow);
  padding: 24px 28px 24px 46px;
  position: relative;
}

#bbpress-forums div.bbp-topic-content blockquote::before,
#bbpress-forums div.bbp-reply-content blockquote::before {
  content: '"';
  color: var(--color-primary);
  font-style: italic;
  font-size: 3.75rem;
  font-weight: 700;
  position: absolute;
  top: 40px;
  left: 8px;
}

#bbpress-forums div.bbp-topic-content blockquote p,
#bbpress-forums div.bbp-reply-content blockquote p {
  font-style: italic;
}

#bbpress-forums div.bbp-topic-content pre,
#bbpress-forums div.bbp-reply-content pre {
  background-color: var(--color-box-background);
  border: none;
}

#bbpress-forums div.bbp-topic-content pre code,
#bbpress-forums div.bbp-reply-content pre code {
  padding: 12px;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  background-color: var(--color-box-background-alt);
  box-shadow: var(--color-overbox-shadow);
  color: var(--color-text);
}

#bbpress-forums div.bbp-topic-content .vikinger-forum-media-wrap,
#bbpress-forums div.bbp-reply-content .vikinger-forum-media-wrap {
  position: relative;
  padding-top: 56.25%;
}

#bbpress-forums div.bbp-topic-content .vikinger-forum-media-wrap iframe,
#bbpress-forums div.bbp-reply-content .vikinger-forum-media-wrap iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log {
  margin-top: 24px;
  padding: 12px 0 0;
  border-top: 1px solid var(--color-divider);
  font-size: 0.75rem;
  font-weight: 500;
}

#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item,
#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 6px;
  color: var(--color-text-alt);
}

#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item:last-child,
#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item:last-child,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item:last-child,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item:last-child,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item:last-child,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item:last-child,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item:last-child,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item:last-child {
  margin-bottom: 0;
}

#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-avatar,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-avatar {
  margin-left: 4px;
}

#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-topic-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-topic-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-reply-content ul.bbp-topic-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-topic-revision-log-item .vikinger-forum-reply-revision-author-title,
#bbpress-forums div.bbp-reply-content ul.bbp-reply-revision-log .bbp-reply-revision-log-item .vikinger-forum-reply-revision-author-title {
  margin-left: 4px;
  color: var(--color-primary-dark);
  font-weight: 700;
}

#bbpress-forums li.bbp-header {
  padding: 14px 28px;
  background-color: transparent;
  border: none;
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1em;
  text-transform: uppercase;
}

#bbpress-forums li.bbp-header .forum-titles .bbp-forum-topic-count,
#bbpress-forums li.bbp-header .forum-titles .bbp-forum-reply-count,
#bbpress-forums li.bbp-header .forum-titles .bbp-topic-voice-count,
#bbpress-forums li.bbp-header .forum-titles .bbp-topic-reply-count {
  padding: 0;
}

#bbpress-forums li.bbp-header .forum-titles .bbp-forum-freshness,
#bbpress-forums li.bbp-header .forum-titles .bbp-topic-freshness {
  text-align: left;
}

#bbpress-forums li.bbp-header .bbp-search-author,
#bbpress-forums li.bbp-header .bbp-reply-author {
  display: block;
  width: 156px;
  text-align: left;
}

#bbpress-forums li.bbp-header .bbp-search-content,
#bbpress-forums li.bbp-header .bbp-reply-content {
  margin-left: 0;
}

#bbpress-forums li.bbp-body {
  border-radius: 12px;
}

#bbpress-forums li.bbp-body ul.hentry,
#bbpress-forums li.bbp-body div.hentry {
  display: -ms-flexbox;
  display: flex;
  padding: 28px 28px 32px;
}

#bbpress-forums li.bbp-body ul.hentry.status-spam,
#bbpress-forums li.bbp-body div.hentry.status-spam {
  background-color: rgba(253, 67, 80, 0.1);
}

#bbpress-forums li.bbp-body ul.hentry.status-spam.odd,
#bbpress-forums li.bbp-body div.hentry.status-spam.odd {
  background-color: rgba(253, 67, 80, 0.1);
}

#bbpress-forums li.bbp-body ul.hentry.status-closed a,
#bbpress-forums li.bbp-body div.hentry.status-closed a {
  color: var(--color-text);
}

#bbpress-forums li.bbp-body ul.hentry.status-closed .forum-topic-meta-author-title,
#bbpress-forums li.bbp-body div.hentry.status-closed .forum-topic-meta-author-title {
  color: var(--color-primary);
}

#bbpress-forums li.bbp-body ul.hentry.odd,
#bbpress-forums li.bbp-body div.hentry.odd {
  background-color: var(--color-box-background);
}

#bbpress-forums li.bbp-body ul.hentry.even,
#bbpress-forums li.bbp-body div.hentry.even {
  background-color: var(--color-box-background-alt);
}

#bbpress-forums li.bbp-body ul.hentry:last-child,
#bbpress-forums li.bbp-body div.hentry:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

#bbpress-forums li.bbp-body ul.forum,
#bbpress-forums li.bbp-body ul.topic {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 32px 28px;
  border: none;
  background-color: var(--color-box-background-alt);
}

#bbpress-forums li.bbp-body ul.forum:first-child,
#bbpress-forums li.bbp-body ul.topic:first-child {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

#bbpress-forums li.bbp-body ul.forum:last-child,
#bbpress-forums li.bbp-body ul.topic:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

#bbpress-forums li.bbp-body ul.forum.odd,
#bbpress-forums li.bbp-body ul.topic.odd {
  background-color: var(--color-box-background);
}

#bbpress-forums li.bbp-body ul.topic.super-sticky,
#bbpress-forums li.bbp-body ul.topic.sticky {
  background-color: var(--color-box-background) !important;
}

#bbpress-forums li.bbp-body ul.topic.super-sticky.even,
#bbpress-forums li.bbp-body ul.topic.sticky.even {
  background-color: var(--color-box-background-alt) !important;
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title {
  font-size: 1rem;
  font-weight: 700;
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-permalink {
  line-height: 20px;
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-permalink .vikinger-forum-pinned-tag,
#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-permalink .vikinger-forum-closed-tag {
  display: inline-block;
  height: 20px;
  padding: 0 8px;
  margin-right: 8px;
  border-radius: 200px;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 20px;
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-permalink .vikinger-forum-pinned-tag {
  background-color: var(--color-primary);
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-permalink .vikinger-forum-closed-tag {
  background-color: var(--color-tertiary);
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-meta {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin: 8px 0 0 0;
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-meta a {
  color: var(--color-primary-dark);
  font-weight: 700;
}

#bbpress-forums li.bbp-body ul.topic li.bbp-topic-title .bbp-topic-meta .forum-topic-meta-author {
  margin: 0 6px;
}

#bbpress-forums li.bbp-body .bbp-forum-topic-count,
#bbpress-forums li.bbp-body .bbp-forum-reply-count,
#bbpress-forums li.bbp-body .bbp-forum-freshness,
#bbpress-forums li.bbp-body .bbp-topic-voice-count,
#bbpress-forums li.bbp-body .bbp-topic-reply-count,
#bbpress-forums li.bbp-body .bbp-topic-freshness {
  font-size: 0.875rem;
}

#bbpress-forums li.bbp-body .bbp-forum-topic-count,
#bbpress-forums li.bbp-body .bbp-forum-reply-count,
#bbpress-forums li.bbp-body .bbp-topic-voice-count,
#bbpress-forums li.bbp-body .bbp-topic-reply-count {
  font-weight: 700;
}

#bbpress-forums li.bbp-body .bbp-forum-freshness,
#bbpress-forums li.bbp-body .bbp-topic-freshness {
  color: var(--color-text-alt);
  font-weight: 500;
  text-align: left;
}

#bbpress-forums .vikinger-forum-info-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

#bbpress-forums .vikinger-forum-info-wrap .vikinger-forum-thumbnail {
  display: block;
  margin-right: 28px;
}

#bbpress-forums .vikinger-forum-info-wrap .user-avatar,
#bbpress-forums .vikinger-forum-info-wrap .user-avatar-circle {
  margin-right: 32px;
}

#bbpress-forums .vikinger-forum-info-wrap .vikinger-forum-info .bbp-forum-title {
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.3333333333em;
}

#bbpress-forums .vikinger-forum-info-wrap .vikinger-forum-info .bbp-forum-content {
  margin: 8px 0 0;
  padding: 0;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

#bbpress-forums .bbp-forums-list {
  border: none;
}

#bbpress-forums .bbp-forums-list .bbp-forum {
  display: block;
  margin-top: 12px;
  font-size: 0.875rem;
  font-weight: 700;
}

#bbpress-forums .bbp-forums-list .bbp-forum.css-sep:not(:last-child)::after {
  display: none;
}

#bbpress-forums .bbp-topic-form,
#bbpress-forums .bbp-reply-form {
  margin-top: 32px;
}

#bbpress-forums div.bbp-submit-wrapper {
  float: none;
  margin-top: 28px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

#bbp-cancel-reply-to-link,
#bbpress-forums div.bbp-submit-wrapper .button {
  width: auto;
  padding: 0 48px;
}

#bbp-cancel-reply-to-link+.button {
  margin-left: 12px;
}

#bbpress-forums .wp-editor-container,
#bbpress-forums .quicktags-toolbar {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  border-color: var(--color-border);
}

#bbpress-forums .wp-editor-container {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

#bbpress-forums .quicktags-toolbar {
  background-color: var(--color-box-background-alt);
}

#bbpress-forums div.bbp-the-content-wrapper {
  margin: 28px 0 0;
}

#bbpress-forums div.bbp-the-content-wrapper div.quicktags-toolbar {
  padding: 0 12px;
}

#bbpress-forums div.bbp-the-content-wrapper input[type="button"] {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

#bbpress-forums div.bbp-the-content-wrapper input[type="button"]:hover {
  color: var(--color-primary);
  border-color: transparent;
  background-color: transparent;
}

#bbpress-forums div.bbp-the-content-wrapper .wp-editor-area {
  font-family: var(--font-primary);
}

#bbpress-forums div.bbp-the-content-wrapper textarea.bbp-the-content {
  padding: 14px 18px;
  font-size: 0.875rem;
}

#bbpress-forums fieldset.bbp-form {
  border: none;
  padding: 0;
  margin: 0;
}

#bbpress-forums fieldset.bbp-form#bbp-edit-topic-tag fieldset.bbp-form label {
  width: auto;
}

#bbpress-forums fieldset.bbp-form legend {
  color: var(--color-text);
  font-family: "Rajdhani", sans-serif;
  font-size: 1.625rem;
  font-weight: 700;
  line-height: 1.1em;
}

#bbpress-forums fieldset.bbp-form legend+.bbp-template-notice,
#bbpress-forums fieldset.bbp-form legend+.form-item {
  margin-top: 0;
}

#bbpress-forums fieldset.bbp-form .bbp-form+.bbp-form {
  margin-top: 32px;
}

#bbpress-forums fieldset.bbp-form .bbp-form legend {
  margin-bottom: 32px;
}

#bbpress-forums fieldset.bbp-form input,
#bbpress-forums fieldset.bbp-form select {
  margin-bottom: 0;
}

#bbpress-forums fieldset.bbp-form select#bbp_forum_id {
  max-width: 100%;
}

#bbpress-forums fieldset.bbp-form .form-row {
  margin-top: 28px;
}

#bbpress-forums fieldset.bbp-form .form-row .form-item {
  margin-top: 0;
}

#bbpress-forums fieldset.bbp-form .form-item {
  margin-top: 28px;
}

#bbpress-forums fieldset.bbp-form .form-item:first-child {
  margin-top: 0;
}

#bbpress-forums fieldset.bbp-form .form-select select {
  height: 100%;
  padding: 0 40px 0 20px;
}

#bbpress-forums fieldset.bbp-form .form-input.small input {
  height: 48px;
  padding: 0 18px;
}

#bbpress-forums .vikinger-forum-topic-form-wrap {
  margin-top: 28px;
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

#bbpress-forums .vikinger-forum-topic-form-wrap *:first-child {
  margin-top: 0;
}

#bbpress-forums .bbp-footer {
  display: none;
}

#bbpress-forums .bbp-breadcrumb p {
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.5em;
}

#bbpress-forums .bbp-breadcrumb p a {
  font-weight: 700;
}

#bbpress-forums .bbp-breadcrumb p .bbp-breadcrumb-sep {
  font-size: 1rem;
  margin: 0 4px;
}

#bbpress-forums .section-filters-bar {
  margin-top: 28px;
}

#bbpress-forums #bbp-search-form #bbp_search {
  display: block;
  width: 100%;
}

#bbpress-forums #message,
#bbpress-forums div.bbp-template-notice {
  padding: 14px 18px;
  border: 1px solid var(--color-secondary);
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  border-radius: 12px;
  position: relative;
}

#bbpress-forums #message+.bbp-pagination,
#bbpress-forums div.bbp-template-notice+.bbp-pagination {
  margin-top: 0;
}

#bbpress-forums #message.info,
#bbpress-forums div.bbp-template-notice.info {
  border: 1px solid var(--color-primary);
}

#bbpress-forums #message.info::before,
#bbpress-forums div.bbp-template-notice.info::before {
  background-color: var(--color-notice-overlay-background-primary);
}

#bbpress-forums #message.error,
#bbpress-forums div.bbp-template-notice.error {
  border: 1px solid var(--color-tertiary);
}

#bbpress-forums #message.error::before,
#bbpress-forums div.bbp-template-notice.error::before {
  background-color: var(--color-notice-overlay-background-tertiary);
}

#bbpress-forums #message::before,
#bbpress-forums div.bbp-template-notice::before {
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background-color: var(--color-notice-overlay-background-secondary);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

#bbpress-forums #message ul,
#bbpress-forums div.bbp-template-notice ul {
  position: relative;
  z-index: 2;
}

#bbpress-forums #message ul li,
#bbpress-forums div.bbp-template-notice ul li {
  margin: 0 0 4px 0 !important;
  padding: 0;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2857142857em;
}

#bbpress-forums #message ul li:last-child,
#bbpress-forums div.bbp-template-notice ul li:last-child {
  margin-bottom: 0 !important;
}

#bbpress-forums #message .bbp-forum-description,
#bbpress-forums div.bbp-template-notice .bbp-forum-description {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
}

#bbpress-forums #message .bbp-forum-description a,
#bbpress-forums div.bbp-template-notice .bbp-forum-description a {
  margin: 0 4px;
  color: var(--color-text);
  font-weight: 700;
}

#bbpress-forums #message .bbp-forum-description a:hover,
#bbpress-forums div.bbp-template-notice .bbp-forum-description a:hover {
  color: var(--color-primary-dark);
}

#bbpress-forums #message .bbp-forum-description .bbp-forum-description-author,
#bbpress-forums div.bbp-template-notice .bbp-forum-description .bbp-forum-description-author {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

#bbpress-forums #message .bbp-forum-description .bbp-forum-description-author .bbp-forum-description-author-avatar,
#bbpress-forums div.bbp-template-notice .bbp-forum-description .bbp-forum-description-author .bbp-forum-description-author-avatar {
  margin-left: 6px;
}

#bbpress-forums #message .bbp-forum-description .bbp-forum-description-author .bbp-forum-description-author-title,
#bbpress-forums div.bbp-template-notice .bbp-forum-description .bbp-forum-description-author .bbp-forum-description-author-title {
  margin: 0;
}

#bbpress-forums div.bbp-template-notice {
  margin: 32px 0;
}

#bbpress-forums #message p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2857142857em;
}

#bbpress-forums .bbp-pagination {
  float: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-top: 32px;
}

#bbpress-forums .bbp-pagination .bbp-pagination-count {
  float: none;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

#bbpress-forums .bbp-pagination .bbp-pagination-links {
  float: none;
  display: -ms-flexbox;
  display: flex;
}

#bbpress-forums .bbp-pagination .bbp-pagination-links a,
#bbpress-forums .bbp-pagination .bbp-pagination-links span {
  float: none;
  height: 22px;
  margin: 0 6px 0 0;
  padding: 0 8px;
  background-color: var(--color-box-background);
  border-radius: 6px;
  border: none;
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 22px;
  box-shadow: var(--color-overbox-shadow);
}

#bbpress-forums .bbp-pagination .bbp-pagination-links a:hover,
#bbpress-forums .bbp-pagination .bbp-pagination-links span:hover {
  color: var(--color-primary-dark);
}

#bbpress-forums .bbp-pagination .bbp-pagination-links a:last-child,
#bbpress-forums .bbp-pagination .bbp-pagination-links span:last-child {
  margin-right: 0;
}

#bbpress-forums .bbp-pagination .bbp-pagination-links span.current {
  background-color: var(--color-primary);
  border: none;
  color: #fff;
  opacity: 1;
}

#bbpress-forums .bbp-topic-pagination {
  display: -ms-flexbox;
  display: flex;
  margin: 6px 0 0 0;
}

#bbpress-forums .bbp-topic-pagination .page-numbers {
  height: 22px;
  margin: 0 6px 0 0;
  padding: 0 8px;
  background-color: var(--color-box-background);
  border-radius: 6px;
  border: none;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 22px;
  box-shadow: var(--color-overbox-shadow);
}

#bbpress-forums .bbp-topic-pagination .page-numbers.dots {
  background-color: transparent;
  box-shadow: none;
}

#bbpress-forums .bbp-topic-pagination .page-numbers.dots:hover {
  background-color: transparent;
  color: var(--color-text);
}

#bbpress-forums .bbp-topic-pagination .page-numbers:hover {
  background-color: var(--color-box-background);
  border: none;
  color: var(--color-primary-dark);
  opacity: 1;
}

#bbpress-forums .bbp-topic-pagination .page-numbers:last-child {
  margin-right: 0;
}

#bbpress-forums ul.bbp-forums,
#bbpress-forums ul.bbp-topics {
  margin: 16px 0 0 0;
  border: none;
}

#bbpress-forums ul.bbp-forums li,
#bbpress-forums ul.bbp-topics li {
  color: var(--color-text);
}

#bbpress-forums ul.bbp-forums li.bbp-forum-info {
  width: 50%;
}

#bbpress-forums ul.bbp-forums li.bbp-forum-topic-count,
#bbpress-forums ul.bbp-forums li.bbp-forum-reply-count {
  padding: 0 46px;
}

#bbpress-forums ul.bbp-forums li.bbp-forum-freshness {
  width: 30%;
  padding-left: 60px;
}

#bbpress-forums ul.bbp-topics li.bbp-topic-title {
  width: 50%;
}

#bbpress-forums ul.bbp-topics li.bbp-topic-voice-count,
#bbpress-forums ul.bbp-topics li.bbp-topic-reply-count {
  padding: 0 46px;
}

#bbpress-forums ul.bbp-topics li.bbp-topic-freshness {
  width: 30%;
  padding-left: 60px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1260px) {
  #bbpress-forums ul.bbp-forums li.bbp-forum-info {
    width: 70%;
  }

  #bbpress-forums ul.bbp-forums li.bbp-forum-topic-count,
  #bbpress-forums ul.bbp-forums li.bbp-forum-reply-count {
    width: 15%;
  }

  #bbpress-forums ul.bbp-forums li.bbp-forum-freshness {
    display: none;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-title {
    width: 70%;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-voice-count,
  #bbpress-forums ul.bbp-topics li.bbp-topic-reply-count {
    width: 15%;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-freshness {
    display: none;
  }

  #bbpress-forums .vikinger-forum-replies {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  #bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-posts {
    width: 100%;
    margin-right: 0;
    margin-top: 16px;
    -ms-flex-order: 2;
    order: 2;
  }

  #bbpress-forums .vikinger-forum-replies .vikinger-forum-replies-sidebar {
    width: 100%;
    margin-top: 0;
    -ms-flex-order: 1;
    order: 1;
  }

  #bbpress-forums .vikinger-forum-topic-tags {
    font-size: 0.875rem;
  }
}

@media screen and (max-width: 960px) {
  #bbpress-forums .vikinger-forum-search-bar .section-filters-bar-actions.full {
    display: block;
  }

  #bbpress-forums .vikinger-forum-search-bar .section-filters-bar-actions .form+.button {
    margin: 16px 0 0;
  }

  #bbpress-forums .vikinger-forum-search-bar .section-filters-bar-actions #subscription-toggle {
    margin: 16px 0 0;
  }

  #bbpress-forums ul.bbp-forums li.bbp-forum-topic-count,
  #bbpress-forums ul.bbp-forums li.bbp-forum-reply-count {
    padding: 0 22px;
  }

  #bbpress-forums ul.bbp-forums li.bbp-body ul.forum .vikinger-forum-info-wrap {
    display: block;
  }

  #bbpress-forums ul.bbp-forums li.bbp-body ul.forum .vikinger-forum-info-wrap .vikinger-forum-thumbnail,
  #bbpress-forums ul.bbp-forums li.bbp-body ul.forum .vikinger-forum-info-wrap .user-avatar,
  #bbpress-forums ul.bbp-forums li.bbp-body ul.forum .vikinger-forum-info-wrap .user-avatar-circle {
    margin-right: 0;
    margin-bottom: 12px;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-voice-count,
  #bbpress-forums ul.bbp-topics li.bbp-topic-reply-count {
    padding: 0 22px;
  }
}

@media screen and (max-width: 480px) {
  #bbpress-forums ul.bbp-forums li.bbp-forum-info {
    width: 100%;
  }

  #bbpress-forums ul.bbp-forums li.bbp-forum-topic-count,
  #bbpress-forums ul.bbp-forums li.bbp-forum-reply-count {
    display: none;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-title {
    width: 100%;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-voice-count,
  #bbpress-forums ul.bbp-topics li.bbp-topic-reply-count {
    display: none;
  }

  #bbpress-forums div.bbp-search-form input[type="text"] {
    padding: 0 82px 0 18px;
  }

  #bbpress-forums .bbp-pagination {
    display: block;
  }

  #bbpress-forums .bbp-pagination .bbp-pagination-count {
    text-align: center;
  }

  #bbpress-forums .bbp-pagination .bbp-pagination-links {
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-top: 16px;
  }

  #bbpress-forums div.bbp-topic-header .bbp-meta .bbp-topic-post-date {
    float: none;
  }

  #bbpress-forums li.bbp-body div.hentry {
    display: block;
  }

  #bbpress-forums li.bbp-body div.bbp-topic-author,
  #bbpress-forums li.bbp-body div.bbp-reply-author {
    -ms-flex-align: start;
    align-items: flex-start;
    width: 100%;
    margin: 0 0 16px;
    padding: 0 0 16px;
    border-bottom: 1px solid var(--color-divider);
    box-sizing: border-box;
  }

  .vikinger-forum-reply-author {
    -ms-flex-align: start;
    align-items: flex-start;
  }
}

@media screen and (max-width: 320px) {
  #bbpress-forums ul.bbp-forums li.bbp-forum-info {
    text-align: left;
  }

  #bbpress-forums ul.bbp-topics li.bbp-topic-title {
    text-align: left;
  }
}

/*--------------------
    WOOCOMMERCE
--------------------*/
.section-banner+.woocommerce,
.section-banner+.woocommerce-breadcrumb,
.section-banner+.vikinger-woocommerce-page-title,
.section-banner+.vikinger-wc-content {
  margin-top: 64px;
}

.vikinger-wc-content.vikinger-wc-content-with-sidebar {
  display: grid;
  grid-template-areas: "sidebar body";
  gap: 16px;
  grid-template-columns: 23.9864864865% 74.6621621622%;
}

.vikinger-wc-content.vikinger-wc-content-with-sidebar .vikinger-wc-sidebar {
  grid-area: sidebar;
}

.vikinger-wc-content.vikinger-wc-content-with-sidebar .vikinger-wc-body {
  grid-area: body;
}

.grid .woocommerce-MyAccount-content {
  float: none;
  width: 100%;
}

.logged-in .header-cart .action-list {
  padding-right: 0;
}

.logged-in .header-cart .action-list::before {
  display: none;
}

.header-cart+#header-notifications .action-list {
  padding-left: 0;
}

.header-cart+#header-notifications .action-list::after {
  display: none;
}

.header-cart+.button {
  margin-left: 32px;
}

.pswp {
  z-index: 10001;
}

.pswp__bg {
  background-color: rgba(21, 21, 31, 0.96);
}

.pswp__caption {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.pswp__counter,
.pswp__caption__center {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
}

.pswp__caption__center {
  padding: 0;
  text-align: center;
}

.select2-container .select2-dropdown {
  background-color: var(--color-box-background);
  border-color: var(--color-border);
}

.select2-container .select2-search--dropdown .select2-search__field {
  height: 48px;
  padding: 0 18px;
  border: 1px solid var(--color-border);
  font-size: 0.875rem;
}

.select2-container .select2-results {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

.select2-container .select2-results .select2-results__option.select2-results__option--highlighted,
.select2-container .select2-results .select2-results__option[data-selected="true"] {
  color: #fff;
  background-color: var(--color-secondary);
}

.vikinger-woocommerce-page-title {
  margin-bottom: 32px;
  font-size: 2em;
}

.woocommerce .header-cart+#header-notifications .action-list {
  padding-left: 0;
}

.woocommerce .header-cart+#header-notifications .action-list::after {
  display: none;
}

.woocommerce .header-cart+.button {
  margin-left: 32px;
}

.woocommerce .section-header {
  margin: 0 0 28px;
}

.woocommerce .woocommerce-breadcrumb {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce .woocommerce-breadcrumb a {
  color: var(--color-text);
}

.woocommerce .woocommerce-breadcrumb .woocommerce-breadcrumb-separator {
  margin: 0 10px;
  color: var(--color-primary);
}

.woocommerce .woocommerce-result-count {
  margin-top: 17px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.woocommerce .return-to-shop .button {
  display: inline-block;
  padding: 0 32px;
  background-color: var(--color-primary);
  line-height: 48px;
  box-shadow: var(--color-primary-shadow);
}

.woocommerce .return-to-shop .button:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce span.onsale {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 32px;
  min-height: auto;
  min-width: auto;
  padding: 0 16px;
  border-radius: 200px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.woocommerce .price {
  color: var(--color-text);
  font-weight: 700;
}

.woocommerce .price .woocommerce-Price-currencySymbol {
  color: var(--color-primary);
}

.woocommerce .price ins {
  text-decoration: none;
}

.woocommerce .vikinger-wc-categories {
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.3333333333em;
}

.woocommerce .vikinger-wc-categories a {
  color: var(--color-text);
  font-weight: 700;
}

.woocommerce .vikinger-wc-categories a:hover {
  color: var(--color-primary);
}

.woocommerce .vikinger-wc-categories::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 6px;
  border-radius: 50%;
  border: 2px solid var(--color-primary);
}

.woocommerce .star-rating {
  width: 6.74em;
  margin: 0;
  font-size: 12px;
  letter-spacing: 4px;
}

.woocommerce .star-rating::before {
  color: var(--color-border);
}

.woocommerce .star-rating span {
  color: #ffe00d;
}

.woocommerce button.button,
.woocommerce a.button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  border-radius: 10px;
  padding: 0;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  box-shadow: 3px 5px 10px 0 rgba(62, 63, 94, 0.2);
}

.woocommerce button.button.loading,
.woocommerce a.button.loading {
  padding: 0 32px;
  pointer-events: none;
}

.woocommerce button.button.loading::after,
.woocommerce a.button.loading::after {
  margin-left: 6px;
  position: static;
}

.woocommerce button.button:hover,
.woocommerce a.button:hover {
  color: #fff;
  background-color: #2e2e47;
}

.woocommerce button.button.small,
.woocommerce a.button.small {
  height: 40px;
  font-size: 0.75rem;
  line-height: 40px;
}

.woocommerce button.button.alt,
.woocommerce button.button.alt.disabled,
.woocommerce button.button.primary,
.woocommerce a.button.alt,
.woocommerce a.button.alt.disabled,
.woocommerce a.button.primary {
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

.woocommerce button.button.alt:hover,
.woocommerce button.button.alt.disabled:hover,
.woocommerce button.button.primary:hover,
.woocommerce a.button.alt:hover,
.woocommerce a.button.alt.disabled:hover,
.woocommerce a.button.primary:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce button.button.alt:hover .loader-spinner:after,
.woocommerce button.button.alt.disabled:hover .loader-spinner:after,
.woocommerce button.button.primary:hover .loader-spinner:after,
.woocommerce a.button.alt:hover .loader-spinner:after,
.woocommerce a.button.alt.disabled:hover .loader-spinner:after,
.woocommerce a.button.primary:hover .loader-spinner:after {
  background-color: var(--color-primary-hover);
}

.woocommerce button.button.alt .loader-spinner:after,
.woocommerce button.button.alt.disabled .loader-spinner:after,
.woocommerce button.button.primary .loader-spinner:after,
.woocommerce a.button.alt .loader-spinner:after,
.woocommerce a.button.alt.disabled .loader-spinner:after,
.woocommerce a.button.primary .loader-spinner:after {
  background-color: var(--color-primary);
}

.woocommerce button.button.alt.disabled,
.woocommerce a.button.alt.disabled {
  pointer-events: none;
}

.woocommerce button.button.secondary,
.woocommerce a.button.secondary {
  background-color: var(--color-secondary);
  box-shadow: var(--color-secondary-shadow);
}

.woocommerce button.button.secondary:hover,
.woocommerce a.button.secondary:hover {
  background-color: var(--color-secondary-hover);
}

.woocommerce button.button.secondary:hover .loader-spinner:after,
.woocommerce a.button.secondary:hover .loader-spinner:after {
  background-color: var(--color-secondary-hover);
}

.woocommerce button.button.secondary .loader-spinner:after,
.woocommerce a.button.secondary .loader-spinner:after {
  background-color: var(--color-secondary);
}

.woocommerce button.button[type="submit"] {
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

.woocommerce button.button[type="submit"]:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce div.quantity {
  float: none;
  width: 100%;
  margin: 0;
}

.woocommerce div.quantity .qty {
  width: 100%;
  text-align: left;
}

.woocommerce ul.products {
  margin: 0;
}

.woocommerce ul.products.columns-4 {
  display: grid;
  grid-template-columns: 100%;
  grid-gap: 16px;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -ms-flex-align: stretch;
  align-items: stretch;
  grid-template-columns: repeat(auto-fit, 284px);
}

.woocommerce ul.products.columns-4::before,
.woocommerce ul.products.columns-4::after {
  content: '';
  display: none;
}

.woocommerce ul.products.columns-4 li.product {
  float: none;
  width: auto;
  margin: 0;
}

.woocommerce ul.products li.product {
  padding-bottom: 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.woocommerce ul.products li.product a img {
  margin: 0;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.woocommerce ul.products li.product .vikinger-wc-product-info {
  padding: 28px 28px 0;
  position: relative;
}

.woocommerce ul.products li.product .vikinger-wc-categories {
  margin-top: 6px;
}

.woocommerce ul.products li.product .onsale {
  margin: 0;
  top: 10px;
  left: -6px;
  right: auto;
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  padding: 0;
}

.woocommerce ul.products li.product .price {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 32px;
  padding: 0 14px;
  border-radius: 12px;
  background-color: var(--color-box-over-box-light-background);
  box-shadow: var(--color-overbox-shadow);
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  position: absolute;
  top: -14px;
  right: 14px;
}

.woocommerce ul.products li.product .price .woocommerce-Price-currencySymbol {
  color: var(--color-primary);
}

.woocommerce ul.products li.product .price del {
  margin-right: 4px;
}

.woocommerce ul.products li.product .star-rating {
  width: 6.9em;
  margin: 28px 0 0;
  font-size: 8px;
  letter-spacing: 3px;
}

.woocommerce ul.products li.product:hover .vikinger-woocommerce-product-actions .button,
.woocommerce ul.products li.product:hover .vikinger-woocommerce-product-actions .added_to_cart {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
}

.woocommerce ul.products li.product .vikinger-woocommerce-product-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 284px;
  padding: 0 64px;
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
}

.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .button,
.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .added_to_cart {
  width: 100%;
  margin-bottom: 12px;
  opacity: 0;
  visibility: hidden;
  -webkit-transform: translate(-100%, 0);
  transform: translate(-100%, 0);
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .button:last-child,
.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .added_to_cart:last-child {
  margin-bottom: 0;
}

.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .button:nth-child(2),
.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .added_to_cart:nth-child(2) {
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out .1s;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out .1s;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out .1s, -webkit-transform .3s ease-in-out .1s;
}

.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .button:nth-child(3),
.woocommerce ul.products li.product .vikinger-woocommerce-product-actions .added_to_cart:nth-child(3) {
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out .2s;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out .2s;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, transform .3s ease-in-out .2s, -webkit-transform .3s ease-in-out .2s;
}

.woocommerce ul.products li.product .button {
  display: inline-flex;
  margin-top: 0;
  background-color: var(--color-secondary);
  box-shadow: var(--color-secondary-shadow);
}

.woocommerce ul.products li.product .button:hover {
  background-color: var(--color-secondary-hover);
}

.woocommerce ul.products li.product .button:hover .loader-spinner:after {
  background-color: var(--color-secondary-hover);
}

.woocommerce ul.products li.product .button.ajax_add_to_cart {
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

.woocommerce ul.products li.product .button.ajax_add_to_cart:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce ul.products li.product .button.ajax_add_to_cart:hover .loader-spinner:after {
  background-color: var(--color-primary-hover);
}

.woocommerce ul.products li.product .added_to_cart {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  border-radius: 10px;
  padding: 0;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  box-shadow: 3px 5px 10px 0 rgba(62, 63, 94, 0.2);
}

.woocommerce ul.products li.product .added_to_cart.loading {
  pointer-events: none;
}

.woocommerce ul.products li.product .added_to_cart:hover {
  color: #fff;
  background-color: #2e2e47;
}

.woocommerce nav.woocommerce-pagination {
  margin-top: 32px;
}

.woocommerce nav.woocommerce-pagination ul {
  border: none;
  border-radius: 12px;
  box-shadow: var(--color-overbox-shadow);
}

.woocommerce nav.woocommerce-pagination ul li {
  background-color: var(--color-box-background);
  border: none;
  color: var(--color-text);
  font-size: 0.875rem;
  position: relative;
}

.woocommerce nav.woocommerce-pagination ul li:first-child {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.woocommerce nav.woocommerce-pagination ul li:last-child {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

.woocommerce nav.woocommerce-pagination ul li+li::before {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 20px;
  left: 0;
}

.woocommerce nav.woocommerce-pagination ul li span,
.woocommerce nav.woocommerce-pagination ul li a {
  display: block;
  padding: 0 24px;
  font-weight: 700;
  line-height: 60px;
}

.woocommerce nav.woocommerce-pagination ul li span.current {
  background-color: var(--color-box-background);
  color: var(--color-primary-dark);
}

.woocommerce nav.woocommerce-pagination ul li a {
  transition: color .2s ease-in-out;
}

.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li a:focus {
  background-color: var(--color-box-background);
  color: var(--color-primary-dark);
}

.woocommerce div.product {
  margin-top: 32px;
}

.woocommerce div.product p.stock {
  margin: 16px 0;
  color: #00c7d9;
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce div.product p.stock.out-of-stock {
  color: #fd4350;
}

.woocommerce div.product p.stock+form.cart {
  margin-top: 16px;
}

.woocommerce div.product .onsale {
  margin: 0;
  top: 10px;
  left: -6px;
  right: auto;
}

.woocommerce div.product div.images,
.woocommerce div.product div.summary {
  width: 49.3243243243%;
}

.woocommerce div.product div.images .woocommerce-product-gallery__wrapper,
.woocommerce div.product div.images .flex-viewport,
.woocommerce div.product div.images .flex-control-thumbs {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce div.product div.images .woocommerce-product-gallery__image {
  border-radius: 12px;
}

.woocommerce div.product div.images .flex-viewport .woocommerce-product-gallery__image {
  border-radius: 0;
}

.woocommerce div.product div.images .flex-control-thumbs {
  display: grid;
  grid-template-columns: repeat(auto-fit, 48px);
  grid-gap: 28px;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 26px;
  margin-top: 16px;
}

.woocommerce div.product div.images .flex-control-thumbs li {
  width: 100%;
}

.woocommerce div.product div.images .flex-control-thumbs li img {
  border: 4px solid transparent;
  border-radius: 12px;
}

.woocommerce div.product div.images .flex-control-thumbs li img.flex-active {
  border-color: var(--color-primary);
}

.woocommerce div.product div.summary {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding: 32px 48px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce div.product div.summary .product_title {
  font-size: 2rem;
}

.woocommerce div.product div.summary .woocommerce-product-rating {
  -ms-flex-order: -1;
  order: -1;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin-bottom: 14px;
}

.woocommerce div.product div.summary .woocommerce-product-rating+.price {
  margin-top: 28px;
}

.woocommerce div.product div.summary .woocommerce-product-rating .star-rating {
  margin: 0;
}

.woocommerce div.product div.summary .woocommerce-product-rating .woocommerce-review-link {
  margin-left: 12px;
  font-size: 0.875rem;
  font-weight: 500;
}

.woocommerce div.product div.summary .vikinger-wc-categories {
  margin-top: 8px;
  font-size: 0.875rem;
}

.woocommerce div.product div.summary .vikinger-wc-categories+.price {
  margin-top: 28px;
}

.woocommerce div.product div.summary .price {
  color: var(--color-text);
  font-size: 2rem;
  font-weight: 700;
}

.woocommerce div.product div.summary .price .woocommerce-Price-currencySymbol {
  color: var(--color-primary);
}

.woocommerce div.product div.summary .woocommerce-product-details__short-description {
  margin-top: 28px;
}

.woocommerce div.product div.summary .woocommerce-product-details__short-description p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce div.product div.summary .product_meta .sku_wrapper,
.woocommerce div.product div.summary .product_meta .posted_in,
.woocommerce div.product div.summary .product_meta .tagged_as {
  margin-bottom: 12px;
  display: block;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.4285714286em;
  text-transform: uppercase;
}

.woocommerce div.product div.summary .product_meta .sku_wrapper:last-child,
.woocommerce div.product div.summary .product_meta .posted_in:last-child,
.woocommerce div.product div.summary .product_meta .tagged_as:last-child {
  margin-bottom: 0;
}

.woocommerce div.product div.summary .product_meta .sku_wrapper span,
.woocommerce div.product div.summary .product_meta .sku_wrapper a,
.woocommerce div.product div.summary .product_meta .posted_in span,
.woocommerce div.product div.summary .product_meta .posted_in a,
.woocommerce div.product div.summary .product_meta .tagged_as span,
.woocommerce div.product div.summary .product_meta .tagged_as a {
  font-weight: 500;
  text-transform: none;
}

.woocommerce div.product form.cart {
  margin-top: 32px;
}

.woocommerce div.product form.cart.variations_form {
  margin-top: 0;
}

.woocommerce div.product form.cart .variations td,
.woocommerce div.product form.cart .variations th {
  vertical-align: middle;
}

.woocommerce div.product form.cart .variations td {
  width: 100%;
  display: block;
  clear: both;
  margin: 24px 0 14px;
}

.woocommerce div.product form.cart .variations td:last-child {
  margin-bottom: 0;
}

.woocommerce div.product form.cart .variations td.label {
  padding: 0;
}

.woocommerce div.product form.cart .variations td.label+td.value {
  margin-top: 0;
}

.woocommerce div.product form.cart .variations label {
  font-size: 0.75rem;
  text-transform: uppercase;
}

.woocommerce div.product form.cart .variations select {
  min-width: auto;
  display: block;
  margin: 0;
  background: none;
}

.woocommerce div.product form.cart .variations .reset_variations {
  margin-top: 12px;
  display: inline-block;
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce div.product form.cart .woocommerce-variation-description p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce div.product form.cart .woocommerce-variation-availability {
  margin-bottom: 32px;
}

.woocommerce div.product form.cart .vk-form-counter {
  width: 200px;
}

.woocommerce div.product form.cart .button {
  width: auto;
  margin-top: 40px;
  padding: 0 64px;
}

.woocommerce div.product .woocommerce-tabs {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce div.product .woocommerce-tabs ul.tabs {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  padding: 0;
  margin: 0;
}

.woocommerce div.product .woocommerce-tabs ul.tabs::before {
  content: '';
  display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
  display: block;
  width: 100%;
  height: 66px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  background-color: var(--color-box-background-alt);
  border-right: 1px solid var(--color-border);
  border-bottom: 1px solid var(--color-border);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li::before,
.woocommerce div.product .woocommerce-tabs ul.tabs li::after {
  content: '';
  display: none;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li:first-child {
  border-top-left-radius: 12px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li:last-child {
  border-right: none;
  border-top-right-radius: 12px;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
  border-bottom: none;
  background-color: var(--color-box-background);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: var(--color-text);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 16px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
  color: var(--color-text);
}

.woocommerce div.product .woocommerce-tabs .panel {
  margin-bottom: 64px;
  padding: 56px 48px;
}

.woocommerce div.product .woocommerce-tabs .panel>*:first-child {
  margin-top: 0;
}

.woocommerce div.product .woocommerce-tabs .panel>h1,
.woocommerce div.product .woocommerce-tabs .panel>h2,
.woocommerce div.product .woocommerce-tabs .panel>h3,
.woocommerce div.product .woocommerce-tabs .panel>h4,
.woocommerce div.product .woocommerce-tabs .panel>h5,
.woocommerce div.product .woocommerce-tabs .panel>h6 {
  margin: 48px 0 0;
}

.woocommerce div.product .woocommerce-tabs .panel>p,
.woocommerce div.product .woocommerce-tabs .panel>pre,
.woocommerce div.product .woocommerce-tabs .panel>hr,
.woocommerce div.product .woocommerce-tabs .panel>blockquote,
.woocommerce div.product .woocommerce-tabs .panel>ul,
.woocommerce div.product .woocommerce-tabs .panel>ol,
.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes {
  margin: 32px 0 0;
}

.woocommerce div.product .woocommerce-tabs .panel>p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce div.product .woocommerce-tabs .panel>pre {
  padding: 32px 28px;
  border: 1px solid var(--color-border);
  color: var(--color-text);
  line-height: 2em;
  overflow: auto;
}

.woocommerce div.product .woocommerce-tabs .panel>hr {
  width: 100%;
  height: 1px;
  background-color: var(--color-divider);
}

.woocommerce div.product .woocommerce-tabs .panel>blockquote {
  padding: 0 16px;
  font-weight: 500;
  line-height: 1.5454545455em;
  font-style: italic;
}

.woocommerce div.product .woocommerce-tabs .panel>blockquote p {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5454545455em;
}

.woocommerce div.product .woocommerce-tabs .panel>blockquote cite {
  margin-top: 16px;
  display: block;
  font-size: 1rem;
}

.woocommerce div.product .woocommerce-tabs .panel>ul,
.woocommerce div.product .woocommerce-tabs .panel>ol {
  padding-left: 20px;
}

.woocommerce div.product .woocommerce-tabs .panel>ul ul,
.woocommerce div.product .woocommerce-tabs .panel>ul ol,
.woocommerce div.product .woocommerce-tabs .panel>ol ul,
.woocommerce div.product .woocommerce-tabs .panel>ol ol {
  padding-left: 0;
  margin: 18px;
}

.woocommerce div.product .woocommerce-tabs .panel>ul li,
.woocommerce div.product .woocommerce-tabs .panel>ol li {
  margin-bottom: 16px;
  display: list-item;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 500;
}

.woocommerce div.product .woocommerce-tabs .panel>ul li:last-child,
.woocommerce div.product .woocommerce-tabs .panel>ol li:last-child {
  margin-bottom: 0;
}

.woocommerce div.product .woocommerce-tabs .panel>ul {
  list-style: disc;
}

.woocommerce div.product .woocommerce-tabs .panel>ul ul {
  list-style: circle;
}

.woocommerce div.product .woocommerce-tabs .panel>ul ol {
  list-style: lower-alpha;
}

.woocommerce div.product .woocommerce-tabs .panel>ol {
  list-style: decimal;
}

.woocommerce div.product .woocommerce-tabs .panel>ol ul {
  list-style: circle;
}

.woocommerce div.product .woocommerce-tabs .panel>ol ol {
  list-style: lower-alpha;
}

.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes {
  border: none;
}

.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes tr:nth-child(even) th,
.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes tr:nth-child(even) td {
  background-color: transparent;
}

.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes th,
.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes td {
  padding: 8px 0;
  border: none;
  font-size: 0.875rem;
}

.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes th {
  color: var(--color-text-alt);
  font-weight: 500;
  text-align: left;
}

.woocommerce div.product .woocommerce-tabs .panel>table.shop_attributes td {
  color: var(--color-text);
  font-weight: 700;
  font-style: normal;
}

.woocommerce section.related h2 {
  margin-bottom: 32px;
}

.woocommerce #reviews #comments .woocommerce-noreviews {
  margin-top: 8px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce #reviews #comments ol.commentlist {
  margin: 32px 0 0;
}

.woocommerce #reviews #comments ol.commentlist li .comment_container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.woocommerce #reviews #comments ol.commentlist li .comment-review-avatar {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: 12px;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text {
  width: 100%;
  margin: 0;
  padding: 0;
  border: none;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  margin: 2px 0 0;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta .woocommerce-review__author {
  color: var(--color-text);
}

.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta .woocommerce-review__dash,
.woocommerce #reviews #comments ol.commentlist li .comment-text p.meta .woocommerce-review__published-date {
  color: var(--color-text-alt);
  font-weight: 500;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text .description p {
  margin-top: 12px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce #reviews #comments ol.commentlist li .comment-text .description p:first-child {
  margin-top: 8px;
}

.woocommerce #review_form #respond .comment-reply-title {
  display: block;
  margin: 32px 0 12px;
  color: var(--color-text);
  font-size: 1.5rem;
  font-weight: 700;
}

.woocommerce #review_form #respond .comment-form-rating .stars {
  margin-bottom: 32px;
  font-size: 14px;
}

.woocommerce #review_form #respond .comment-form-rating .stars a {
  color: #ffe00d;
}

.woocommerce #review_form #respond .comment-notes {
  margin: 16px 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce #review_form #respond .comment-notes .required {
  color: var(--color-secondary);
  font-weight: 700;
}

.woocommerce #review_form #respond .comment-form-cookies-consent {
  display: -ms-flexbox;
  display: flex;
  margin-top: 12px;
}

.woocommerce #review_form #respond .comment-form-cookies-consent label {
  display: inline-block;
  margin: 0 0 0 6px;
}

.woocommerce #review_form #respond label {
  margin-bottom: 16px;
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce #review_form #respond label .required {
  color: var(--color-secondary);
}

.woocommerce #review_form #respond .comment-form-comment textarea {
  min-height: 120px;
}

.woocommerce #review_form #respond .form-submit {
  margin: 40px 0 0;
}

.woocommerce #review_form #respond .form-submit input[type="submit"] {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  border-radius: 10px;
  padding: 0 28px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  line-height: 48px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
  box-shadow: var(--color-primary-shadow);
}

.woocommerce #review_form #respond .form-submit input[type="submit"]:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce form.login {
  padding: 32px 28px;
  border-radius: 12px;
  border: none;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce form h3 {
  margin-bottom: 28px;
  font-size: 1rem;
}

.woocommerce form input[type="text"],
.woocommerce form input[type="password"],
.woocommerce form input[type="email"],
.woocommerce form input[type="tel"],
.woocommerce form input[type="search"] {
  height: 48px;
  font-size: 0.875rem;
}

.woocommerce form textarea {
  padding: 14px 18px;
  font-size: 0.875rem;
}

.woocommerce form .form-row textarea {
  height: 160px;
}

.woocommerce form fieldset {
  margin-top: 28px;
}

.woocommerce form fieldset legend {
  margin-bottom: 16px;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 700;
}

.woocommerce form .show-password-input::after {
  margin-top: 7px;
  color: var(--color-secondary);
}

.woocommerce form .select2-container .select2-selection--single {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  margin: 0;
  background-color: transparent;
  border: 1px solid var(--color-border);
  border-radius: 12px;
}

.woocommerce form .select2-container .select2-selection--single .select2-selection__placeholder,
.woocommerce form .select2-container .select2-selection--single .select2-selection__rendered {
  color: var(--color-text);
}

.woocommerce form .select2-container .select2-selection--single .select2-selection__rendered {
  padding: 0 40px 0 20px;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1em;
}

.woocommerce form .select2-container .select2-selection--single .select2-selection__arrow {
  height: 100%;
  margin-right: 14px;
}

.woocommerce form .select2-container .select2-selection--single .select2-selection__arrow b {
  border-color: var(--color-icon-highlighted) transparent;
}

.woocommerce form .form-row {
  padding: 0;
  margin: 0 0 28px 0;
}

.woocommerce form .form-row:last-child {
  margin-bottom: 0;
}

.woocommerce form .form-row label {
  margin-bottom: 12px;
  line-height: 1em;
}

.woocommerce form .form-row .required {
  color: var(--color-secondary);
}

.woocommerce form .form-row .woocommerce-password-strength,
.woocommerce form .form-row .woocommerce-password-hint {
  margin-top: 8px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
}

.woocommerce form .form-row .woocommerce-password-strength {
  color: #3e3f5e;
  font-weight: 700;
}

.woocommerce form .form-row .woocommerce-password-hint {
  color: var(--color-text);
  font-weight: 500;
}

.woocommerce form .button {
  margin-top: 28px;
}

.woocommerce .woocommerce-MyAccount-content>form,
.woocommerce .woocommerce-MyAccount-content>p {
  padding: 18px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce .woocommerce-MyAccount-content>form+*,
.woocommerce .woocommerce-MyAccount-content>p+* {
  margin-top: 16px;
}

.woocommerce .woocommerce-MyAccount-content>form {
  padding: 32px 28px;
}

.woocommerce .woocommerce-MyAccount-content p mark {
  background-color: transparent;
  color: var(--color-text);
  font-weight: 700;
}

.woocommerce .woocommerce-MyAccount-content .woocommerce-notices-wrapper:first-child .woocommerce-error,
.woocommerce .woocommerce-MyAccount-content .woocommerce-notices-wrapper:first-child .woocommerce-message,
.woocommerce .woocommerce-MyAccount-content .woocommerce-notices-wrapper:first-child .woocommerce-Message {
  margin-top: 0;
}

.woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address {
  float: none;
  width: 100%;
  margin: 0 16px 0 0;
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address .woocommerce-Address-title h3 {
  font-size: 1rem;
}

.woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address .woocommerce-Address-title .edit {
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address:nth-child(2n+2) {
  margin-right: 0;
}

.woocommerce .woocommerce-MyAccount-content p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

/**********************
****** NEW WC NOTICES *
*************************/
.wc-block-components-notice-banner {
  align-items: center !important;
}

.wc-block-components-notice-banner__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.woocommerce .wc-block-components-notice-banner.is-success,
.woocommerce .wc-block-components-notice-banner.is-error,
.woocommerce .wc-block-components-notice-banner.is-info {
  min-height: 60px;
  margin: 32px 0;
  padding: 20px 28px !important;
  border-radius: 12px;
  border: none;
  border: 2px solid #00c7d9 !important;
  background-color: var(--color-box-background) !important;
  position: relative;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: var(--color-box-shadow);
}

.woocommerce .wc-block-components-notice-banner.is-error {
  border: 2px solid #fd4350 !important;
}

.woocommerce .wc-block-components-notice-banner.is-success a,
.woocommerce .wc-block-components-notice-banner.is-success .button.wc-forward,
.woocommerce .wc-block-components-notice-banner.is-error a,
.woocommerce .wc-block-components-notice-banner.is-error .button.wc-forward,
.woocommerce .wc-block-components-notice-banner.is-info a,
.woocommerce .wc-block-components-notice-banner.is-info .button.wc-forward {
  -ms-flex-order: 2;
  order: 2;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
  padding: 0 32px !important;
  border-radius: 10px;
  background-color: var(--color-primary) !important;
  color: #fff !important;
  font-size: 0.875rem;
  opacity: 1;
  font-weight: 700;
  box-shadow: var(--color-primary-shadow);
  text-decoration: none;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

/***********************************************/
.woocommerce .woocommerce-notice,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-Message {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 60px;
  margin: 32px 0;
  padding: 20px 28px;
  border-radius: 12px;
  border: none;
  border: 2px solid var(--color-primary);
  background-color: var(--color-box-background);
  position: relative;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: var(--color-box-shadow);
}

.woocommerce .woocommerce-notice.woocommerce-message--info,
.woocommerce .woocommerce-notice.woocommerce-Message--info,
.woocommerce .woocommerce-info.woocommerce-message--info,
.woocommerce .woocommerce-info.woocommerce-Message--info,
.woocommerce .woocommerce-error.woocommerce-message--info,
.woocommerce .woocommerce-error.woocommerce-Message--info,
.woocommerce .woocommerce-message.woocommerce-message--info,
.woocommerce .woocommerce-message.woocommerce-Message--info,
.woocommerce .woocommerce-Message.woocommerce-message--info,
.woocommerce .woocommerce-Message.woocommerce-Message--info {
  border: 2px solid #615dfa;
}

.woocommerce .woocommerce-notice.woocommerce-message--info .button,
.woocommerce .woocommerce-notice.woocommerce-Message--info .button,
.woocommerce .woocommerce-info.woocommerce-message--info .button,
.woocommerce .woocommerce-info.woocommerce-Message--info .button,
.woocommerce .woocommerce-error.woocommerce-message--info .button,
.woocommerce .woocommerce-error.woocommerce-Message--info .button,
.woocommerce .woocommerce-message.woocommerce-message--info .button,
.woocommerce .woocommerce-message.woocommerce-Message--info .button,
.woocommerce .woocommerce-Message.woocommerce-message--info .button,
.woocommerce .woocommerce-Message.woocommerce-Message--info .button {
  background-color: var(--color-secondary);
  box-shadow: var(--color-secondary-shadow);
}

.woocommerce .woocommerce-notice.woocommerce-message--info .button:hover,
.woocommerce .woocommerce-notice.woocommerce-Message--info .button:hover,
.woocommerce .woocommerce-info.woocommerce-message--info .button:hover,
.woocommerce .woocommerce-info.woocommerce-Message--info .button:hover,
.woocommerce .woocommerce-error.woocommerce-message--info .button:hover,
.woocommerce .woocommerce-error.woocommerce-Message--info .button:hover,
.woocommerce .woocommerce-message.woocommerce-message--info .button:hover,
.woocommerce .woocommerce-message.woocommerce-Message--info .button:hover,
.woocommerce .woocommerce-Message.woocommerce-message--info .button:hover,
.woocommerce .woocommerce-Message.woocommerce-Message--info .button:hover {
  background-color: var(--color-secondary-hover);
}

.woocommerce .woocommerce-notice::before,
.woocommerce .woocommerce-notice::after,
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-info::after,
.woocommerce .woocommerce-error::before,
.woocommerce .woocommerce-error::after,
.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-message::after,
.woocommerce .woocommerce-Message::before,
.woocommerce .woocommerce-Message::after {
  display: none;
}

.woocommerce .woocommerce-notice a,
.woocommerce .woocommerce-notice .button,
.woocommerce .woocommerce-info a,
.woocommerce .woocommerce-info .button,
.woocommerce .woocommerce-error a,
.woocommerce .woocommerce-error .button,
.woocommerce .woocommerce-message a,
.woocommerce .woocommerce-message .button,
.woocommerce .woocommerce-Message a,
.woocommerce .woocommerce-Message .button {
  -ms-flex-order: 2;
  order: 2;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
  padding: 0 32px;
  border-radius: 10px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.875rem;
  opacity: 1;
  font-weight: 700;
  box-shadow: var(--color-primary-shadow);
  text-decoration: none;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.woocommerce .woocommerce-notice a:hover,
.woocommerce .woocommerce-notice .button:hover,
.woocommerce .woocommerce-info a:hover,
.woocommerce .woocommerce-info .button:hover,
.woocommerce .woocommerce-error a:hover,
.woocommerce .woocommerce-error .button:hover,
.woocommerce .woocommerce-message a:hover,
.woocommerce .woocommerce-message .button:hover,
.woocommerce .woocommerce-Message a:hover,
.woocommerce .woocommerce-Message .button:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce .woocommerce-error {
  display: block;
  border: 2px solid #fd4350;
}

.woocommerce .woocommerce-error li {
  margin-bottom: 12px;
}

.woocommerce .woocommerce-error li:last-child {
  margin-bottom: 0;
}

.woocommerce .woocommerce-order-downloads,
.woocommerce .woocommerce-order-details,
.woocommerce .woocommerce-customer-details {
  margin: 16px 0 0;
  padding: 32px 28px 0;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce .woocommerce-order-downloads>h2,
.woocommerce .woocommerce-order-details>h2,
.woocommerce .woocommerce-customer-details>h2 {
  margin-bottom: 16px;
  font-size: 1rem;
}

.woocommerce .woocommerce-order-downloads>table.woocommerce-table,
.woocommerce .woocommerce-order-downloads>table.shop_table,
.woocommerce .woocommerce-order-details>table.woocommerce-table,
.woocommerce .woocommerce-order-details>table.shop_table,
.woocommerce .woocommerce-customer-details>table.woocommerce-table,
.woocommerce .woocommerce-customer-details>table.shop_table {
  padding: 0;
  border-radius: 0;
  border: none;
  background-color: transparent;
  box-shadow: none;
}

.woocommerce .woocommerce-order-downloads .order-again .button,
.woocommerce .woocommerce-order-details .order-again .button,
.woocommerce .woocommerce-customer-details .order-again .button {
  margin-top: 16px;
  background-color: var(--color-secondary);
  box-shadow: var(--color-secondary-shadow);
}

.woocommerce .woocommerce-order-downloads .order-again .button:hover,
.woocommerce .woocommerce-order-details .order-again .button:hover,
.woocommerce .woocommerce-customer-details .order-again .button:hover {
  background-color: var(--color-secondary-hover);
}

.woocommerce .woocommerce-order-downloads {
  padding-top: 18px;
}

.woocommerce .woocommerce-order-downloads>h2 {
  margin-top: 14px;
}

.woocommerce .woocommerce-order-details,
.woocommerce .woocommerce-customer-details {
  padding-bottom: 32px;
}

.woocommerce .woocommerce-customer-details address {
  border: none;
  padding: 0;
}

.woocommerce address {
  margin-top: 28px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  font-style: normal;
  line-height: 1.7142857143em;
}

.woocommerce address p {
  line-height: 1.7142857143em;
}

.woocommerce table.woocommerce-table,
.woocommerce table.shop_table {
  padding: 18px 28px 0;
  border-radius: 12px;
  border: none;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  color: var(--color-text);
}

.woocommerce table.woocommerce-table th,
.woocommerce table.woocommerce-table td,
.woocommerce table.shop_table th,
.woocommerce table.shop_table td {
  height: auto;
  padding: 12px 0;
  font-weight: 700;
}

.woocommerce table.woocommerce-table th.product-quantity,
.woocommerce table.woocommerce-table td.product-quantity,
.woocommerce table.shop_table th.product-quantity,
.woocommerce table.shop_table td.product-quantity {
  padding: 12px 32px;
}

.woocommerce table.woocommerce-table th.product-name a,
.woocommerce table.woocommerce-table td.product-name a,
.woocommerce table.shop_table th.product-name a,
.woocommerce table.shop_table td.product-name a {
  color: var(--color-text);
}

.woocommerce table.woocommerce-table th.product-name a:hover,
.woocommerce table.woocommerce-table td.product-name a:hover,
.woocommerce table.shop_table th.product-name a:hover,
.woocommerce table.shop_table td.product-name a:hover {
  color: var(--color-primary);
}

.woocommerce table.woocommerce-table th,
.woocommerce table.shop_table th {
  font-size: 0.75rem;
  text-transform: uppercase;
}

.woocommerce table.woocommerce-table td,
.woocommerce table.shop_table td {
  border-top: 1px solid var(--color-divider);
  font-size: 0.875rem;
}

.woocommerce table.woocommerce-table td a,
.woocommerce table.shop_table td a {
  color: var(--color-primary);
}

.woocommerce table.woocommerce-table td .button,
.woocommerce table.shop_table td .button {
  display: inline-block;
  height: 40px;
  padding: 0 32px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 0.875rem;
  line-height: 40px;
  box-shadow: var(--color-secondary-shadow);
}

.woocommerce table.woocommerce-table td .button:hover,
.woocommerce table.shop_table td .button:hover {
  background-color: var(--color-secondary-hover);
}

.woocommerce table.woocommerce-table tfoot th,
.woocommerce table.woocommerce-table tfoot td,
.woocommerce table.shop_table tfoot th,
.woocommerce table.shop_table tfoot td {
  border-top: none;
}

.woocommerce table.woocommerce-table tfoot th,
.woocommerce table.shop_table tfoot th {
  font-size: 0.875rem;
  text-transform: none;
}

.woocommerce table.woocommerce-table--order-details thead tr:first-child th {
  border-bottom: 1px solid var(--color-divider);
}

.woocommerce table.woocommerce-table--order-details td {
  border-top: none;
}

.woocommerce table.cart {
  padding-bottom: 32px;
}

.woocommerce table.cart td.actions {
  padding: 28px 0 0;
  overflow: hidden;
}

.woocommerce table.cart td.actions .coupon {
  float: left;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
}

.woocommerce table.cart td.actions .coupon+.button {
  float: right;
  width: auto;
  height: 48px;
  margin: 0;
  padding: 0 32px;
  background-color: var(--color-primary);
  color: #fff;
  box-shadow: var(--color-primary-shadow);
}

.woocommerce table.cart td.actions .coupon+.button:hover {
  background-color: var(--color-primary-hover);
}

.woocommerce table.cart td.actions .coupon .input-text {
  min-width: 240px;
  margin: 0 12px 0 0;
  padding: 0 18px;
  border: 1px solid var(--color-border);
}

.woocommerce table.cart td.actions .coupon .button {
  margin: 0;
  height: 48px;
}

.woocommerce.shop_table {
  margin: 0;
  border: none;
  border-radius: 12px;
}

.woocommerce.shop_table td {
  border-top: 1px solid var(--color-divider);
}

.woocommerce .cart-collaterals {
  margin-top: 32px;
}

.woocommerce .cart-collaterals .cart_totals {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce .cart-collaterals .cart_totals h2 {
  margin-bottom: 16px;
  font-size: 1rem;
}

.woocommerce .cart-collaterals .cart_totals table tr th,
.woocommerce .cart-collaterals .cart_totals table tr td {
  border-top: none;
}

.woocommerce .cart-collaterals .cart_totals table tr th {
  font-size: 0.875rem;
  text-transform: none;
}

.woocommerce .cart-collaterals .cart_totals table.shop_table {
  border-radius: 0;
  background-color: transparent;
  box-shadow: none;
}

.woocommerce a.remove {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  color: var(--color-icon) !important;
  border: 2px solid var(--color-icon);
  font-size: 20px;
  opacity: .4;
  transition: color .2s ease-in-out, border-color .2s ease-in-out, opacity .2s ease-in-out;
}

.woocommerce a.remove:hover {
  color: var(--color-icon-highlighted) !important;
  border-color: var(--color-icon-highlighted);
  background-color: transparent;
  opacity: 1;
}

.woocommerce .woocommerce-mini-cart .woocommerce-mini-cart-item {
  min-height: 84px;
  padding: 12px 68px 12px 98px;
  position: relative;
}

.woocommerce .woocommerce-mini-cart .woocommerce-mini-cart-item a {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce .woocommerce-mini-cart .woocommerce-mini-cart-item img {
  float: none;
  width: 60px;
  height: 60px;
  margin: 0;
  border-radius: 12px;
  position: absolute;
  top: 12px;
  left: 28px;
}

.woocommerce .woocommerce-mini-cart .woocommerce-mini-cart-item .quantity {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce .woocommerce-mini-cart .woocommerce-mini-cart-item .remove_from_cart_button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 1em;
  height: 1em;
  border-radius: 100%;
  border: 2px solid var(--color-icon);
  color: var(--color-icon);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  position: absolute;
  top: 16px;
  right: 28px;
  opacity: .4;
  transition: color .2s ease-in-out, border-color .2s ease-in-out, opacity .2s ease-in-out;
}

.woocommerce .woocommerce-mini-cart .woocommerce-mini-cart-item .remove_from_cart_button:hover {
  color: var(--color-icon-highlighted) !important;
  border-color: var(--color-icon-highlighted);
  background-color: transparent;
  opacity: 1;
}

.woocommerce form.checkout_coupon {
  padding: 32px 28px;
  border-radius: 12px;
  border: none;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce form.checkout_coupon>p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce form.checkout_coupon>.form-row {
  margin: 12px 0 0;
}

.woocommerce form.checkout_coupon>.form-row.form-row-last {
  float: left;
}

.woocommerce form.checkout_coupon>.form-row .button {
  width: auto;
  padding: 0 32px;
  margin: 0 0 0 12px;
}

.woocommerce .woocommerce-checkout #customer_details>* {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce .woocommerce-checkout #customer_details label {
  margin-bottom: 12px;
  font-size: 0.875rem;
  font-weight: 500;
}

.woocommerce .woocommerce-checkout #order_review_heading {
  margin-top: 32px;
}

.woocommerce .woocommerce-checkout #payment {
  background-color: transparent;
  border-radius: 0;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods {
  margin: 32px 0;
  padding: 0;
  border-bottom: none;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
  margin-bottom: 12px;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method:last-child {
  margin-bottom: 0;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method label,
.woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method input {
  cursor: pointer;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method label {
  display: inline-block;
  font-size: 0.875rem;
  font-weight: 500;
}

.woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method input {
  margin-right: 6px;
  position: relative;
  top: 2px;
}

.woocommerce .woocommerce-checkout #payment div.payment_box {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.woocommerce .woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--color-box-background);
}

.woocommerce .woocommerce-checkout #payment div.payment_box p {
  font-size: 0.875rem;
  font-weight: 500;
}

.woocommerce .woocommerce-checkout #payment div.form-row {
  padding: 0;
  margin-top: 32px;
}

.woocommerce .woocommerce-checkout #payment div.form-row .woocommerce-privacy-policy-text p {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table thead th {
  border-bottom: 1px solid var(--color-divider);
}

.woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot tr:first-child th,
.woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table tfoot tr:first-child td {
  border-top: 1px solid var(--color-divider);
}

.woocommerce .woocommerce-checkout table.woocommerce-checkout-review-order-table td {
  border-top: none;
}

.woocommerce ul.order_details {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  margin: 32px 0;
  color: var(--color-text);
}

.woocommerce-mini-cart__empty-message {
  margin-top: 20px;
  padding: 0 28px;
  color: var(--color-text-alt-2);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

.woocommerce-mini-cart .woocommerce-mini-cart-item {
  min-height: 84px;
  padding: 12px 68px 12px 98px;
  position: relative;
}

.woocommerce-mini-cart .woocommerce-mini-cart-item a {
  display: block;
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce-mini-cart .woocommerce-mini-cart-item img {
  float: none;
  width: 60px;
  height: 60px;
  margin: 0;
  border-radius: 12px;
  position: absolute;
  top: 12px;
  left: 28px;
}

.woocommerce-mini-cart .woocommerce-mini-cart-item .quantity {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

.woocommerce-mini-cart .woocommerce-mini-cart-item .remove_from_cart_button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 1em;
  height: 1em;
  border-radius: 100%;
  border: 2px solid var(--color-icon);
  color: var(--color-icon);
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  position: absolute;
  top: 16px;
  right: 28px;
  opacity: .4;
  transition: color .2s ease-in-out, border-color .2s ease-in-out, opacity .2s ease-in-out;
}

.woocommerce-mini-cart .woocommerce-mini-cart-item .remove_from_cart_button:hover {
  color: var(--color-icon-highlighted) !important;
  border-color: var(--color-icon-highlighted);
  background-color: transparent;
  opacity: 1;
}

.woocommerce-cart table.cart .product-thumbnail a {
  display: block;
}

.woocommerce-cart table.cart .product-thumbnail img {
  width: 60px;
  border-radius: 12px;
}

.woocommerce-cart .wc-proceed-to-checkout {
  padding: 0;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  display: -ms-flexbox;
  display: flex;
  margin: 12px 0 0;
  padding: 0 18px;
  font-size: 0.875rem;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .woocommerce ul.products.columns-4 {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .woocommerce .section-header {
    margin: 60px 0 28px;
  }

  .section-banner+.vikinger-wc-content {
    margin-top: 32px;
  }

  .vikinger-wc-content.vikinger-wc-content-with-sidebar {
    grid-template-areas: "sidebar"
      "body";
    grid-template-columns: 100%;
  }

  .vikinger-wc-content.vikinger-wc-content-with-sidebar .vikinger-wc-sidebar {
    margin-bottom: 32px;
  }
}

@media screen and (max-width: 960px) {
  .woocommerce .header .header-actions.search-bar form input {
    height: 100%;
  }
}

@media screen and (max-width: 768px) {

  .woocommerce div.product div.images,
  .woocommerce div.product div.summary {
    width: 100%;
  }

  .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses {
    display: block;
  }

  .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address {
    margin: 0 0 16px 0;
  }

  .woocommerce .woocommerce-MyAccount-content .woocommerce-Addresses .woocommerce-Address:last-child {
    margin-bottom: 0;
  }

  .woocommerce table.shop_table tr {
    border-top: 1px solid var(--color-divider);
  }

  .woocommerce table.shop_table tr:nth-child(2n) td {
    background-color: transparent;
  }

  .woocommerce table.shop_table tr.order-total,
  .woocommerce table.shop_table tr:first-child {
    border-top: none;
  }

  .woocommerce table.shop_table td {
    border-top: none;
  }

  .woocommerce table.shop_table td.product-quantity {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    padding: 12px 0;
  }

  .woocommerce table.shop_table td.product-quantity div.quantity .qty {
    width: auto;
  }

  .woocommerce table.shop_table td.actions .coupon {
    display: block;
    width: 100%;
    padding-bottom: 0;
    float: none;
  }

  .woocommerce table.shop_table td.actions .coupon .input-text {
    float: none;
    width: 100%;
    margin-bottom: 12px;
  }

  .woocommerce table.shop_table td.actions .coupon .input-text+.button {
    float: none;
    width: 100%;
  }

  .woocommerce table.shop_table td.actions .coupon+.button {
    width: 100%;
    float: none;
    margin-top: 12px;
  }

  .woocommerce form.checkout_coupon>.form-row {
    float: none;
    width: 100%;
  }

  .woocommerce form.checkout_coupon>.form-row .button {
    width: 100%;
    margin: 0;
  }
}

/*---------------
    COMPONENT
---------------*/
/*------------------------------------------------------------------
[Table of contents]

1. .picture
2. .picture-item-list
3. .picture-item
-------------------------------------------------------------------*/
/*-------------------
    1. PICTURE
-------------------*/
.picture {
  width: 52px;
  height: 52px;
}

.picture.round {
  border-radius: 12px;
}

.picture.round.small,
.picture.round.tiny {
  border-radius: 10px;
}

.picture.circle {
  border-radius: 50%;
}

.picture.medium {
  width: 60px;
  height: 60px;
}

.picture.small {
  width: 40px;
  height: 40px;
}

.picture.tiny {
  width: 32px;
  height: 32px;
}

/*----------------------------
    2. PICTURE ITEM LIST
----------------------------*/
.picture-item-list {
  display: grid;
}

.picture-item-list.small {
  grid-template-columns: repeat(auto-fit, 52px);
  grid-gap: 6px;
}

/*-----------------------
    3. PICTURE ITEM
-----------------------*/
.picture-item {
  cursor: pointer;
  position: relative;
}

.picture-item .picture-item-overlay {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background-color: rgba(36, 210, 226, 0.9);
}

.picture-item .picture-item-overlay.round {
  border-radius: 12px;
}

.picture-item .picture-item-overlay.circle {
  border-radius: 50%;
}

.picture-item .picture-item-overlay .picture-item-overlay-text {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
}

/*------------------------------------------------------------------
[Table of contents]

1. .progress-stat-wrap
2. .progress-stat
-------------------------------------------------------------------*/
/*----------------------------
    1. PROGRESS STAT WRAP
----------------------------*/
.progress-stat-wrap {
  padding-right: 56px;
  position: relative;
}

.progress-stat-wrap .progress-stat .bar-progress-wrap {
  position: absolute;
  top: -5px;
  right: 0;
}

.progress-stat-wrap .progress-stat .bar-progress-wrap:first-child,
.progress-stat-wrap .progress-stat .bar-progress-wrap:last-child {
  margin: 0;
}

/*------------------------
    2. PROGRESS STAT
------------------------*/
.progress-stat.small {
  width: 178px;
}

.progress-stat .bar-progress-wrap {
  position: relative;
}

.progress-stat .bar-progress-wrap:first-child {
  margin-bottom: 6px;
}

.progress-stat .bar-progress-wrap.big {
  margin-bottom: 20px;
}

.progress-stat .bar-progress-wrap.medium:first-child {
  margin-bottom: 14px;
}

.progress-stat .bar-progress-wrap.small:last-child {
  margin-top: 24px;
}

.progress-stat .bar-progress-wrap:last-child {
  margin-top: 28px;
}

.progress-stat .bar-progress-wrap .bar-progress-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.progress-stat .bar-progress-wrap .bar-progress-info.progress-with-text {
  font-size: 1.25rem;
  font-weight: 700;
}

.progress-stat .bar-progress-wrap .bar-progress-info.progress-with-text .bar-progress-unit {
  margin-right: 2px;
}

.progress-stat .bar-progress-wrap .bar-progress-info.progress-with-text .light {
  font-size: 1rem;
  font-weight: 500;
  text-transform: none;
}

.progress-stat .bar-progress-wrap .bar-progress-info.negative {
  color: var(--color-text);
}

.progress-stat .bar-progress-wrap .bar-progress-info.start {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.progress-stat .bar-progress-wrap .bar-progress-info.start .bar-progress-text {
  margin-right: 4px;
}

.progress-stat .bar-progress-wrap .bar-progress-info.center {
  -ms-flex-pack: center;
  justify-content: center;
}

.progress-stat .bar-progress-wrap .bar-progress-info.regular {
  text-transform: none;
}

.progress-stat .bar-progress-wrap .bar-progress-info.medium {
  font-size: 0.875rem;
}

.progress-stat .bar-progress-wrap .bar-progress-info .light {
  margin-right: 4px;
  color: var(--color-text-alt-2);
}

.progress-stat .bar-progress-wrap .bar-progress-text.no-space .bar-progress-unit {
  margin-left: 0;
}

.progress-stat .bar-progress-wrap .bar-progress-unit {
  margin-left: 3px;
  text-transform: uppercase;
}

.progress-stat .progress-stat-info {
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  position: absolute;
  top: 8px;
  right: 0;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 680px) {
  .progress-stat .progress-stat-info {
    display: none;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .progress-arc-wrap
2. .progress-arc-block
3. .progress-arc-summary
-------------------------------------------------------------------*/
/*----------------------------
    1. PROGRESS ARC WRAP
----------------------------*/
.progress-arc-wrap {
  width: 140px;
  height: 140px;
  position: relative;
}

.progress-arc-wrap.small {
  width: 80px;
  height: 80px;
}

.progress-arc-wrap.small .progress-arc-info .progress-arc-title {
  font-size: 1.375rem;
}

.progress-arc-wrap.tiny {
  width: 60px;
  height: 60px;
}

.progress-arc-wrap.tiny .progress-arc-info .progress-arc-title {
  font-size: 0.75rem;
  text-transform: uppercase;
}

.progress-arc-wrap .progress-arc {
  width: 100%;
  height: 100%;
  position: relative;
  z-index: 2;
}

.progress-arc-wrap .progress-arc-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.progress-arc-wrap .progress-arc-info .progress-arc-title {
  font-size: 2.25rem;
  font-weight: 700;
}

.progress-arc-wrap .progress-arc-info .progress-arc-text {
  margin-top: 2px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*----------------------------
    2. PROGRESS ARC BLOCK
----------------------------*/
.progress-arc-block {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.progress-arc-block .progress-arc-block-info {
  margin-top: 20px;
  text-align: center;
}

.progress-arc-block .progress-arc-block-info .progress-arc-block-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.progress-arc-block .progress-arc-block-info .progress-arc-block-text {
  margin-top: 6px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*------------------------------
    3. PROGRESS ARC SUMMARY
------------------------------*/
.progress-arc-summary {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
}

.progress-arc-summary .progress-arc-summary-info {
  margin-top: 36px;
  text-align: center;
}

.progress-arc-summary .progress-arc-summary-info .progress-arc-summary-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.progress-arc-summary .progress-arc-summary-info .progress-arc-summary-subtitle {
  margin-top: 6px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.progress-arc-summary .progress-arc-summary-info .progress-arc-summary-text {
  margin-top: 22px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

/*------------------------------------------------------------------
[Table of contents]

1. .user-avatar
-------------------------------------------------------------------*/
/*----------------------
    1. USER AVATAR
----------------------*/
.user-avatar {
  display: block;
  width: 100px;
  height: 110px;
  position: relative;
}

.user-avatar.online::before,
.user-avatar.offline::before,
.user-avatar.away::before {
  content: '';
  width: 12px;
  height: 12px;
  border: 3px solid var(--color-box-background);
  border-radius: 50%;
  position: absolute;
  top: 3px;
  left: -2px;
  z-index: 10;
}

.user-avatar.online::before {
  background-color: #1df377;
}

.user-avatar.offline::before {
  background-color: #f9515c;
}

.user-avatar.away::before {
  background-color: #adafca;
}

.user-avatar.big {
  width: 148px;
  height: 164px;
}

.user-avatar.big .user-avatar-content {
  top: 27px;
  left: 24px;
}

.user-avatar.big .user-avatar-progress,
.user-avatar.big .user-avatar-progress-border {
  top: 14px;
  left: 12px;
}

.user-avatar.big .user-avatar-badge {
  width: 40px;
  height: 44px;
  top: 102px;
  right: 8px;
}

.user-avatar.big .user-avatar-badge .user-avatar-badge-content {
  top: 5px;
  left: 4px;
}

.user-avatar.big .user-avatar-badge .user-avatar-badge-text {
  font-size: 1rem;
}

.user-avatar.medium {
  width: 120px;
  height: 132px;
}

.user-avatar.medium .user-avatar-content {
  top: 21px;
  left: 19px;
}

.user-avatar.medium .user-avatar-progress,
.user-avatar.medium .user-avatar-progress-border {
  top: 11px;
  left: 10px;
}

.user-avatar.medium .user-avatar-badge {
  width: 32px;
  height: 36px;
  top: 82px;
  right: 7px;
}

.user-avatar.medium .user-avatar-badge .user-avatar-badge-content {
  top: 4px;
  left: 3px;
}

.user-avatar.medium .user-avatar-badge .user-avatar-badge-text {
  font-size: 0.875rem;
}

.user-avatar.user-avatar-forum {
  width: 76px;
  height: 84px;
}

.user-avatar.user-avatar-forum .user-avatar-content {
  top: 12px;
  left: 10px;
}

.user-avatar.user-avatar-forum .user-avatar-progress,
.user-avatar.user-avatar-forum .user-avatar-progress-border {
  top: 6px;
  left: 5px;
}

.user-avatar.user-avatar-forum .user-avatar-badge {
  width: 22px;
  height: 24px;
  top: 27px;
  right: 2px;
}

.user-avatar.user-avatar-forum .user-avatar-badge .user-avatar-badge-content {
  top: 3px;
  left: 3px;
}

.user-avatar.user-avatar-forum .user-avatar-badge .user-avatar-badge-text {
  font-size: 0.625rem;
}

.user-avatar.small {
  width: 50px;
  height: 56px;
}

.user-avatar.small .user-avatar-content {
  top: 12px;
  left: 10px;
}

.user-avatar.small .user-avatar-progress,
.user-avatar.small .user-avatar-progress-border {
  top: 6px;
  left: 5px;
}

.user-avatar.small .user-avatar-badge {
  width: 22px;
  height: 24px;
  top: 27px;
  right: 2px;
}

.user-avatar.small .user-avatar-badge .user-avatar-badge-content {
  top: 3px;
  left: 3px;
}

.user-avatar.small .user-avatar-badge .user-avatar-badge-text {
  font-size: 0.625rem;
}

.user-avatar.smaller .user-avatar-overlay {
  width: 30px;
  height: 32px;
}

.user-avatar.smaller .user-avatar-overlay-content .user-avatar-overlay-content-text {
  font-size: 0.6875rem;
}

.user-avatar.no-stats {
  width: 100px;
  height: 110px;
}

.user-avatar.no-stats .user-avatar-content {
  top: 10px;
  left: 9px;
}

.user-avatar.no-stats.big {
  width: 148px;
  height: 164px;
}

.user-avatar.no-stats.big .user-avatar-content {
  top: 14px;
  left: 12px;
}

.user-avatar.no-stats.medium {
  width: 120px;
  height: 130px;
}

.user-avatar.no-stats.medium .user-avatar-content {
  top: 10px;
  left: 10px;
}

.user-avatar.no-stats.small {
  width: 50px;
  height: 56px;
}

.user-avatar.no-stats.small .user-avatar-content {
  top: 6px;
  left: 5px;
}

.user-avatar.no-stats.smaller {
  width: 34px;
  height: 36px;
}

.user-avatar.no-stats.smaller .user-avatar-content {
  top: 2px;
  left: 2px;
}

.user-avatar.no-stats.micro {
  width: 22px;
  height: 24px;
}

.user-avatar.no-stats.micro .user-avatar-content {
  top: 2px;
  left: 2px;
}

.user-avatar.no-border {
  width: 82px;
  height: 90px;
}

.user-avatar.no-border .user-avatar-content {
  top: 0;
  left: 0;
}

.user-avatar.no-border.big .user-avatar-content,
.user-avatar.no-border.medium .user-avatar-content,
.user-avatar.no-border.small .user-avatar-content,
.user-avatar.no-border.tiny .user-avatar-content,
.user-avatar.no-border.micro .user-avatar-content {
  top: 0;
  left: 0;
}

.user-avatar.no-border.big {
  width: 124px;
  height: 136px;
}

.user-avatar.no-border.medium {
  width: 100px;
  height: 110px;
}

.user-avatar.no-border.user-avatar-forum {
  width: 58px;
  height: 64px;
}

.user-avatar.no-border.small {
  width: 40px;
  height: 44px;
}

.user-avatar.no-border.tiny {
  width: 24px;
  height: 26px;
}

.user-avatar.no-border.micro {
  width: 18px;
  height: 20px;
}

.user-avatar.no-outline {
  width: 84px;
  height: 92px;
}

.user-avatar.no-outline .user-avatar-progress,
.user-avatar.no-outline .user-avatar-progress-border {
  top: 0;
  left: 0;
}

.user-avatar.no-outline .user-avatar-content {
  top: 9px;
  left: 8px;
}

.user-avatar.no-outline .user-avatar-badge {
  top: 60px;
  right: -3px;
}

.user-avatar.no-outline.small {
  width: 40px;
  height: 44px;
}

.user-avatar.no-outline.small .user-avatar-content {
  top: 6px;
  left: 5px;
}

.user-avatar.no-outline.small .user-avatar-badge {
  top: 21px;
  right: -3px;
}

.user-avatar .user-avatar-border {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.user-avatar .user-avatar-border .hexagon-content {
  background-color: var(--color-box-background);
}

.user-avatar .user-avatar-content {
  position: absolute;
  top: 18px;
  left: 16px;
  z-index: 3;
}

.user-avatar .user-avatar-progress,
.user-avatar .user-avatar-progress-border {
  position: absolute;
  top: 9px;
  left: 8px;
  z-index: 2;
}

.user-avatar .user-avatar-progress {
  z-index: 3;
}

.user-avatar .user-avatar-progress-border {
  z-index: 2;
}

.user-avatar .user-avatar-badge {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 28px;
  height: 32px;
  position: absolute;
  top: 68px;
  right: 5px;
  z-index: 4;
}

.user-avatar .user-avatar-badge .user-avatar-badge-border {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
}

.user-avatar .user-avatar-badge .user-avatar-badge-border .hexagon-content {
  background-color: #fff;
}

.user-avatar .user-avatar-badge .user-avatar-badge-content {
  position: absolute;
  top: 4px;
  left: 3px;
  z-index: 5;
}

.user-avatar .user-avatar-badge .user-avatar-badge-text {
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  pointer-events: none;
  position: relative;
  z-index: 6;
}

.user-avatar .user-avatar-overlay {
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 11;
}

.user-avatar .user-avatar-overlay-content {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 12;
}

.user-avatar .user-avatar-overlay-content .user-avatar-overlay-content-text {
  color: #fff;
  font-weight: 700;
  pointer-events: none;
  position: relative;
  top: 1px;
}

/*--------------------------
    2. RANKED USER AVATAR
--------------------------*/
.ranked-user-avatar {
  display: block;
  width: 100px;
  height: 110px;
  position: relative;
}

.ranked-user-avatar.online::before,
.ranked-user-avatar.offline::before,
.ranked-user-avatar.away::before {
  content: '';
  width: 12px;
  height: 12px;
  border: 3px solid var(--color-box-background);
  border-radius: 50%;
  position: absolute;
  top: 3px;
  left: -2px;
  z-index: 10;
}

.ranked-user-avatar.online::before {
  background-color: #1df377;
}

.ranked-user-avatar.offline::before {
  background-color: #f9515c;
}

.ranked-user-avatar.away::before {
  background-color: #adafca;
}

.ranked-user-avatar.big {
  width: 148px;
  height: 164px;
}

.ranked-user-avatar.big.no-border {
  width: 124px;
  height: 136px;
}

.ranked-user-avatar.big.no-border .user-avatar-content {
  top: 14px;
  left: 12px;
}

.ranked-user-avatar.big.no-border .user-avatar-badge {
  top: 76px;
  right: -3px;
}

.ranked-user-avatar.big .user-avatar-content {
  top: 27px;
  left: 24px;
}

.ranked-user-avatar.big .user-avatar-progress,
.ranked-user-avatar.big .user-avatar-progress-border {
  top: 14px;
  left: 12px;
}

.ranked-user-avatar.big .user-avatar-badge {
  width: 40px;
  height: 44px;
  top: 102px;
  right: 8px;
}

.ranked-user-avatar.big .user-avatar-badge .user-avatar-badge-content {
  top: 5px;
  left: 4px;
}

.ranked-user-avatar.big .user-avatar-badge .user-avatar-badge-text {
  font-size: 1rem;
}

.ranked-user-avatar.medium {
  width: 120px;
  height: 132px;
}

.ranked-user-avatar.medium.no-border {
  width: 100px;
  height: 110px;
}

.ranked-user-avatar.medium.no-border .user-avatar-content {
  top: 10px;
  left: 9px;
}

.ranked-user-avatar.medium.no-border .user-avatar-badge {
  top: 60px;
  right: -3px;
}

.ranked-user-avatar.medium .user-avatar-content {
  top: 21px;
  left: 19px;
}

.ranked-user-avatar.medium .user-avatar-progress,
.ranked-user-avatar.medium .user-avatar-progress-border {
  top: 11px;
  left: 10px;
}

.ranked-user-avatar.medium .user-avatar-badge {
  width: 32px;
  height: 36px;
  top: 82px;
  right: 7px;
}

.ranked-user-avatar.medium .user-avatar-badge .user-avatar-badge-content {
  top: 4px;
  left: 3px;
}

.ranked-user-avatar.medium .user-avatar-badge .user-avatar-badge-text {
  font-size: 0.875rem;
}

.ranked-user-avatar.small {
  width: 50px;
  height: 56px;
}

.ranked-user-avatar.small.no-border {
  width: 40px;
  height: 44px;
}

.ranked-user-avatar.small.no-border .user-avatar-content {
  top: 6px;
  left: 5px;
}

.ranked-user-avatar.small.no-border .user-avatar-badge {
  top: 21px;
  right: -3px;
}

.ranked-user-avatar.small .user-avatar-content {
  top: 12px;
  left: 10px;
}

.ranked-user-avatar.small .user-avatar-progress,
.ranked-user-avatar.small .user-avatar-progress-border {
  top: 6px;
  left: 5px;
}

.ranked-user-avatar.small .user-avatar-badge {
  width: 22px;
  height: 24px;
  top: 27px;
  right: 2px;
}

.ranked-user-avatar.small .user-avatar-badge .user-avatar-badge-content {
  top: 3px;
  left: 3px;
}

.ranked-user-avatar.small .user-avatar-badge .user-avatar-badge-text {
  font-size: 0.625rem;
}

.ranked-user-avatar.smaller .user-avatar-overlay {
  width: 30px;
  height: 32px;
}

.ranked-user-avatar.smaller .user-avatar-overlay-content .user-avatar-overlay-content-text {
  font-size: 0.6875rem;
}

.ranked-user-avatar.no-stats {
  width: 100px;
  height: 110px;
}

.ranked-user-avatar.no-stats .user-avatar-content {
  top: 10px;
  left: 9px;
}

.ranked-user-avatar.no-stats.big {
  width: 148px;
  height: 164px;
}

.ranked-user-avatar.no-stats.big .user-avatar-content {
  top: 14px;
  left: 12px;
}

.ranked-user-avatar.no-stats.medium {
  width: 120px;
  height: 130px;
}

.ranked-user-avatar.no-stats.medium .user-avatar-content {
  top: 10px;
  left: 10px;
}

.ranked-user-avatar.no-stats.small {
  width: 50px;
  height: 56px;
}

.ranked-user-avatar.no-stats.small .user-avatar-content {
  top: 6px;
  left: 5px;
}

.ranked-user-avatar.no-stats.smaller {
  width: 34px;
  height: 36px;
}

.ranked-user-avatar.no-stats.smaller .user-avatar-content {
  top: 2px;
  left: 2px;
}

.ranked-user-avatar.no-stats.micro {
  width: 22px;
  height: 24px;
}

.ranked-user-avatar.no-stats.micro .user-avatar-content {
  top: 2px;
  left: 2px;
}

.ranked-user-avatar.no-border {
  width: 84px;
  height: 92px;
}

.ranked-user-avatar.no-border.big .user-avatar-progress,
.ranked-user-avatar.no-border.big .user-avatar-progress-border,
.ranked-user-avatar.no-border.medium .user-avatar-progress,
.ranked-user-avatar.no-border.medium .user-avatar-progress-border,
.ranked-user-avatar.no-border.small .user-avatar-progress,
.ranked-user-avatar.no-border.small .user-avatar-progress-border {
  top: 0;
  left: 0;
}

.ranked-user-avatar.no-border.tiny {
  width: 24px;
  height: 26px;
}

.ranked-user-avatar.no-border.micro {
  width: 18px;
  height: 20px;
}

.ranked-user-avatar.no-outline {
  width: 84px;
  height: 92px;
}

.ranked-user-avatar.no-outline .user-avatar-progress,
.ranked-user-avatar.no-outline .user-avatar-progress-border {
  top: 0;
  left: 0;
}

.ranked-user-avatar.no-outline .user-avatar-content {
  top: 9px;
  left: 8px;
}

.ranked-user-avatar.no-outline .user-avatar-badge {
  top: 60px;
  right: -3px;
}

.ranked-user-avatar.no-outline.small {
  width: 40px;
  height: 44px;
}

.ranked-user-avatar.no-outline.small .user-avatar-content {
  top: 6px;
  left: 5px;
}

.ranked-user-avatar.no-outline.small .user-avatar-badge {
  top: 21px;
  right: -3px;
}

.ranked-user-avatar .user-avatar-border {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.ranked-user-avatar .user-avatar-border .hexagon-content {
  background-color: #fff;
}

.ranked-user-avatar .user-avatar-content {
  position: absolute;
  top: 18px;
  left: 16px;
  z-index: 3;
}

.ranked-user-avatar .user-avatar-progress,
.ranked-user-avatar .user-avatar-progress-border {
  position: absolute;
  top: 9px;
  left: 8px;
  z-index: 2;
}

.ranked-user-avatar .user-avatar-progress {
  z-index: 3;
}

.ranked-user-avatar .user-avatar-progress-border {
  z-index: 2;
}

.ranked-user-avatar .user-avatar-badge {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 28px;
  height: 32px;
  position: absolute;
  top: 68px;
  right: 5px;
  z-index: 4;
}

.ranked-user-avatar .user-avatar-badge .user-avatar-badge-border {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
}

.ranked-user-avatar .user-avatar-badge .user-avatar-badge-border .hexagon-content {
  background-color: #fff;
}

.ranked-user-avatar .user-avatar-badge .user-avatar-badge-content {
  position: absolute;
  top: 4px;
  left: 3px;
  z-index: 5;
}

.ranked-user-avatar .user-avatar-badge .user-avatar-badge-text {
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  pointer-events: none;
  position: relative;
  z-index: 6;
}

.ranked-user-avatar .user-avatar-overlay {
  position: absolute;
  top: 2px;
  left: 2px;
  z-index: 11;
}

.ranked-user-avatar .user-avatar-overlay-content {
  width: 100%;
  height: 100%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 12;
}

.ranked-user-avatar .user-avatar-overlay-content .user-avatar-overlay-content-text {
  color: #fff;
  font-weight: 700;
  pointer-events: none;
  position: relative;
  top: 1px;
}

/*----------------------------
    2. USER AVATAR CIRCLE
----------------------------*/
.user-avatar-circle {
  display: block;
  width: 106px;
  height: 106px;
  border-radius: 50%;
  background-color: var(--color-box-background);
  position: relative;
}

.user-avatar-circle.user-avatar-circle-flat {
  border-radius: 0;
}

.user-avatar-circle.user-avatar-circle-flat.big .user-avatar-circle-badge {
  top: 110px;
  right: 8px;
}

.user-avatar-circle.user-avatar-circle-flat.medium .user-avatar-circle-badge {
  top: 87px;
}

.user-avatar-circle.user-avatar-circle-flat.small .user-avatar-circle-badge {
  right: 4px;
}

.user-avatar-circle.user-avatar-circle-flat.no-border.big .user-avatar-circle-badge {
  top: 98px;
  right: -4px;
}

.user-avatar-circle.user-avatar-circle-flat.no-border.medium .user-avatar-circle-badge {
  top: 77px;
}

.user-avatar-circle.user-avatar-circle-flat.no-border.small .user-avatar-circle-badge {
  right: -2px;
}

.user-avatar-circle.user-avatar-circle-flat.no-border .user-avatar-circle-badge {
  top: 63px;
}

.user-avatar-circle.user-avatar-circle-flat .user-avatar-circle-image,
.user-avatar-circle.user-avatar-circle-flat .user-avatar-circle-overlay {
  border-radius: 0;
}

.user-avatar-circle.user-avatar-circle-flat .user-avatar-circle-badge {
  border-radius: 0;
  top: 71px;
}

.user-avatar-circle.user-avatar-circle-flat .user-avatar-circle-badge .user-avatar-circle-badge-content {
  border-radius: 0;
}

.user-avatar-circle.big {
  width: 158px;
  height: 158px;
}

.user-avatar-circle.big .user-avatar-circle-image {
  width: 110px;
  height: 110px;
  top: 24px;
  left: 24px;
}

.user-avatar-circle.big .user-avatar-circle-progress {
  top: 12px;
  left: 12px;
}

.user-avatar-circle.big .user-avatar-circle-badge {
  width: 40px;
  height: 40px;
  top: 104px;
  right: 13px;
}

.user-avatar-circle.big .user-avatar-circle-badge .user-avatar-circle-badge-content {
  width: 32px;
  height: 32px;
}

.user-avatar-circle.big .user-avatar-circle-badge .user-avatar-circle-badge-content .user-avatar-circle-badge-content-text {
  font-size: 1rem;
}

.user-avatar-circle.medium {
  width: 128px;
  height: 128px;
}

.user-avatar-circle.medium .user-avatar-circle-image {
  width: 90px;
  height: 90px;
  top: 19px;
  left: 19px;
}

.user-avatar-circle.medium .user-avatar-circle-progress {
  top: 10px;
  left: 10px;
}

.user-avatar-circle.medium .user-avatar-circle-badge {
  width: 34px;
  height: 34px;
  top: 81px;
  right: 7px;
}

.user-avatar-circle.medium .user-avatar-circle-badge .user-avatar-circle-badge-content {
  width: 28px;
  height: 28px;
}

.user-avatar-circle.medium .user-avatar-circle-badge .user-avatar-circle-badge-content .user-avatar-circle-badge-content-text {
  margin-top: 0;
  font-size: 0.875rem;
}

.user-avatar-circle.user-avatar-circle-forum {
  width: 64px;
  height: 64px;
}

.user-avatar-circle.user-avatar-circle-forum .user-avatar-circle-image {
  width: 64px;
  height: 64px;
  top: 0;
  left: 0;
}

.user-avatar-circle.small {
  width: 52px;
  height: 52px;
}

.user-avatar-circle.small .user-avatar-circle-image {
  width: 30px;
  height: 30px;
  top: 11px;
  left: 11px;
}

.user-avatar-circle.small .user-avatar-circle-progress {
  top: 6px;
  left: 6px;
}

.user-avatar-circle.small .user-avatar-circle-badge {
  width: 22px;
  height: 22px;
  top: 26px;
  right: 3px;
}

.user-avatar-circle.small .user-avatar-circle-badge .user-avatar-circle-badge-content {
  width: 18px;
  height: 18px;
}

.user-avatar-circle.small .user-avatar-circle-badge .user-avatar-circle-badge-content .user-avatar-circle-badge-content-text {
  margin-top: -1px;
  font-size: 0.625rem;
}

.user-avatar-circle.smaller {
  width: 34px;
  height: 34px;
}

.user-avatar-circle.smaller .user-avatar-circle-image {
  width: 30px;
  height: 30px;
  top: 2px;
  left: 2px;
}

.user-avatar-circle.smaller .user-avatar-circle-overlay {
  width: 30px;
  height: 30px;
  top: 2px;
  left: 2px;
}

.user-avatar-circle.smaller .user-avatar-circle-overlay .user-avatar-circle-overlay-text {
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  pointer-events: none;
}

.user-avatar-circle.tiny {
  width: 30px;
  height: 30px;
}

.user-avatar-circle.tiny .user-avatar-circle-image {
  width: 26px;
  height: 26px;
  top: 2px;
  left: 2px;
}

.user-avatar-circle.micro {
  width: 24px;
  height: 24px;
}

.user-avatar-circle.micro .user-avatar-circle-image {
  width: 20px;
  height: 20px;
  top: 2px;
  left: 2px;
}

.user-avatar-circle.no-border {
  width: 90px;
  height: 90px;
  background-color: transparent;
}

.user-avatar-circle.no-border.big {
  width: 134px;
  height: 134px;
}

.user-avatar-circle.no-border.big .user-avatar-circle-image {
  top: 12px;
  left: 12px;
}

.user-avatar-circle.no-border.big .user-avatar-circle-badge {
  top: 92px;
  right: 1px;
}

.user-avatar-circle.no-border.medium {
  width: 108px;
  height: 108px;
}

.user-avatar-circle.no-border.medium .user-avatar-circle-image {
  top: 9px;
  left: 9px;
}

.user-avatar-circle.no-border.medium .user-avatar-circle-badge {
  top: 71px;
  right: -3px;
}

.user-avatar-circle.no-border.user-avatar-circle-forum {
  width: 64px;
  height: 64px;
}

.user-avatar-circle.no-border.user-avatar-circle-forum .user-avatar-circle-image {
  top: 0;
  left: 0;
}

.user-avatar-circle.no-border.small {
  width: 40px;
  height: 40px;
}

.user-avatar-circle.no-border.small .user-avatar-circle-image {
  top: 5px;
  left: 5px;
}

.user-avatar-circle.no-border.small .user-avatar-circle-badge {
  top: 20px;
  right: -3px;
}

.user-avatar-circle.no-border.smaller {
  width: 30px;
  height: 30px;
}

.user-avatar-circle.no-border.smaller .user-avatar-circle-image {
  top: 0;
  left: 0;
}

.user-avatar-circle.no-border.smaller .user-avatar-circle-overlay {
  width: 30px;
  height: 30px;
  top: 0;
  left: 0;
}

.user-avatar-circle.no-border.tiny {
  width: 26px;
  height: 26px;
}

.user-avatar-circle.no-border.tiny .user-avatar-circle-image {
  top: 0;
  left: 0;
}

.user-avatar-circle.no-border.micro {
  width: 20px;
  height: 20px;
}

.user-avatar-circle.no-border.micro .user-avatar-circle-image {
  top: 0;
  left: 0;
}

.user-avatar-circle.no-border .user-avatar-circle-image {
  top: 8px;
  left: 8px;
}

.user-avatar-circle.no-border .user-avatar-circle-progress {
  top: 0;
  left: 0;
}

.user-avatar-circle.no-border .user-avatar-circle-badge {
  top: 59px;
  right: -3px;
}

.user-avatar-circle.no-stats {
  width: 106px;
  height: 106px;
}

.user-avatar-circle.no-stats.big {
  width: 160px;
  height: 160px;
}

.user-avatar-circle.no-stats.big .user-avatar-circle-image {
  width: 136px;
  height: 136px;
  top: 12px;
  left: 12px;
}

.user-avatar-circle.no-stats.medium {
  width: 130px;
  height: 130px;
}

.user-avatar-circle.no-stats.medium .user-avatar-circle-image {
  width: 110px;
  height: 110px;
  top: 10px;
  left: 10px;
}

.user-avatar-circle.no-stats.small {
  width: 56px;
  height: 56px;
}

.user-avatar-circle.no-stats.small .user-avatar-circle-image {
  width: 44px;
  height: 44px;
  top: 6px;
  left: 6px;
}

.user-avatar-circle.no-stats .user-avatar-circle-progress,
.user-avatar-circle.no-stats .user-avatar-circle-badge {
  display: none;
}

.user-avatar-circle.no-stats .user-avatar-circle-image {
  width: 90px;
  height: 90px;
  top: 8px;
  left: 8px;
}

.user-avatar-circle.no-border.no-stats {
  width: 90px;
  height: 90px;
}

.user-avatar-circle.no-border.no-stats.big {
  width: 136px;
  height: 136px;
}

.user-avatar-circle.no-border.no-stats.medium {
  width: 110px;
  height: 110px;
}

.user-avatar-circle.no-border.no-stats.small {
  width: 44px;
  height: 44px;
}

.user-avatar-circle.no-border.no-stats .user-avatar-circle-image {
  top: 0;
  left: 0;
}

.user-avatar-circle .user-avatar-circle-image,
.user-avatar-circle .user-avatar-circle-progress,
.user-avatar-circle .user-avatar-circle-badge {
  position: absolute;
}

.user-avatar-circle .user-avatar-circle-image {
  width: 74px;
  height: 74px;
  border-radius: 50%;
  top: 16px;
  left: 16px;
}

.user-avatar-circle .user-avatar-circle-progress {
  top: 8px;
  left: 8px;
}

.user-avatar-circle .user-avatar-circle-badge {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: var(--color-box-background);
  top: 67px;
  right: 5px;
}

.user-avatar-circle .user-avatar-circle-badge .user-avatar-circle-badge-content {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: var(--color-avatar-rank-hexagon);
}

.user-avatar-circle .user-avatar-circle-badge .user-avatar-circle-badge-content .user-avatar-circle-badge-content-text {
  margin-top: 1px;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
}

.user-avatar-circle .user-avatar-circle-overlay {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 50%;
  background-color: var(--color-avatar-overlay-background);
  position: absolute;
}

/*------------------------------------------------------------------
[Table of contents]

1. .user-status-list
2. .user-status
-------------------------------------------------------------------*/
/*-------------------------
    1. USER STATUS LIST
-------------------------*/
.user-status-list .user-status {
  margin-bottom: 22px;
}

.user-status-list .user-status:last-child {
  margin-bottom: 0;
}

.user-status-list.user-status-list-3-cols {
  display: grid;
  grid-template-columns: repeat(auto-fit, 276px);
  grid-gap: 22px 0;
}

.user-status-list.user-status-list-3-cols .user-status {
  margin-bottom: 0;
}

/*---------------------
    2. USER STATUS
---------------------*/
.user-status {
  min-height: 44px;
  padding: 2px 0 0 52px;
  position: relative;
}

.user-status.no-padding-top {
  padding-top: 0;
}

.user-status.no-padding-left {
  padding-left: 0;
}

.user-status.notification {
  padding-right: 60px;
}

.user-status.user-status-with-icon {
  padding-right: 28px;
}

.user-status.request .user-status-title,
.user-status.request-small .user-status-title {
  margin-top: 2px;
  line-height: 1.1428571429em;
}

.user-status.request .user-status-text,
.user-status.request-small .user-status-text {
  margin-top: 8px;
}

.user-status.request-small {
  padding-right: 48px;
}

.user-status.request {
  padding-right: 100px;
}

.user-status.user-status-selectable {
  padding-left: 86px;
}

.user-status.user-status-selectable .user-avatar,
.user-status.user-status-selectable .user-avatar-circle {
  left: 34px;
}

.user-status.user-status-selectable .checkbox-box {
  position: absolute;
  top: 10px;
  left: 0;
  right: auto;
}

.user-status .checkbox-box {
  position: absolute;
  top: -16px;
  right: -22px;
  cursor: pointer;
}

.user-status .user-status-reaction-image {
  width: 20px;
  height: auto;
}

.user-status .post-format-tag,
.user-status .user-status-avatar,
.user-status .user-status-activity {
  position: absolute;
  top: 0;
  left: 0;
}

.user-status .post-format-tag,
.user-status .user-status-avatar.picture {
  top: 2px;
}

.user-status .post-format-tag {
  width: 40px;
  height: 40px;
  box-shadow: none;
}

.user-status .user-status-avatar.picture {
  background-color: var(--color-primary);
}

.user-status .user-status-activity {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
}

.user-status .user-status-activity.activity-reaction {
  background-color: #615dfa;
}

.user-status .user-status-activity.activity-comment {
  background-color: #4f8dff;
}

.user-status .user-status-activity.activity-share {
  background-color: #3ad2fe;
}

.user-status .user-status-activity.activity-update {
  background-color: #23d2e2;
}

.user-status .user-status-activity .user-status-activity-icon {
  fill: #fff;
}

.user-status .user-status-favorite-icon {
  margin-right: 6px;
  position: relative;
  top: -1px;
}

.user-status .user-status-title {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  word-break: break-word;
}

.user-status .user-status-title.medium {
  font-size: 1rem;
}

.user-status .user-status-title.medium+.user-status-text {
  margin-top: 2px;
}

.user-status .user-status-title.medium+.user-status-text.user-status-text_edited {
  margin-top: -8px;
}

.user-status .user-status-title a,
.user-status .user-status-title .bold {
  color: var(--color-text);
  font-weight: 700;
}

.user-status .user-status-title .highlighted {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.user-status .user-status-title .vikinger-user-tag,
.user-status .user-status-title .vikinger-pmpro-level-tag {
  margin: 0 2px 2px 6px;
  display: inline-block;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  top: -2px;
}

.user-status .user-status-title .vikinger-user-tag+.vikinger-user-tag,
.user-status .user-status-title .vikinger-user-tag+.vikinger-pmpro-level-tag,
.user-status .user-status-title .vikinger-pmpro-level-tag+.vikinger-user-tag,
.user-status .user-status-title .vikinger-pmpro-level-tag+.vikinger-pmpro-level-tag {
  margin-left: 2px;
}

.user-status .user-status-timestamp {
  margin-top: 10px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

.user-status .user-status-timestamp.small-space {
  margin-top: 4px;
}

.user-status .user-status-timestamp.floaty {
  margin-top: 0;
  position: absolute;
  top: 7px;
  right: 0;
}

.user-status .user-status-text {
  margin-top: 4px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  word-break: break-word;
}

.user-status .user-status-text.small {
  font-size: 0.75rem;
}

.user-status .user-status-text.small-space {
  margin-top: 4px;
}

.user-status .user-status-text.user-status-text_edited {
  margin-top: -8px;
}

.user-status .user-status-text a {
  color: var(--color-text);
  font-weight: 700;
}

.user-status .user-status-text a:hover {
  color: var(--color-primary-dark);
  text-decoration: none;
}

.user-status .user-status-text .user-avatar,
.user-status .user-status-text .user-avatar-circle {
  display: inline-block;
  position: relative;
  top: 6px;
  margin: 0 4px;
}

.user-status .user-status-tag {
  display: inline-block;
  height: 20px;
  padding: 0 8px;
  border-radius: 200px;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
  position: relative;
  top: -3px;
}

.user-status .user-status-tag.online {
  background-color: #1df377;
}

.user-status .user-status-tag.offline {
  background-color: #f9515c;
}

.user-status .user-status-tag.away {
  background-color: #adafca;
}

.user-status .user-status-icon {
  fill: var(--color-icon);
  opacity: .4;
  position: absolute;
  top: 10px;
  right: 0;
}

.user-status .user-status-icon.user-status-privacy-icon {
  top: 8px;
}

.user-status .action-request-list {
  position: absolute;
  top: 2px;
  right: 0;
}

.vikinger-user-tag-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.vikinger-user-tag-list>.vikinger-user-tag {
  margin-right: 4px;
}

.vikinger-user-tag-list>.vikinger-user-tag:last-child {
  margin-right: 0;
}

.vikinger-user-tag {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.vikinger-user-tag.vikinger-user-tag_small .vikinger-user-tag-text {
  padding-top: 5px;
  font-size: 0.6875rem;
}

.vikinger-user-tag .vikinger-user-tag-text {
  padding: 4px 8px;
  border-radius: 200px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*------------------------------------------------------------------
[Table of contents]

1. .cart-item-preview
2. .cart-preview-total
-------------------------------------------------------------------*/
/*----------------------------
    1. CART ITEM PREVIEW
----------------------------*/
.cart-item-preview {
  padding-left: 70px;
  position: relative;
}

.cart-item-preview .cart-item-preview-image {
  position: absolute;
  top: 2px;
  left: 0;
}

.cart-item-preview .cart-item-preview-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.cart-item-preview .cart-item-preview-title a {
  color: var(--color-text);
  font-weight: 700;
}

.cart-item-preview .cart-item-preview-text {
  margin-top: 2px;
  font-size: 0.75rem;
  font-weight: 500;
}

.cart-item-preview .cart-item-preview-price {
  margin-top: 16px;
  font-size: 0.875rem;
  font-weight: 700;
}

.cart-item-preview .cart-item-preview-price .highlighted {
  color: var(--color-primary-dark);
}

.cart-item-preview .cart-item-preview-action {
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
}

.cart-item-preview .cart-item-preview-action .icon-delete {
  opacity: .4;
  transition: fill .2s ease-in-out, opacity .2s ease-in-out;
}

.cart-item-preview .cart-item-preview-action:hover .icon-delete {
  fill: var(--color-icon-highlighted);
  opacity: 1;
}

/*----------------------------
    2. CART PREVIEW TOTAL
----------------------------*/
.cart-preview-total {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  height: 55px;
  padding: 0 28px 0 100px;
  border-top: 1px solid var(--color-divider);
  border-bottom: 1px solid var(--color-divider);
}

.cart-preview-total .cart-preview-total-title,
.cart-preview-total .cart-preview-total-text {
  font-size: 0.875rem;
  font-weight: 700;
}

.cart-preview-total .cart-preview-total-text .highlighted {
  color: var(--color-primary-dark);
}

/*------------------------------------------------------------------
[Table of contents]

1. .form-box
-------------------------------------------------------------------*/
/*------------------
    1. FORM BOX
------------------*/
.form-box {
  width: 484px;
  padding: 64px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-overbox-dark-shadow);
  position: relative;
}

.form-box.no-padding {
  padding: 0;
}

.form-box.no-padding .form-box-content {
  padding: 64px;
}

.form-box .form-box-decoration {
  position: absolute;
  top: -14px;
  left: -80px;
}

.form-box .form-box-decoration.overflowing {
  top: -68px;
}

.form-box .form-box-title {
  font-size: 1.625rem;
  text-align: center;
}

.form-box .form {
  margin-top: 76px;
}

.form-box .lined-text {
  margin-top: 40px;
}

.form-box .social-links {
  margin-top: 30px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 500px) {
  .form-box {
    padding: 40px 32px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .landing
2. .landing-info
3. .landing-form
-------------------------------------------------------------------*/
/*------------------
    1. LANDING
------------------*/
.landing {
  width: 100%;
  height: 100%;
  background: url("../img/landing/landing-background.jpg") no-repeat left center;
  background-size: cover;
  position: fixed;
  top: 0;
  left: 0;
}

.landing .landing-decoration {
  width: 64%;
  height: 140%;
  border-radius: 50%;
  background: url("../img/landing/dot-texture.png") repeat left top #fff;
  position: absolute;
  top: -20%;
  right: -32%;
  pointer-events: none;
}

/*----------------------
    2. LANDING INFO
----------------------*/
.landing-info {
  width: 584px;
  position: absolute;
  top: 16%;
  left: 13%;
}

.landing-info .logo {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.landing-info .landing-info-pretitle,
.landing-info .landing-info-title,
.landing-info .landing-info-text {
  color: #fff;
  text-align: center;
}

.landing-info .landing-info-pretitle,
.landing-info .landing-info-title {
  text-transform: uppercase;
}

.landing-info .landing-info-pretitle {
  margin-top: 36px;
  font-size: 1.5rem;
  font-weight: 500;
}

.landing-info .landing-info-title {
  font-family: var(--font-secondary);
  font-size: 6.5rem;
  font-weight: 900;
  position: relative;
  top: -10px;
}

.landing-info .landing-info-text {
  width: 384px;
  margin: 30px auto 0;
  font-size: 1.125rem;
  line-height: 1.3333333333em;
  font-weight: 500;
  font-weight: 500;
}

.landing-info .tab-switch {
  margin-top: 90px;
}

/*----------------------
    3. LANDING FORM
----------------------*/
.landing-form {
  width: 484px;
  height: 100%;
  position: absolute;
  top: 0;
  right: 13%;
}

.landing-form .form-box {
  position: absolute;
  top: 50%;
  left: 0;
}

.landing-form .form-box:first-child {
  margin-top: -313px;
}

.landing-form .form-box:last-child {
  margin-top: -370px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (min-width: 2560px) {
  .landing-info {
    top: 25%;
  }

  .landing-form {
    right: 20%;
  }
}

@media screen and (min-width: 3840px) {
  .landing-info {
    top: 35%;
    left: 18%;
  }

  .landing-form {
    right: 25%;
  }
}

@media screen and (max-width: 1500px) {
  .landing .landing-decoration {
    display: none;
  }

  .landing-info {
    left: 6%;
  }

  .landing-info .landing-info-text {
    margin-top: 10px;
  }

  .landing-info .tab-switch {
    margin-top: 40px;
  }

  .landing-form {
    right: 80px;
  }
}

@media screen and (max-width: 1365px) {
  .landing {
    padding: 80px 0 100px;
    position: static;
  }

  .landing-info {
    width: 100%;
    position: static;
  }

  .landing-info .landing-info-text {
    display: none;
  }

  .landing-form {
    width: 100%;
    margin-top: 80px;
    position: static;
  }

  .landing-form .form-box {
    margin: 0 auto;
    position: static;
  }

  .landing-form .form-box .form-box-decoration {
    display: none;
  }

  .landing-form .form-box:first-child,
  .landing-form .form-box:last-child {
    margin-top: 0;
  }
}

@media screen and (max-width: 600px) {
  .landing-form .form-box {
    width: 90%;
  }
}

@media screen and (max-width: 500px) {
  .landing-info .landing-info-title {
    font-size: 3.75rem;
  }

  .landing-info .tab-switch {
    width: 90%;
    margin: 20px auto 0;
  }

  .landing-info .tab-switch .tab-switch-button {
    width: 50%;
  }

  .landing-form {
    margin-top: 60px;
  }
}

.vk-el-navigation {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.vk-el-navigation-item {
  position: relative;
}

.vk-el-navigation-item:hover>.vk-el-navigation {
  visibility: visible;
  opacity: 1;
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  pointer-events: auto;
}

.vk-el-navigation-item .vk-el-navigation {
  width: 200px;
  padding: 16px 0;
  border-radius: 12px;
  background-color: var(--color-box-background);
  display: block;
  position: absolute;
  top: 64px;
  visibility: hidden;
  opacity: 0;
  -webkit-transform: translate(0, -10px);
  transform: translate(0, -10px);
  pointer-events: none;
  transition: opacity .2s ease-in-out, visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out, opacity .2s ease-in-out, visibility .2s ease-in-out;
  transition: transform .2s ease-in-out, opacity .2s ease-in-out, visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.vk-el-navigation-item .vk-el-navigation .vk-el-navigation-item-link {
  padding: 12px 28px;
  color: var(--color-text);
  line-height: 1.2em;
  transition: padding-left .2s ease-in-out;
}

.vk-el-navigation-item .vk-el-navigation .vk-el-navigation-item-link:hover {
  padding-left: 32px;
}

.vk-el-navigation-item .vk-el-navigation .vk-el-navigation-item-icon {
  fill: var(--color-text);
  -webkit-transform: rotate(0);
  transform: rotate(0);
}

.vk-el-navigation-item .vk-el-navigation .vk-el-navigation {
  top: -16px;
  left: 100%;
}

.vk-el-navigation-item-link {
  display: block;
  padding: 32px 20px;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 700;
}

.vk-el-navigation-item-icon {
  margin-left: 8px;
  fill: #fff;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.vk-el-navigation-mobile {
  width: 300px;
  height: 100%;
  padding: 28px 0 80px;
  background-color: #fff;
  position: fixed;
  top: 0;
  opacity: 0;
  visibility: hidden;
  overflow-y: auto;
  z-index: 100000;
  transition: opacity .2s ease-in-out, visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out, opacity .2s ease-in-out, visibility .2s ease-in-out;
  transition: transform .2s ease-in-out, opacity .2s ease-in-out, visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.vk-el-navigation-mobile.vk-el-navigation-mobile-left {
  left: 0;
  -webkit-transform: translate(-100%, 0);
  transform: translate(-100%, 0);
}

.vk-el-navigation-mobile.vk-el-navigation-mobile-right {
  right: 0;
  -webkit-transform: translate(100%, 0);
  transform: translate(100%, 0);
}

.vk-el-navigation-mobile.vk-el-navigation-mobile-active {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
}

.vk-el-navigation-mobile-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  padding: 0 32px;
  position: relative;
}

.vk-el-navigation-mobile-header+.vk-el-navigation-mobile-menu {
  margin-top: 26px;
}

.vk-el-navigation-mobile-header .vk-el-navigation-mobile-logo+.vk-el-navigation-mobile-title {
  margin-left: 12px;
}

.vk-el-navigation-mobile-header .vk-el-navigation-mobile-title {
  font-family: var(--font-secondary);
  font-size: 1.25rem;
  font-weight: 900;
  text-transform: uppercase;
}

.vk-el-navigation-mobile-header .vk-el-navigation-mobile-trigger-close {
  position: absolute;
  top: 0;
  right: 32px;
}

.vk-el-navigation-mobile-trigger-open,
.vk-el-navigation-mobile-trigger-close {
  cursor: pointer;
}

.vk-el-navigation-mobile-overlay {
  width: 100%;
  height: 100%;
  background-color: rgba(21, 21, 31, 0.96);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99999;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease-in-out, visibility .2s ease-in-out;
}

.vk-el-navigation-mobile-overlay.vk-el-navigation-mobile-overlay-active {
  opacity: 1;
  visibility: visible;
}

.vk-el-navigation-mobile-menu .vk-el-navigation-mobile-menu {
  padding-left: 16px;
}

.vk-el-navigation-mobile-menu-item-link {
  display: block;
  padding: 14px 32px;
  font-size: 0.875rem;
  font-weight: 700;
  transition: padding-left .2s ease-in-out;
}

.vk-el-navigation-mobile-menu-item-link:hover {
  padding-left: 38px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .dropdown-box
2. .dropdown-box-category
3. .dropdown-box-list
4. .dropdown-box-actions
5. .dropdown-box-button
-------------------------------------------------------------------*/
/*----------------------
    1. DROPDOWN BOX
----------------------*/
.dropdown-box {
  width: 384px;
  padding-bottom: 60px;
  border-radius: 10px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-overbox-big-shadow);
  position: relative;
}

.dropdown-box>.loader-spinner-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 52px;
}

.dropdown-box.header-settings-dropdown,
.dropdown-box.header-search-dropdown {
  opacity: 0;
  visibility: hidden;
}

.dropdown-box.padding-bottom-small {
  padding-bottom: 14px;
}

.dropdown-box.no-padding-bottom {
  padding-bottom: 0;
}

.dropdown-box .dropdown-box-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 28px 28px 20px;
}

.dropdown-box .dropdown-box-header .dropdown-box-header-title {
  font-size: 1rem;
  font-weight: 700;
}

.dropdown-box .dropdown-box-header .dropdown-box-header-title .highlighted {
  color: var(--color-primary-dark);
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
  align-items: flex-end;
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions .dropdown-box-header-action {
  margin-right: 16px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 700;
  opacity: .6;
  cursor: pointer;
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions .dropdown-box-header-action.dropdown-box-header-action-tab {
  padding-bottom: 2px;
  border-bottom: 2px solid transparent;
  transition: opacity .2s ease-in-out, color .2s ease-in-out;
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions .dropdown-box-header-action.dropdown-box-header-action-tab.active {
  color: var(--color-text);
  opacity: 1;
  border-bottom: 2px solid var(--color-primary);
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions .dropdown-box-header-action.dropdown-box-header-action-tab:hover {
  color: var(--color-text);
  opacity: 1;
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions .dropdown-box-header-action:hover {
  color: var(--color-primary-dark);
}

.dropdown-box .dropdown-box-header .dropdown-box-header-actions .dropdown-box-header-action:last-child {
  margin-right: 0;
}

.dropdown-box .dropdown-box-category {
  padding-top: 20px;
}

.dropdown-box .dropdown-box-category:first-child {
  padding-top: 28px;
}

.dropdown-box .dropdown-box-category+.no-results-text,
.dropdown-box .dropdown-box-category+.loader-spinner-wrap {
  margin: 16px 0;
}

.dropdown-box .dropdown-box-button {
  position: absolute;
  bottom: 0;
  left: 0;
}

.dropdown-box .dropdown-box-actions:last-child {
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

/*------------------------------
    2. DROPDOWN BOX CATEGORY
------------------------------*/
.dropdown-box-category {
  padding: 0 28px 4px;
}

.dropdown-box-category .dropdown-box-category-title {
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

/*----------------------------
    3. DROPDOWN BOX LIST
----------------------------*/
.dropdown-box-list {
  height: 420px;
}

.dropdown-box-list.no-scroll {
  height: auto;
}

.dropdown-box-list.scroll-small {
  height: 286px;
}

.dropdown-box-list.medium .dropdown-box-list-item {
  padding: 20px 28px;
}

.dropdown-box-list.small .dropdown-box-list-item {
  padding: 10px 28px;
}

.dropdown-box-list.no-hover .dropdown-box-list-item:hover {
  background-color: transparent;
}

.dropdown-box-list .no-results-text {
  padding-top: 20px;
}

.dropdown-box-list .dropdown-box-list-item {
  display: block;
  padding: 16px 28px;
}

.dropdown-box-list .dropdown-box-list-item.unread {
  background-color: var(--color-box-highlight-background);
}

.dropdown-box-list .dropdown-box-list-item.unread .user-status-icon {
  fill: var(--color-icon);
  opacity: 1;
}

.dropdown-box-list .dropdown-box-list-item:focus,
.dropdown-box-list .dropdown-box-list-item:hover {
  background-color: var(--color-box-hover-background);
}

/*------------------------------
    4. DROPDOWN BOX ACTIONS
------------------------------*/
.dropdown-box-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 32px 0;
  background-color: var(--color-box-background-alt);
}

.dropdown-box-actions .dropdown-box-action {
  margin-right: 16px;
}

.dropdown-box-actions .dropdown-box-action .button {
  width: 156px;
}

.dropdown-box-actions .dropdown-box-action:last-child {
  margin-right: 0;
}

/*------------------------------
    5. DROPDOWN BOX BUTTON
------------------------------*/
.dropdown-box-button {
  width: 100%;
  height: 60px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  line-height: 60px;
  transition: background-color .2s ease-in-out;
}

.dropdown-box-button:hover {
  color: #fff;
}

.dropdown-box-button.primary {
  background-color: var(--color-primary);
}

.dropdown-box-button.primary:hover {
  background-color: var(--color-primary-hover);
}

.dropdown-box-button.secondary {
  background-color: var(--color-secondary);
}

.dropdown-box-button.secondary:hover {
  background-color: var(--color-secondary-hover);
}

/*------------------------------------------------------------------
[Table of contents]

1. .dropdown-navigation
-------------------------------------------------------------------*/
/*----------------------------
    1. DROPDOWN NAVIGATION
----------------------------*/
.dropdown-navigation {
  min-width: 360px;
  padding: 20px 28px;
  border-radius: 10px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-overbox-big-shadow);
}

.dropdown-navigation.header-settings-dropdown {
  opacity: 0;
  visibility: hidden;
}

.dropdown-navigation .dropdown-navigation-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.dropdown-navigation .dropdown-navigation-header .dropdown-navigation-button {
  width: auto;
  padding: 0 32px;
  margin-top: 2px;
}

.dropdown-navigation .dropdown-navigation-header .vikinger-user-tag+.vikinger-user-tag,
.dropdown-navigation .dropdown-navigation-header .vikinger-user-tag+.vikinger-pmpro-level-tag,
.dropdown-navigation .dropdown-navigation-header .vikinger-pmpro-level-tag+.vikinger-user-tag,
.dropdown-navigation .dropdown-navigation-header .vikinger-pmpro-level-tag+.vikinger-pmpro-level-tag {
  margin-left: 0;
}

.dropdown-navigation .dropdown-navigation-sections {
  display: -ms-flexbox;
  display: flex;
  margin-top: 30px;
}

.dropdown-navigation .dropdown-navigation-sections .dropdown-navigation-section {
  width: 200px;
}

.dropdown-navigation .dropdown-navigation-sections .dropdown-navigation-section .dropdown-navigation-category:first-child {
  margin-top: 0;
}

.dropdown-navigation .dropdown-navigation-category {
  margin: 20px 0 10px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.dropdown-navigation .dropdown-navigation-link {
  display: block;
  padding: 8px 0;
  font-size: 0.875rem;
  font-weight: 700;
  transition: padding .2s ease-in-out, color .2s ease-in-out;
}

.dropdown-navigation .dropdown-navigation-link .highlighted {
  float: right;
  color: var(--color-primary-dark);
}

.dropdown-navigation .dropdown-navigation-link:hover {
  padding-left: 4px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .navigation-widget
-------------------------------------------------------------------*/
/*----------------------------
    1. NAVIGATION WIDGET
----------------------------*/
.navigation-widget {
  width: 300px;
  padding-bottom: 80px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.navigation-widget .navigation-widget-close-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  fill: var(--color-icon-highlighted);
  width: 70px;
  height: 50px;
  position: absolute;
  top: 0;
  right: 0;
  cursor: pointer;
}

.navigation-widget .navigation-widget-close-button+.navigation-widget-section {
  margin-top: 40px;
}

.navigation-widget .navigation-widget-actions {
  margin: 80px 28px 60px;
}

.navigation-widget .navigation-widget-actions .button+.button {
  margin-top: 12px;
}

.navigation-widget .navigation-widget-cover {
  width: 100%;
  height: 76px;
}

.navigation-widget .navigation-widget-info-wrap {
  padding: 32px 50px 0 30px;
  margin-bottom: 40px;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info {
  min-height: 44px;
  padding: 8px 0 0 50px;
  position: relative;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .user-avatar,
.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .user-avatar-circle {
  position: absolute;
  top: 0;
  left: 0;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title a {
  color: var(--color-text);
  font-weight: 700;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title .vikinger-user-tag,
.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title .vikinger-pmpro-level-tag {
  margin: 0 2px 4px 6px;
  display: inline-block;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  top: -2px;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title .vikinger-user-tag+.vikinger-user-tag,
.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title .vikinger-user-tag+.vikinger-pmpro-level-tag,
.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title .vikinger-pmpro-level-tag+.vikinger-user-tag,
.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-title .vikinger-pmpro-level-tag+.vikinger-pmpro-level-tag {
  margin-left: 2px;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info .navigation-widget-info-text {
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

.navigation-widget .navigation-widget-info-wrap .point-item-list {
  margin-top: 16px;
}

.navigation-widget .navigation-widget-info-wrap .navigation-widget-info-button {
  margin-top: 20px;
  width: 140px;
}

.navigation-widget .action-item-wrap {
  padding-left: 28px;
  margin-bottom: 32px;
}

.navigation-widget .action-item-wrap .action-item {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.navigation-widget .action-item-wrap .action-item.hoverable .action-item-icon {
  fill: var(--color-icon);
}

.navigation-widget .action-item-wrap .action-item.hoverable:hover .action-item-icon {
  fill: var(--color-icon-highlighted);
}

.navigation-widget .navigation-widget-section+.navigation-widget-section {
  margin-top: 40px;
}

.navigation-widget .navigation-widget-section.space-top {
  margin-top: 40px;
}

.navigation-widget .navigation-widget-section:last-child {
  margin-bottom: 60px;
}

.navigation-widget .navigation-widget-section-title {
  padding-left: 30px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.navigation-widget .navigation-widget-section-title+.navigation-widget-section-menu,
.navigation-widget .navigation-widget-section-title+.menu {
  margin-top: 26px;
}

.navigation-widget .navigation-widget-section-title+.navigation-widget-section-link {
  margin-top: 14px;
}

.navigation-widget .navigation-widget-section-menu .navigation-widget-section-menu-item .navigation-widget-section-menu {
  padding-left: 12px;
}

.navigation-widget .navigation-widget-section-menu .navigation-widget-section-menu-item .navigation-widget-section-menu-item-link {
  display: block;
  padding: 12px 30px;
  font-size: 0.875rem;
  font-weight: 700;
  transition: padding .2s ease-in-out, color .2s ease-in-out;
}

.navigation-widget .navigation-widget-section-menu .navigation-widget-section-menu-item .navigation-widget-section-menu-item-link .highlighted {
  float: right;
  color: var(--color-primary-dark);
}

.navigation-widget .navigation-widget-section-menu .navigation-widget-section-menu-item .navigation-widget-section-menu-item-link:hover {
  padding-left: 34px;
}

.navigation-widget .badge-list {
  margin-top: 36px;
}

.navigation-widget .no-results-text {
  margin-top: 36px;
  line-height: 35px;
}

.navigation-widget .user-stats {
  margin-top: 44px;
}

.navigation-widget .menu {
  margin: 60px 0;
}

.navigation-widget .menu:first-child {
  margin-top: 32px;
}

.navigation-widget.navigation-widget-closed {
  width: 80px;
  padding-top: 20px;
}

.navigation-widget.navigation-widget-closed .user-avatar,
.navigation-widget.navigation-widget-closed .user-avatar-circle {
  margin: 0 auto;
}

.navigation-widget.navigation-widget-closed .menu {
  margin-top: 26px;
}

.navigation-widget.navigation-widget-closed .menu:first-child {
  margin-top: 12px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .chat-widget-wrap
2. .chat-widget
3. .chat-widget-header
4. .chat-widget-messages
5. .chat-widget-conversation
6. .chat-widget-form
7. .chat-widget-button
-------------------------------------------------------------------*/
/*--------------------------
    1. CHAT WIDGET WRAP
--------------------------*/
.chat-widget-wrap {
  display: -ms-flexbox;
  display: flex;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
}

.chat-widget-wrap .chat-widget {
  box-shadow: none;
}

.chat-widget-wrap .chat-widget .chat-widget-messages {
  height: 522px;
}

.chat-widget-wrap .chat-widget .chat-widget-conversation {
  height: 500px;
}

.chat-widget-wrap .chat-widget .chat-widget-conversation.with-recipient {
  height: 467px;
}

.chat-widget-wrap .chat-widget:first-child {
  width: 43.4389140271%;
  border-right: 1px solid var(--color-divider);
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.chat-widget-wrap .chat-widget:first-child .chat-widget-form {
  border-bottom-left-radius: 12px;
}

.chat-widget-wrap .chat-widget:last-child {
  width: 56.5610859729%;
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

.chat-widget-wrap .chat-widget:last-child .chat-widget-form {
  border-bottom-right-radius: 12px;
}

/*----------------------
    2. CHAT WIDGET
----------------------*/
.chat-widget {
  width: 300px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  transition: -webkit-transform .4s ease-in-out;
  transition: transform .4s ease-in-out;
  transition: transform .4s ease-in-out, -webkit-transform .4s ease-in-out;
}

.chat-widget .chat-widget-filters {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  border-bottom: 1px solid var(--color-divider);
}

.chat-widget .chat-widget-filters .chat-widget-filter {
  width: 100%;
  height: 66px;
  border-right: 1px solid var(--color-divider);
  background-color: var(--color-box-background-alt);
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 66px;
  text-align: center;
  cursor: pointer;
}

.chat-widget .chat-widget-filters .chat-widget-filter:first-child {
  border-top-left-radius: 12px;
}

.chat-widget .chat-widget-filters .chat-widget-filter:last-child {
  border-right: none;
}

.chat-widget .chat-widget-filters .chat-widget-filter.active {
  background-color: var(--color-box-background);
  color: var(--color-text);
}

.chat-widget.static .chat-widget-messages .chat-widget-message {
  padding: 20px 28px 20px 24px;
  border-left: 4px solid transparent;
}

.chat-widget.static .chat-widget-messages .chat-widget-message.active,
.chat-widget.static .chat-widget-messages .chat-widget-message:hover {
  background-color: var(--color-box-hover-background);
  border-left-color: var(--color-primary);
}

.chat-widget.chat-widget-overlay {
  padding-bottom: 92px;
}

.chat-widget.hidden .chat-widget-button-icon .burger-icon .burger-icon-bar:nth-child(1) {
  width: 100%;
}

.chat-widget.hidden .chat-widget-button-icon .burger-icon .burger-icon-bar:nth-child(2) {
  width: 14px;
}

.chat-widget.hidden .chat-widget-button-icon .burger-icon .burger-icon-bar:nth-child(3) {
  width: 10px;
}

.chat-widget.closed .chat-widget-messages .chat-widget-message {
  padding: 11px 20px;
}

.chat-widget.closed .chat-widget-messages .chat-widget-message:first-child {
  padding-top: 20px;
}

.chat-widget.closed .chat-widget-messages .chat-widget-message:hover {
  background-color: var(--color-box-background);
}

.chat-widget.closed .chat-widget-messages .chat-widget-message .user-status .user-status-title,
.chat-widget.closed .chat-widget-messages .chat-widget-message .user-status .user-status-text,
.chat-widget.closed .chat-widget-messages .chat-widget-message .user-status .user-status-timestamp {
  opacity: 0;
  visibility: hidden;
}

.chat-widget.closed .chat-widget-form {
  opacity: 0;
  visibility: hidden;
}

.chat-widget.closed .chat-widget-button .chat-widget-button-icon .burger-icon .burger-icon-bar:nth-child(1) {
  width: 100%;
}

.chat-widget.closed .chat-widget-button .chat-widget-button-icon .burger-icon .burger-icon-bar:nth-child(2) {
  width: 14px;
}

.chat-widget.closed .chat-widget-button .chat-widget-button-icon .burger-icon .burger-icon-bar:nth-child(3) {
  width: 10px;
}

.chat-widget.closed .chat-widget-button .chat-widget-button-text {
  display: none;
}

.chat-widget .chat-widget-messages .chat-widget-message .user-status .user-status-title,
.chat-widget .chat-widget-messages .chat-widget-message .user-status .user-status-text,
.chat-widget .chat-widget-messages .chat-widget-message .user-status .user-status-timestamp {
  transition: opacity .4s ease-in-out, visibility .4s ease-in-out;
}

/*----------------------------
    3. CHAT WIDGET HEADER
----------------------------*/
.chat-widget-header {
  padding: 20px 28px;
  border-bottom: 1px solid var(--color-divider);
  position: relative;
}

.chat-widget-header.no-padding {
  padding: 0;
}

.chat-widget-header .chat-widget-settings {
  position: absolute;
  top: 12px;
  right: 14px;
  z-index: 2;
}

.chat-widget-header .chat-widget-header-title {
  height: 60px;
  padding: 0 28px;
  border-bottom: 1px solid var(--color-divider);
  font-size: 1rem;
  font-weight: 700;
  line-height: 60px;
}

.chat-widget-header .chat-widget-header-form {
  background-color: var(--color-box-background-alt);
}

.chat-widget-header .chat-widget-header-form .chat-widget-header-recipient {
  height: 58px;
  padding: 0 28px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.chat-widget-header .chat-widget-header-form .form-textarea.small textarea {
  padding: 18px 28px;
}

.chat-widget-header .chat-widget-header-form .form-textarea textarea {
  border: none;
  background-color: transparent;
}

.chat-widget-header .chat-widget-close-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 70px;
  height: 50px;
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 2;
}

.chat-widget-header .chat-widget-close-button .chat-widget-close-button-icon {
  fill: #3e3f5e;
}

/*------------------------------
    3. CHAT WIDGET MESSAGES
------------------------------*/
.chat-widget-messages {
  height: 700px;
  overflow-y: auto;
}

.chat-widget-messages>.loader-spinner-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 60px;
}

.chat-widget-messages .no-results-text {
  margin-top: 60px;
}

.chat-widget-messages .chat-widget-message {
  display: block;
  padding: 14px 28px;
  cursor: pointer;
  transition: padding .4s ease-in-out;
}

.chat-widget-messages .chat-widget-message.active,
.chat-widget-messages .chat-widget-message:hover {
  background-color: var(--color-box-hover-background);
}

.chat-widget-messages .chat-widget-message.unread {
  background-color: var(--color-box-highlight-background);
}

/*----------------------------------
    4. CHAT WIDGET CONVERSATION
----------------------------------*/
.chat-widget-conversation {
  height: 615px;
  background-color: var(--color-box-background-alt);
  overflow-y: auto;
}

.chat-widget-conversation .chat-widget-speaker {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-flow: column;
  flex-flow: column;
  -ms-flex-align: start;
  align-items: flex-start;
  position: relative;
}

.chat-widget-conversation .chat-widget-speaker+.chat-widget-speaker {
  margin-top: 16px;
}

.chat-widget-conversation .chat-widget-speaker.left {
  padding: 0 26px 0 36px;
}

.chat-widget-conversation .chat-widget-speaker.left .chat-widget-speaker-avatar {
  left: 0;
}

.chat-widget-conversation .chat-widget-speaker.left .chat-widget-speaker-message {
  border-top-left-radius: 0;
}

.chat-widget-conversation .chat-widget-speaker.right {
  padding-left: 64px;
  -ms-flex-align: end;
  align-items: flex-end;
}

.chat-widget-conversation .chat-widget-speaker.right .chat-widget-speaker-message {
  border-top-right-radius: 0;
  background-color: var(--color-secondary);
  color: #fff;
}

.chat-widget-conversation .chat-widget-speaker .chat-widget-speaker-avatar {
  position: absolute;
  top: 0;
}

.chat-widget-conversation .chat-widget-speaker .chat-widget-speaker-message {
  display: inline-block;
  padding: 12px;
  border-radius: 10px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1.1428571429em;
  word-break: break-word;
}

.chat-widget-conversation .chat-widget-speaker .chat-widget-speaker-message+.chat-widget-speaker-message {
  margin-top: 8px;
}

.chat-widget-conversation .chat-widget-speaker .chat-widget-speaker-timestamp {
  margin-top: 12px;
  color: #adafca;
  font-size: 0.75rem;
  font-weight: 500;
}

/*--------------------------
    5. CHAT WIDGET FORM
--------------------------*/
.chat-widget-form {
  padding: 22px 28px;
  background-color: var(--color-box-background-alt);
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  box-shadow: 0 0 40px 0 rgba(94, 92, 154, 0.1);
  transition: opacity .4s ease-in-out, visibility .4s ease-in-out, bottom .4s ease-in-out;
}

.chat-widget-form.disabled {
  opacity: .5;
}

/*----------------------------
    6. CHAT WIDGET BUTTON
----------------------------*/
.chat-widget-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 80px;
  padding-left: 28px;
  background-color: var(--color-primary);
  cursor: pointer;
}

.chat-widget-button .chat-widget-button-icon {
  margin-right: 30px;
}

.chat-widget-button .chat-widget-button-text {
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 960px) {
  .chat-widget-wrap {
    display: block;
    box-shadow: none;
  }

  .chat-widget-wrap .chat-widget {
    border-radius: 12px;
  }

  .chat-widget-wrap .chat-widget:first-child,
  .chat-widget-wrap .chat-widget:last-child {
    width: 100%;
    box-shadow: var(--color-box-shadow);
  }

  .chat-widget-wrap .chat-widget:first-child {
    border-right: none;
    margin-bottom: 26px;
  }

  .chat-widget-wrap .chat-widget:first-child .chat-widget-form {
    border-bottom-right-radius: 12px;
  }

  .chat-widget-wrap .chat-widget:last-child .chat-widget-form {
    border-bottom-left-radius: 12px;
  }

  .chat-widget-wrap .chat-widget .chat-widget-conversation+.chat-widget-form .button {
    width: 100%;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .profile-header
-------------------------------------------------------------------*/
/*--------------------------
    1. PROFILE HEADER
--------------------------*/
.profile-header {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.profile-header+.alert-box {
  margin-top: 32px;
}

.profile-header+.section-navigation {
  margin-bottom: 16px;
}

.profile-header.v2 .profile-header-info {
  height: 112px;
}

.profile-header.v2 .profile-header-info .user-short-description {
  min-height: 164px;
  padding: 84px 0 0 164px;
  position: absolute;
  left: 32px;
  bottom: 0;
}

.profile-header.v2 .profile-header-info .user-short-description .user-short-description-avatar {
  top: 0;
  left: 0;
  margin-left: 0;
}

.profile-header.v2 .profile-header-info .user-short-description .user-short-description-avatar.user-short-description-avatar-mobile {
  top: -54px;
  margin-left: -60px;
}

.profile-header.v2 .profile-header-info .user-short-description .user-short-description-title,
.profile-header.v2 .profile-header-info .user-short-description .user-short-description-text {
  text-align: left;
}

.profile-header.v2 .profile-header-info .user-stats {
  left: auto;
  top: 38px;
  right: 164px;
}

.profile-header.v2 .profile-header-info>.tag-sticker {
  position: absolute;
  top: -12px;
  right: 28px;
  display: none;
}

.profile-header.v2 .profile-header-info .profile-header-info-actions {
  top: 32px;
}

.profile-header.v2 .profile-header-info .profile-header-info-actions .profile-header-info-action.button {
  width: 58px;
}

.profile-header.v2 .vikinger-user-tag-list {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.profile-header .profile-header-cover {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  height: 300px;
}

.profile-header .profile-header-info {
  padding-bottom: 32px;
  position: relative;
}

.profile-header .profile-header-info .user-short-description .user-short-description-avatar-mobile {
  display: none;
  top: -54px;
  margin-left: -60px;
}

.profile-header .profile-header-info .social-links {
  position: absolute;
  top: 54px;
  right: 32px;
}

.profile-header .profile-header-info .social-links.mobile {
  display: none;
}

.profile-header .profile-header-info .profile-header-social-links-wrap {
  width: 364px;
  height: 44px;
  margin: 0 auto;
  position: absolute;
  top: 54px;
  right: 32px;
}

.profile-header .profile-header-info .profile-header-social-links-wrap.mobile {
  width: 160px;
  height: 36px;
  display: none;
}

.profile-header .profile-header-info .profile-header-social-links-wrap.mobile .slider-controls {
  width: 214px;
  top: 10px;
}

.profile-header .profile-header-info .profile-header-social-links-wrap .profile-header-social-links {
  padding-top: 4px;
  position: relative;
  z-index: 2;
}

.profile-header .profile-header-info .profile-header-social-links-wrap .slider-controls {
  width: 416px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 14px;
  left: -28px;
}

.profile-header .profile-header-info .user-stats {
  position: absolute;
  top: 54px;
  left: 40px;
}

.profile-header .profile-header-info .user-stats .user-stat {
  padding: 0 30px;
}

.bp-verified-member-request-button_wrap {
  display: flex;
  justify-content: center;
  margin-top: 12px;
}

.bp-verified-member-request-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 40px;
  border-radius: 10px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 40px;
  text-align: center;
  cursor: pointer;
  box-shadow: var(--color-secondary-shadow);
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.profile-header .profile-header-info .profile-header-info-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  position: absolute;
  top: -40px;
  right: 32px;
}

.profile-header .profile-header-info .profile-header-info-actions>.loader-spinner-wrap {
  margin-top: 12px;
}

.profile-header .profile-header-info .profile-header-info-actions .profile-header-info-action {
  margin-right: 16px;
}

.profile-header .profile-header-info .profile-header-info-actions .profile-header-info-action.button {
  width: 180px;
}

.profile-header .profile-header-info .profile-header-info-actions .profile-header-info-action:last-child {
  margin-right: 0;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .profile-header .profile-header-cover {
    height: 200px;
  }

  .profile-header.v2 .profile-header-info {
    height: auto;
    padding-bottom: 32px;
  }

  .profile-header.v2 .profile-header-info .user-short-description {
    min-height: auto;
    padding: 52px 0 0;
    position: static;
  }

  .profile-header.v2 .profile-header-info .user-short-description .user-short-description-avatar {
    top: -116px;
    left: 50%;
    margin-left: -74px;
  }

  .profile-header.v2 .profile-header-info .user-short-description .user-short-description-title,
  .profile-header.v2 .profile-header-info .user-short-description .user-short-description-text {
    text-align: center;
  }

  .profile-header.v2 .vikinger-user-tag-list {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .profile-header .profile-header-info {
    padding-bottom: 0;
  }

  .profile-header .profile-header-info .user-stats,
  .profile-header .profile-header-info .profile-header-info-actions {
    position: static;
  }

  .profile-header .profile-header-info .social-links,
  .profile-header .profile-header-info .profile-header-social-links-wrap {
    margin-top: 32px;
    position: relative;
    top: auto;
    right: auto;
  }

  .profile-header .profile-header-info .user-stats,
  .profile-header .profile-header-info .profile-header-info-actions {
    margin-top: 40px;
  }

  .profile-header .profile-header-info .profile-header-info-actions .profile-header-info-action.button {
    margin-bottom: 40px;
  }

  .profile-header .profile-header-info .profile-header-info-actions .profile-header-info-action.button:last-child {
    margin-bottom: 0;
  }

  .bp-verified-member-request-button_wrap {
    margin-top: 32px;
  }
}

@media screen and (max-width: 480px) {
  .profile-header .profile-header-cover {
    height: 76px;
  }

  .profile-header.v2 .profile-header-info .user-short-description {
    padding-top: 84px;
  }

  .profile-header.v2 .profile-header-info .user-stats .user-stat:first-child {
    display: none;
  }

  .profile-header.v2 .profile-header-info .user-stats .user-stat:nth-last-child(2)::after {
    display: block;
  }

  .profile-header.v2 .profile-header-info .user-stats .user-stat:last-child {
    display: block;
  }

  .profile-header.v2 .profile-header-info .tag-sticker {
    display: -ms-flexbox;
    display: flex;
  }

  .profile-header .profile-header-info .user-short-description {
    padding-top: 84px;
  }

  .profile-header .profile-header-info .user-short-description .user-short-description-avatar {
    display: none;
  }

  .profile-header .profile-header-info .user-short-description .user-short-description-avatar-mobile {
    display: block;
  }

  .profile-header .profile-header-info .user-short-description .user-short-description-title {
    font-size: 1.125rem;
  }

  .profile-header .profile-header-info .user-short-description .user-short-description-text {
    font-size: 0.6875rem;
  }

  .profile-header .profile-header-info .social-links {
    display: none;
  }

  .profile-header .profile-header-info .social-links.mobile {
    display: -ms-flexbox;
    display: flex;
  }

  .profile-header .profile-header-info .profile-header-social-links-wrap {
    position: relative;
    top: auto;
    right: auto;
    display: none;
  }

  .profile-header .profile-header-info .profile-header-social-links-wrap.mobile {
    display: block;
  }

  .profile-header .profile-header-info .user-stats .user-stat:nth-last-child(2)::after {
    display: none;
  }

  .profile-header .profile-header-info .user-stats .user-stat:last-child {
    display: none;
  }

  .profile-header .profile-header-info .user-stats .user-stat .user-stat-title {
    font-size: 0.875rem;
  }

  .profile-header .profile-header-info .user-stats .user-stat .user-stat-text {
    font-size: 0.6875rem;
  }

  .profile-header .profile-header-info .profile-header-info-actions .profile-header-info-action.button:not(.with-only-icon) {
    width: auto;
    padding: 0 28px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .post-preview
2. .post-peek-list
3. .post-peek
4. .post-preview-line-list
5. .post-preview-line
-------------------------------------------------------------------*/
/*----------------------
    1. POST PREVIEW
----------------------*/
.post-preview {
  min-height: 516px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.post-preview.post-preview-type-iframe .post-preview-image {
  cursor: pointer;
  position: relative;
}

.post-preview.post-preview-type-iframe .post-preview-image::before {
  content: '';
  width: 100%;
  height: 100%;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background-color: rgba(21, 21, 31, 0.8);
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
}

.post-preview.post-preview-type-iframe .post-preview-image .post-preview-image-action {
  transition: -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out;
  transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.post-preview.post-preview-type-iframe .post-preview-image:hover::before {
  opacity: 1;
  visibility: visible;
}

.post-preview.post-preview-type-iframe .post-preview-image:hover .post-preview-image-action {
  -webkit-transform: scale(1.05);
  transform: scale(1.05);
}

.post-preview.post-preview-type-gallery {
  position: relative;
}

.post-preview .gallery-popup-button {
  position: absolute;
  top: -8px;
  right: 16px;
  z-index: 3;
}

.post-preview .post-preview-gallery {
  height: 210px;
  position: relative;
}

.post-preview .post-preview-gallery .post-preview-gallery-slider-item {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  height: 210px;
}

.post-preview .post-preview-gallery-controls {
  width: 72px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  position: absolute;
  right: 44px;
  bottom: 28px;
  z-index: 3;
}

.post-preview.post-preview-no-cover {
  padding-top: 16px;
}

.post-preview.post-preview-no-cover .post-preview-info {
  margin: 0 auto;
}

.post-preview.post-preview-no-cover .post-preview-info.fixed-height {
  height: 466px;
}

.post-preview.post-preview-no-cover .post-format-tag {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-bottom: 28px;
  box-shadow: 3px 5px 20px 0px rgba(94, 92, 154, 0.1);
}

.post-preview.sticky {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: end;
  align-items: flex-end;
  min-height: auto;
  height: 390px;
  position: relative;
  margin: 32px 0;
}

.post-preview.sticky:first-child {
  margin-top: 0;
}

.post-preview.sticky .tag-sticker {
  position: absolute;
  top: -12px;
  right: 12px;
  z-index: 3;
}

.post-preview.sticky.post-preview-no-cover {
  padding: 28px 28px 0;
}

.post-preview.sticky.post-preview-no-cover .post-preview-info {
  width: 100%;
  margin: 0 auto;
}

.post-preview.sticky.post-preview-no-cover .content-actions {
  padding-right: 0;
}

.post-preview.sticky .post-preview-image-mobile-link,
.post-preview.sticky .post-preview-image-mobile {
  display: none;
}

.post-preview.sticky .post-preview-image-mobile {
  width: 100%;
  height: auto;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.post-preview.sticky .post-preview-image-mobile-solid {
  width: 100%;
  height: 320px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background-color: var(--color-primary);
}

.post-preview.sticky .post-preview-image {
  width: 49.3243243243%;
  height: 100%;
  border-top-right-radius: 0;
  border-bottom-left-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.post-preview.sticky .post-preview-info {
  margin: 28px 28px 0 0;
  width: 616px;
  height: 300px;
  position: relative;
  z-index: 2;
}

.post-preview.sticky .post-preview-info.fixed-height {
  height: 300px;
}

.post-preview.sticky .post-preview-info .post-preview-title {
  font-size: 1.5rem;
  line-height: 1.3333333333em;
}

.post-preview.sticky .post-preview-info .post-preview-title.medium {
  font-size: 1.75rem;
  line-height: 1.1428571429em;
}

.post-preview.sticky .content-actions {
  width: 50.6756756757%;
}

.post-preview.small {
  min-height: auto;
  height: 230px;
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: end;
  align-items: flex-end;
}

.post-preview.small.post-preview-no-cover {
  padding: 16px 16px 0;
}

.post-preview.small.post-preview-no-cover .post-preview-info {
  width: 100%;
  margin: 0 auto;
}

.post-preview.small.post-preview-no-cover .post-format-tag {
  position: absolute;
  top: -16px;
  right: 16px;
  z-index: 3;
}

.post-preview.small.post-preview-no-cover .content-actions {
  padding-right: 0;
}

.post-preview.small .gallery-popup-button {
  left: 16px;
  right: auto;
}

.post-preview.small .post-preview-gallery {
  width: 260px;
  height: 230px;
  position: absolute;
  top: 0;
  left: 0;
}

.post-preview.small .post-preview-gallery .post-preview-gallery-slider-item {
  width: 260px;
  height: 230px;
  border-top-right-radius: 0;
  border-bottom-left-radius: 12px;
}

.post-preview.small .post-preview-gallery-controls {
  top: 8px;
  right: 36px;
  bottom: auto;
}

.post-preview.small .post-preview-image {
  width: 260px;
  height: 100%;
  border-top-right-radius: 0;
  border-bottom-left-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.post-preview.small .post-preview-image .post-preview-image-action {
  top: 85px;
  left: 85px;
  margin-left: 0;
}

.post-preview.small .post-preview-info {
  margin: 16px 16px 0 0;
  width: 352px;
  height: 156px;
  position: relative;
  z-index: 2;
}

.post-preview.small .content-actions {
  width: 55.4794520548%;
}

.post-preview.medium {
  min-height: auto;
  box-shadow: none;
}

.post-preview.medium.post-preview-no-cover {
  padding-top: 28px;
}

.post-preview.medium.post-preview-no-cover .post-preview-info {
  margin-top: 0;
}

.post-preview.medium.post-preview-no-cover .post-preview-info.fixed-height {
  height: 484px;
}

.post-preview.medium.post-preview-normal {
  min-height: 596px;
  box-shadow: var(--color-box-shadow);
}

.post-preview.medium.post-preview-normal .post-preview-image {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.post-preview.medium.post-preview-normal .post-preview-image .post-preview-image-action {
  top: 60px;
}

.post-preview.medium.post-preview-normal .tag-list {
  min-height: 36px;
  margin-top: 16px;
  padding: 0 28px;
}

.post-preview.medium.post-preview-normal .content-actions {
  margin: 26px 28px 0;
  padding: 0;
  border-top: 1px solid var(--color-divider);
}

.post-preview.medium .post-preview-gallery {
  height: 320px;
}

.post-preview.medium .post-preview-gallery .post-preview-gallery-slider-item {
  height: 320px;
}

.post-preview.medium .post-preview-gallery-controls {
  right: 52px;
  bottom: 120px;
}

.post-preview.medium .post-preview-image {
  height: 320px;
  border-radius: 0;
}

.post-preview.medium .post-preview-info {
  width: 90.4109589041%;
  margin-top: -140px;
}

.post-preview.medium .post-preview-info .post-preview-title {
  font-size: 1.5rem;
  line-height: 1.3333333333em;
}

.post-preview.medium .post-preview-info .post-preview-title.medium {
  font-size: 1.75rem;
  line-height: 1.1428571429em;
}

.post-preview.medium .post-preview-info .post-preview-text {
  margin-top: 24px;
}

.post-preview .post-preview-image {
  height: 210px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  position: relative;
  z-index: 1;
  background-color: var(--color-primary);
}

.post-preview .post-preview-image .post-preview-image-action {
  position: absolute;
  top: 50px;
  left: 50%;
  margin-left: -30px;
}

.post-preview .post-preview-info {
  width: 91.6666666667%;
  padding: 28px;
  margin: -48px auto 0;
  border-radius: 12px;
  background-color: var(--color-box-over-box-background);
  box-shadow: var(--color-overbox-big-shadow);
  position: relative;
  z-index: 2;
  word-break: break-word;
}

.post-preview .post-preview-info.fixed-height {
  height: 320px;
  padding: 28px 28px 22px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.post-preview .post-preview-info.fixed-height .post-preview-text {
  margin-top: 0;
}

.post-preview .post-preview-info .post-preview-timestamp {
  display: none !important;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.post-preview .post-preview-info .post-preview-title {
  margin-top: 10px;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2em;
  word-wrap: break-word;
}

.post-preview .post-preview-info .post-preview-title a {
  color: var(--color-text);
  font-weight: 700;
}

.post-preview .post-preview-info .post-preview-text {
  margin-top: 16px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.post-preview .post-preview-info .post-preview-link {
  margin-top: 20px;
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  transition: color .2s ease-in-out;
}

.post-preview .content-actions {
  margin-top: 10px;
  padding: 0 28px;
}

/*------------------------
    1. POST PEEK LIST
------------------------*/
.post-peek-list .post-peek {
  margin-bottom: 22px;
}

.post-peek-list .post-peek:last-child {
  margin-bottom: 0;
}

/*-------------------
    1. POST PEEK
-------------------*/
.post-peek {
  min-height: 40px;
  padding-left: 52px;
  position: relative;
}

.post-peek .post-format-tag {
  width: 40px;
  height: 40px;
  position: absolute;
  top: -2px;
  left: 0;
  box-shadow: none;
}

.post-peek .post-peek-image {
  position: absolute;
  top: -1px;
  left: 0;
}

.post-peek .post-peek-image .picture {
  background-color: var(--color-primary);
}

.post-peek .post-peek-title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.1428571429em;
}

.post-peek .post-peek-title a {
  color: var(--color-text);
  font-weight: 700;
}

.post-peek .post-peek-text {
  margin-top: 8px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

/*----------------------------
    POST PREVIEW LINE LIST
----------------------------*/
.post-preview-line-list .post-preview-line {
  margin-bottom: 22px;
}

.post-preview-line-list .post-preview-line:last-child {
  margin-bottom: 0;
}

/*------------------------
    POST PREVIEW LINE
------------------------*/
.post-preview-line .post-preview-line-title {
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.1428571429em;
}

.post-preview-line .post-preview-line-title a {
  color: var(--color-text);
  font-weight: 700;
}

.post-preview-line .post-preview-line-meta {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 8px;
}

.post-preview-line .user-avatar,
.post-preview-line .user-avatar-circle {
  margin-right: 8px;
}

.post-preview-line .post-preview-line-author {
  margin-right: 6px;
  font-size: 0.75rem;
  font-weight: 700;
}

.post-preview-line .post-preview-line-author a {
  color: var(--color-text);
  font-weight: 700;
}

.post-preview-line .post-preview-line-timestamp {
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 960px) {
  .post-preview.sticky {
    display: block;
    height: auto;
  }

  .post-preview.sticky.post-preview-no-cover {
    padding: 28px 0 0;
  }

  .post-preview.sticky.post-preview-no-cover .post-preview-info {
    width: 95%;
  }

  .post-preview.sticky.post-preview-no-cover .content-actions {
    padding-right: 28px;
  }

  .post-preview.sticky .post-preview-image {
    display: none;
  }

  .post-preview.sticky .post-preview-image-mobile-link,
  .post-preview.sticky .post-preview-image-mobile {
    display: block;
  }

  .post-preview.sticky .post-preview-info {
    margin: -64px auto 0;
    width: 95%;
    height: auto;
  }

  .post-preview.sticky .post-preview-info.fixed-height {
    height: auto;
  }

  .post-preview.sticky .content-actions {
    width: 100%;
  }

  .post-preview.small {
    height: auto;
    display: block;
  }

  .post-preview.small.post-preview-no-cover .post-format-tag {
    position: static;
  }

  .post-preview.small .post-preview-image {
    width: 100%;
    height: 210px;
    border-top-right-radius: 12px;
    border-bottom-left-radius: 0px;
    position: relative;
  }

  .post-preview.small .post-preview-image .post-preview-image-action {
    top: 51px;
    left: 50%;
    margin-left: -30px;
  }

  .post-preview.small .post-preview-gallery {
    width: 100%;
    height: 210px;
    border-top-right-radius: 12px;
    border-bottom-left-radius: 0px;
    position: relative;
  }

  .post-preview.small .post-preview-gallery-controls {
    top: 154px;
  }

  .post-preview.small .post-preview-info {
    margin: -48px auto 0;
    width: 100%;
    height: auto;
  }

  .post-preview.small .content-actions {
    width: 100%;
  }
}

@media screen and (max-width: 680px) {
  .post-preview {
    min-height: auto;
  }

  .post-preview.post-preview-no-cover .post-preview-info.fixed-height {
    height: auto;
  }

  .post-preview.medium.post-preview-normal {
    min-height: auto;
  }

  .post-preview.medium.post-preview-no-cover .post-preview-info.fixed-height {
    height: auto;
  }

  .post-preview .post-preview-info.fixed-height {
    display: block;
    height: auto;
    padding: 28px;
  }

  .post-preview .post-preview-info.fixed-height .post-preview-text {
    margin-top: 16px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .post-comment
2. .post-comment-heading
3. .post-comment-form
4. .post-comment-list
-------------------------------------------------------------------*/
/*-----------------------
    1. POST COMMENT
-----------------------*/
.post-comment {
  padding: 26px 28px 28px 80px;
  background-color: var(--color-box-background);
  position: relative;
}

.post-comment.reply-2,
.post-comment.reply-3,
.post-comment.reply-4,
.post-comment.reply-5,
.post-comment.reply-6,
.post-comment.reply-7,
.post-comment.reply-8,
.post-comment.reply-9,
.post-comment.reply-10 {
  background-color: var(--color-box-background-alt);
}

.post-comment.reply-2 .post-comment-form,
.post-comment.reply-3 .post-comment-form,
.post-comment.reply-4 .post-comment-form,
.post-comment.reply-5 .post-comment-form,
.post-comment.reply-6 .post-comment-form,
.post-comment.reply-7 .post-comment-form,
.post-comment.reply-8 .post-comment-form,
.post-comment.reply-9 .post-comment-form,
.post-comment.reply-10 .post-comment-form {
  background-color: var(--color-box-background-alt);
}

.post-comment.reply-2 .post-comment-form textarea,
.post-comment.reply-3 .post-comment-form textarea,
.post-comment.reply-4 .post-comment-form textarea,
.post-comment.reply-5 .post-comment-form textarea,
.post-comment.reply-6 .post-comment-form textarea,
.post-comment.reply-7 .post-comment-form textarea,
.post-comment.reply-8 .post-comment-form textarea,
.post-comment.reply-9 .post-comment-form textarea,
.post-comment.reply-10 .post-comment-form textarea {
  background-color: var(--color-box-background-alt);
}

.post-comment.reply-2 {
  padding-left: 108px;
}

.post-comment.reply-2 .user-avatar,
.post-comment.reply-2 .user-avatar-circle {
  left: 56px;
}

.post-comment.reply-3 {
  padding-left: 136px;
}

.post-comment.reply-3 .user-avatar,
.post-comment.reply-3 .user-avatar-circle {
  left: 84px;
}

.post-comment.reply-4 {
  padding-left: 164px;
}

.post-comment.reply-4 .user-avatar,
.post-comment.reply-4 .user-avatar-circle {
  left: 112px;
}

.post-comment.reply-5 {
  padding-left: 192px;
}

.post-comment.reply-5 .user-avatar,
.post-comment.reply-5 .user-avatar-circle {
  left: 140px;
}

.post-comment.reply-6 {
  padding-left: 220px;
}

.post-comment.reply-6 .user-avatar,
.post-comment.reply-6 .user-avatar-circle {
  left: 168px;
}

.post-comment.reply-7 {
  padding-left: 248px;
}

.post-comment.reply-7 .user-avatar,
.post-comment.reply-7 .user-avatar-circle {
  left: 196px;
}

.post-comment.reply-8 {
  padding-left: 276px;
}

.post-comment.reply-8 .user-avatar,
.post-comment.reply-8 .user-avatar-circle {
  left: 224px;
}

.post-comment.reply-9 {
  padding-left: 304px;
}

.post-comment.reply-9 .user-avatar,
.post-comment.reply-9 .user-avatar-circle {
  left: 252px;
}

.post-comment.reply-10 {
  padding-left: 332px;
}

.post-comment.reply-10 .user-avatar,
.post-comment.reply-10 .user-avatar-circle {
  left: 280px;
}

.post-comment .user-avatar,
.post-comment .user-avatar-circle {
  position: absolute;
  top: 28px;
  left: 28px;
}

.post-comment .post-comment-text-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.post-comment .post-comment-text-wrap .rating-list {
  margin-right: 12px;
}

.post-comment .post-comment-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  color: var(--color-text);
  white-space: pre-line;
  word-break: break-word;
}

.post-comment .post-comment-text .vikinger-user-tag,
.post-comment .post-comment-text .vikinger-pmpro-level-tag {
  margin: 0 2px 0 6px;
  display: inline-block;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  top: -2px;
}

.post-comment .post-comment-text .vikinger-user-tag .vikinger-user-tag-text,
.post-comment .post-comment-text .vikinger-user-tag .vikinger-pmpro-level-tag-text,
.post-comment .post-comment-text .vikinger-pmpro-level-tag .vikinger-user-tag-text,
.post-comment .post-comment-text .vikinger-pmpro-level-tag .vikinger-pmpro-level-tag-text {
  line-height: 1em;
}

.post-comment .post-comment-text .vikinger-user-tag+.vikinger-user-tag,
.post-comment .post-comment-text .vikinger-user-tag+.vikinger-pmpro-level-tag,
.post-comment .post-comment-text .vikinger-pmpro-level-tag+.vikinger-user-tag,
.post-comment .post-comment-text .vikinger-pmpro-level-tag+.vikinger-pmpro-level-tag {
  margin-left: 2px;
}

.post-comment .post-comment-text .bold {
  font-weight: 700;
}

.post-comment .post-comment-text .highlighted {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.post-comment .post-comment-text .post-comment-text-author {
  margin-right: 6px;
  color: var(--color-text);
  font-weight: 700;
}

.post-comment .post-comment-text .post-comment-text-content a {
  color: var(--color-primary-dark);
}

.post-comment .post-comment-text .post-comment-form {
  padding: 0;
  margin-top: 8px;
  background-color: transparent;
}

.post-comment .post-comment-text .post-comment-form .form-textarea-limit {
  margin-top: 0;
}

.post-comment .post-comment-text.user-tag::after {
  display: inline-block;
  height: 20px;
  padding: 0 8px;
  border-radius: 200px;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 20px;
  position: relative;
  top: -1px;
}

.post-comment .post-comment-text.user-tag.purchased::after {
  content: 'Purchased!';
  background-color: var(--color-secondary);
}

.post-comment .post-comment-text.user-tag.author::after {
  content: 'Author';
  background-color: var(--color-primary);
}

.post-comment .post-comment-notification {
  margin-top: 12px;
  color: var(--color-primary-dark);
  font-size: 0.875rem;
  font-weight: 500;
}

.post-comment .content-actions {
  height: 20px;
  margin-top: 14px;
}

.post-comment .post-comment-form {
  padding: 26px 0 0 30px;
}

.post-comment .post-comment-form .user-avatar,
.post-comment .post-comment-form .user-avatar-circle {
  left: -24px;
}

.post-comment .post-comment-form .mention-list .mention-list-item .user-avatar,
.post-comment .post-comment-form .mention-list .mention-list-item .user-avatar-circle {
  left: auto;
}

/*------------------------------
    2. POST COMMENT HEADING
------------------------------*/
.post-comment-heading {
  height: 53px;
  background-color: var(--color-box-background);
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 53px;
  text-align: center;
  cursor: pointer;
}

.post-comment-heading .highlighted {
  color: var(--color-primary-dark);
}

.post-comment-heading.reply-2,
.post-comment-heading.reply-3,
.post-comment-heading.reply-4,
.post-comment-heading.reply-5,
.post-comment-heading.reply-6 {
  height: 45px;
  background-color: var(--color-box-background-alt);
  line-height: 45px;
  text-align: left;
}

.post-comment-heading.reply-2 {
  padding-left: 80px;
}

.post-comment-heading.reply-3 {
  padding-left: 108px;
}

.post-comment-heading.reply-4 {
  padding-left: 136px;
}

.post-comment-heading.reply-5 {
  padding-left: 164px;
}

.post-comment-heading.reply-6 {
  padding-left: 192px;
}

/*---------------------------
    3. POST COMMENT FORM
---------------------------*/
.post-comment-form {
  padding: 26px 28px 26px 80px;
  position: relative;
  background-color: var(--color-box-background);
}

.post-comment-form.bordered-top {
  border-top: 1px solid var(--color-divider);
}

.post-comment-form.guest-form {
  padding-left: 28px;
  padding-top: 60px;
}

.post-comment-form.with-title {
  padding-top: 80px;
}

.post-comment-form.with-title .user-avatar,
.post-comment-form.with-title .user-avatar-circle {
  top: 82px;
}

.post-comment-form.with-title .mention-list .mention-list-item .user-avatar,
.post-comment-form.with-title .mention-list .mention-list-item .user-avatar-circle {
  top: auto;
}

.post-comment-form .post-comment-form-title {
  font-size: 1rem;
  font-weight: 700;
  position: absolute;
  top: 32px;
  left: 28px;
}

.post-comment-form .post-comment-form-text {
  margin-bottom: 32px;
  font-size: 0.875rem;
  font-weight: 500;
}

.post-comment-form .post-comment-form-error,
.post-comment-form .post-comment-form-notification {
  margin-top: 8px;
  font-size: 0.875rem;
  font-weight: 500;
}

.post-comment-form .post-comment-form-error {
  color: #f9515c;
}

.post-comment-form .post-comment-form-notification {
  color: var(--color-primary);
}

.post-comment-form .loader-spinner-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  margin-top: 8px;
}

.post-comment-form .user-avatar,
.post-comment-form .user-avatar-circle {
  position: absolute;
  top: 28px;
  left: 28px;
}

.post-comment-form .post-comment-form-actions {
  margin-top: 20px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
}

.post-comment-form .post-comment-form-actions .button {
  width: 140px;
}

.post-comment-form .post-comment-form-actions .button:first-child {
  width: 120px;
  margin-right: 6px;
}

/*---------------------------
    4. POST COMMENT LIST
---------------------------*/
.post-comments {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.post-comments .post-comment,
.post-comments .post-comment-heading {
  border-top: 1px solid var(--color-divider);
}

.post-comments>.post-comment-form {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  border-top: 1px solid var(--color-divider);
}

.post-comments>.loader-spinner-wrap {
  padding: 32px 0;
  border-top: 1px solid var(--color-divider);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.post-comment-list-wrap .post-comment-list.post-comment-list-deleted {
  -webkit-filter: grayscale(0.8);
  filter: grayscale(0.8);
  opacity: .7;
  pointer-events: none;
}

.post-comment-list-wrap .post-comment-list:last-child>.post-comment:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.post-comment-list-wrap .post-comment-heading:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 460px) {
  .post-comment .content-actions {
    height: auto;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .post-open
-------------------------------------------------------------------*/
/*--------------------
    1. POST OPEN
--------------------*/
.post-open {
  margin-bottom: 80px;
}

.post-open.v3 {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.post-open.v3.full .post-open-body .post-open-content .post-open-content-body {
  width: 100%;
}

.post-open.v3 .post-gallery {
  width: 100%;
  height: 480px;
  position: relative;
}

.post-open.v3 .post-gallery .gallery-popup-button {
  position: absolute;
  top: -8px;
  right: 16px;
  z-index: 2;
}

.post-open.v3 .post-gallery .post-gallery-slider-item {
  height: 480px;
}

.post-open.v3 .post-gallery .post-gallery-controls .slider-control {
  position: absolute;
  top: 224px;
  z-index: 1;
}

.post-open.v3 .post-gallery .post-gallery-controls .slider-control.left {
  left: -8px;
}

.post-open.v3 .post-gallery .post-gallery-controls .slider-control.right {
  right: -8px;
}

.post-open.v3 .post-open-heading {
  padding: 60px 0;
  text-align: center;
}

.post-open.v3 .post-open-heading .post-open-title {
  width: 62.2171945701%;
  margin: 22px auto 0;
}

.post-open.v3 .post-open-heading .post-open-heading-meta {
  margin-top: 30px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
}

.post-open.v3 .post-open-heading .post-open-heading-meta .post-open-heading-meta-title {
  margin-right: 16px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.post-open.v3 .post-open-heading .post-open-heading-meta .author-preview-text {
  text-align: left;
}

.post-open.v3 .post-open-heading+.post-open-body {
  padding-top: 0;
}

.post-open.v3 .post-open-cover {
  height: 480px;
}

.post-open.v3 .post-open-body {
  width: 100%;
  max-width: 100%;
  padding-top: 80px;
  margin: 0;
  border-radius: 0;
  background-color: transparent;
  box-shadow: none;
}

.post-open.v3 .post-open-body .post-open-content {
  margin-top: 0;
  padding: 0 84px;
}

.post-open.v3 .post-open-body .post-open-content .post-open-content-sidebar {
  width: 13.9664804469%;
}

.post-open.v3 .post-open-body .post-open-content .post-open-content-body {
  width: 86.0335195531%;
}

.post-open.v2.full .post-open-body {
  width: 90%;
  max-width: 100%;
  margin: -100px auto 0;
}

.post-open.v2.full .post-open-body .post-open-content .post-open-content-sidebar {
  width: 14.3835616438%;
  max-width: 84px;
}

.post-open.v2.full .post-open-body .post-open-content .post-open-content-body {
  width: 85.6164383562%;
}

.post-open.v2.no-cover {
  padding-top: 0;
}

.post-open.v2.no-cover .post-open-body {
  margin-top: 0;
}

.post-open.v2.no-cover .post-open-body .post-open-heading {
  margin-bottom: 70px;
}

.post-open.v2.no-cover .post-open-sidebar {
  padding-top: 0;
}

.post-open.v2 .grid {
  margin-top: 0;
  justify-items: end;
}

.post-open.v2 .post-open-cover {
  min-height: 662px;
  height: auto;
  border-radius: 12px;
}

.post-open.v2 .post-open-cover-overlay {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
  align-items: flex-end;
  width: 100%;
  height: 100%;
  min-height: inherit;
  padding: 80px 100px 160px;
  border-radius: 12px;
  background-color: rgba(32, 33, 49, 0.6);
}

.post-open.v2 .post-open-cover-overlay .post-open-heading {
  width: 100%;
}

.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp {
  color: #fff;
}

.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp .highlighted {
  color: #fff;
}

.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp a {
  font-weight: 700;
}

.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-title {
  width: 75%;
  color: #fff;
  font-size: 3.375rem;
}

.post-open.v2 .post-open-body {
  width: 88.6877828054%;
  max-width: 784px;
  padding-top: 80px;
  margin: -100px 0 0;
}

.post-open.v2 .post-open-body .post-open-content {
  margin-top: 0;
}

.post-open.v2 .post-open-sidebar {
  width: 100%;
  padding-top: 32px;
}

.post-open.no-cover {
  padding-top: 32px;
}

.post-open.no-cover .post-open-body {
  margin-top: 0;
}

.post-open .post-open-cover {
  width: 100%;
  height: 560px;
}

.post-open .post-open-heading .post-open-timestamp {
  color: var(--color-text-alt-2);
  font-size: 1rem;
  font-weight: 700;
  text-transform: uppercase;
}

.post-open .post-open-heading .post-open-timestamp .highlighted {
  margin-right: 12px;
}

.post-open .post-open-heading .post-open-title {
  margin-top: 22px;
  font-size: 2.875rem;
  font-weight: 700;
  word-wrap: break-word;
}

.post-open .post-open-body {
  width: 65%;
  max-width: 784px;
  margin: -220px auto 0;
  padding-top: 90px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.post-open .post-open-body .post-open-heading {
  padding: 0 100px;
}

.post-open .post-open-body .post-open-heading .post-open-timestamp {
  color: var(--color-text-alt-2);
}

.post-open .post-open-body .post-open-heading .post-open-timestamp .highlighted {
  color: var(--color-text);
}

.post-open .post-open-body .post-open-content {
  display: -ms-flexbox;
  display: flex;
  margin-top: 70px;
  padding: 0 100px;
}

.post-open .post-open-body .post-open-content .post-open-content-sidebar {
  width: 84px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.post-open .post-open-body .post-open-content .post-open-content-sidebar .author-preview {
  padding-right: 16px;
}

.post-open .post-open-body .post-open-content .post-open-content-sidebar .post-open-sidebar-title {
  width: 40px;
  margin-top: 24px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  text-align: center;
}

.post-open .post-open-body .post-open-content .post-open-content-sidebar .social-links {
  margin-top: 26px;
}

.post-open .post-open-body .post-open-content .post-open-content-body {
  width: 500px;
  padding-bottom: 80px;
}

.post-open .post-open-body .post-open-content .post-open-content-body .post-open-excerpt {
  font-size: 1.375rem;
  font-weight: 500;
  line-height: 1.5454545455em;
}

.post-open .post-open-body .post-open-content .post-open-content-body .post-open-paragraph {
  margin-top: 36px;
  font-size: 1rem;
  font-weight: 500;
  line-height: 2em;
}

.post-open .post-open-body .post-open-content .post-open-content-body .post-open-paragraph:first-child {
  margin-top: 0;
}

.post-open .post-open-body .post-open-content .post-open-content-body .post-open-image {
  width: 100%;
  height: 320px;
  margin-top: 50px;
}

.post-open .post-open-body .post-open-content .post-open-content-body .post-open-image-caption {
  margin-top: 20px;
  color: #8f91ac;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  text-align: center;
}

.post-open .post-open-body .post-open-content .post-open-content-body .tag-list {
  margin-top: 60px;
}

.post-open .post-open-body .post-open-content .post-open-content-body .tag-list:first-child {
  margin-top: 160px;
}

.post-open .post-open-body .page-loader-indicator {
  margin: 0;
  padding-bottom: 40px;
}

.post-open .post-open-body .post-options {
  padding: 0 100px;
}

.post-open .post-footer>.content-actions {
  margin: 0 28px;
  border-top: 1px solid var(--color-divider);
}

.post-open-content-body {
  word-wrap: break-word;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .post-open .post-open-body {
    width: 95%;
    max-width: 100%;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar {
    width: 15%;
  }

  .post-open .post-open-body .post-open-content .post-open-content-body {
    width: 85%;
  }

  .post-open.v3 .post-open-heading .post-open-title {
    width: 90%;
  }

  .post-open.v2 .grid {
    justify-items: center;
  }

  .post-open.v2 .post-open-cover-overlay {
    padding: 80px 40px 160px;
  }

  .post-open.v2 .post-open-heading .post-open-title {
    width: 100%;
  }

  .post-open.v2 .post-open-body {
    width: 95%;
    max-width: 100%;
  }
}

@media screen and (max-width: 960px) {
  .post-open.v2 .post-open-cover {
    min-height: auto;
  }

  .post-open.v2 .post-open-cover-overlay {
    padding-top: 60px;
  }

  .post-open.v2 .post-open-body {
    padding-top: 40px;
  }

  .post-open.v2 .post-open-body .post-open-content .post-open-content-sidebar {
    margin-bottom: 40px;
  }

  .post-open.v3 .post-open-body .post-open-content {
    padding: 0 40px;
  }

  .post-open.v3 .post-open-body .post-open-content .post-open-content-body,
  .post-open.v3 .post-open-body .post-open-content .post-open-content-sidebar {
    width: 100%;
  }

  .post-open .post-open-body .post-open-heading {
    padding: 0 40px;
  }

  .post-open .post-open-body .post-open-content {
    padding: 0 40px;
    margin-top: 40px;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar,
  .post-open .post-open-body .post-open-content .post-open-content-body {
    width: 100%;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar {
    margin-bottom: 60px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar .post-open-sidebar-title {
    width: auto;
    margin: 0 0 0 16px;
    line-height: 40px;
    text-align: left;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar .social-links {
    margin: 0 0 0 26px;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar .social-links.vertical {
    -ms-flex-direction: row;
    flex-direction: row;
  }

  .post-open .post-open-body .post-open-content .post-open-content-sidebar .social-links.vertical .social-link {
    margin: 0 16px 0 0;
  }

  .post-open .post-open-body .post-open-content .post-open-content-body .tag-list:first-child {
    margin-top: 60px;
  }

  .post-open .post-open-body .post-options {
    padding: 0 28px;
  }
}

@media screen and (max-width: 460px) {
  .post-open .post-open-cover {
    height: 320px;
  }

  .post-open .post-open-body {
    margin-top: -100px;
    padding-top: 60px;
  }

  .post-open .post-open-body .post-open-heading,
  .post-open .post-open-body .post-open-content {
    padding: 0 28px;
  }

  .post-open .post-open-body .post-open-heading .post-open-title {
    font-size: 2.25rem;
  }
}

/*===========================================================
    MODERN POST PAGE LAYOUT REDESIGN
    Overrides for .post-open.v2 and .post-open.v2.full
===========================================================*/

/* ── 1. FEATURED IMAGE — Full-Width Modern Hero ── */

.post-open.v2 .post-open-cover {
  min-height: 480px !important;
  height: auto !important;
  border-radius: 20px !important;
  overflow: hidden !important;
  position: relative !important;
}

.post-open.v2 .post-open-cover-overlay {
  background: linear-gradient(to top,
      rgba(0, 0, 0, 0.75) 0%,
      rgba(0, 0, 0, 0.35) 40%,
      transparent 70%) !important;
  padding: 60px 60px 50px !important;
  border-radius: 20px !important;
  min-height: 480px !important;
  display: flex !important;
  align-items: flex-end !important;
}

/* Category pills on the hero */
.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  align-items: center !important;
  margin-bottom: 16px !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp a {
  display: inline-flex !important;
  padding: 5px 14px !important;
  background: rgba(255, 255, 255, 0.15) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 100px !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: #fff !important;
  text-decoration: none !important;
  transition: background 0.25s ease !important;
}

.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp a:hover {
  background: rgba(255, 255, 255, 0.25) !important;
}

/* Date badge */
.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp .highlighted {
  display: inline-flex !important;
  padding: 5px 14px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  border: 1px solid rgba(255, 255, 255, 0.15) !important;
  border-radius: 100px !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  color: rgba(255, 255, 255, 0.8) !important;
  margin: 0 !important;
}

/* Title on hero */
.post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-title {
  width: 100% !important;
  max-width: 700px !important;
  color: #fff !important;
  font-size: 2.75rem !important;
  font-weight: 800 !important;
  line-height: 1.15 !important;
  letter-spacing: -0.02em !important;
  margin-top: 12px !important;
}

/* ── 2. CONTENT BODY — Wide, Clean, Spacious ── */

/* The .grid.centered wrapper inside the article */
.post-open.v2 .grid.centered {
  max-width: 1100px !important;
  width: 100% !important;
  margin: 0 auto !important;
  justify-items: center !important;
}

.post-open.v2 .grid {
  justify-items: center !important;
}

/* Post body — wide, flat, no box shadow */
.post-open.v2 .post-open-body,
.post-open.v2.full .post-open-body {
  width: 100% !important;
  max-width: 1100px !important;
  margin: 0 auto !important;
  padding: 48px 0 60px !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Content area — full width, no sidebar layout */
.post-open.v2 .post-open-body .post-open-content,
.post-open.v2.full .post-open-body .post-open-content {
  display: block !important;
  margin-top: 0 !important;
  padding: 0 !important;
}

/* ── 3. AUTHOR — Completely Hidden ── */

.post-open.v2 .post-open-body .post-open-content .post-open-content-sidebar,
.post-open.v2.full .post-open-body .post-open-content .post-open-content-sidebar {
  display: none !important;
}

/* ── 4. CONTENT WIDTH — Readable, Centered ── */

.post-open.v2 .post-open-body .post-open-content .post-open-content-body,
.post-open.v2.full .post-open-body .post-open-content .post-open-content-body {
  width: 100% !important;
  max-width: 900px !important;
  margin: 0 auto !important;
  padding-bottom: 40px !important;
}

/* Better typography for content */
.post-open.v2 .post-open-body .post-open-content .post-open-content-body p {
  font-size: 1.0625rem !important;
  line-height: 1.8 !important;
  margin-bottom: 1.5em !important;
}

.post-open.v2 .post-open-body .post-open-content .post-open-content-body h2,
.post-open.v2 .post-open-body .post-open-content .post-open-content-body h3 {
  margin-top: 2em !important;
  margin-bottom: 0.75em !important;
  line-height: 1.3 !important;
}

.post-open.v2 .post-open-body .post-open-content .post-open-content-body img {
  border-radius: 12px !important;
  margin: 24px 0 !important;
}

/* Post heading inside body (for non-cover posts) */
.post-open.v2 .post-open-body .post-open-heading {
  padding: 0 !important;
  margin-bottom: 32px !important;
  max-width: 900px !important;
}

/* Post options / footer */
.post-open.v2 .post-open-body .post-options {
  padding: 0 !important;
  max-width: 900px !important;
  margin: 0 auto !important;
}

/* Comment section */
.post-open .post-footer>.content-actions {
  max-width: 900px !important;
  margin: 0 auto !important;
  padding-top: 24px !important;
}

/* ── 5. DARK MODE — Post Page ── */

body.active-dark-mode .post-open.v2 .post-open-body {
  background-color: transparent !important;
}

body.active-dark-mode .post-open.v2 .post-open-body .post-open-content .post-open-content-sidebar {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}

body.active-dark-mode .post-open .post-footer>.content-actions {
  border-top-color: rgba(255, 255, 255, 0.06) !important;
}

/* ── 6. LIGHT MODE — Post Page ── */

body:not(.active-dark-mode) .post-open.v2 .post-open-body .post-open-content .post-open-content-sidebar {
  background: rgba(0, 0, 0, 0.02) !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

/* ── 7. RESPONSIVE — Post Page Breakpoints ── */

@media screen and (max-width: 1365px) {

  .post-open.v2 .post-open-body,
  .post-open.v2.full .post-open-body {
    max-width: 100% !important;
    padding: 40px 32px 60px !important;
  }

  .post-open.v2 .grid.centered {
    max-width: 100% !important;
  }

  .post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-title {
    font-size: 2.25rem !important;
  }
}

@media screen and (max-width: 960px) {
  .post-open.v2 .post-open-cover {
    min-height: 360px !important;
    border-radius: 16px !important;
  }

  .post-open.v2 .post-open-cover-overlay {
    padding: 40px 32px 40px !important;
    min-height: 360px !important;
    border-radius: 16px !important;
  }

  .post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-title {
    font-size: 1.875rem !important;
    max-width: 100% !important;
  }

  .post-open.v2 .grid.centered {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  .post-open.v2 .post-open-body,
  .post-open.v2.full .post-open-body {
    width: 100% !important;
    max-width: 100% !important;
    padding: 32px 16px 40px !important;
    box-sizing: border-box !important;
  }

  .post-open.v2 .post-open-body .post-open-content,
  .post-open.v2.full .post-open-body .post-open-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .post-open.v2 .post-open-body .post-open-content .post-open-content-body,
  .post-open.v2.full .post-open-body .post-open-content .post-open-content-body {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  .post-open.v2 .post-open-body .post-open-content .post-open-content-sidebar {
    padding: 16px 20px !important;
    border-radius: 12px !important;
  }
}

@media screen and (max-width: 460px) {
  .post-open.v2 .post-open-cover {
    min-height: 280px !important;
    border-radius: 12px !important;
  }

  .post-open.v2 .post-open-cover-overlay {
    padding: 24px 20px 28px !important;
    min-height: 280px !important;
    border-radius: 12px !important;
  }

  .post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-title {
    font-size: 1.5rem !important;
  }

  .post-open.v2 .post-open-cover-overlay .post-open-heading .post-open-timestamp a {
    font-size: 10px !important;
    padding: 4px 10px !important;
  }

  .post-open.v2 .post-open-body,
  .post-open.v2.full .post-open-body {
    padding: 24px 16px 32px !important;
  }

  .post-open.v2 .post-open-body .post-open-content .post-open-content-body p {
    font-size: 1rem !important;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .page-open
-------------------------------------------------------------------*/
/*--------------------
    1. PAGE OPEN
--------------------*/
.page-open {
  padding-top: 46px;
}

.page-open .page-open-title {
  font-size: 2.875rem;
  font-weight: 700;
  text-align: center;
}

.page-open .page-open-cover {
  margin-top: 64px;
  width: 100%;
  height: 480px;
}

.page-open .page-open-content {
  margin-top: 64px;
  padding-bottom: 90px;
}

.page-open .page-open-comments {
  clear: both;
}

/*------------------------------------------------------------------
[Table of contents]

1. .product-preview
2. .product-category-box
-------------------------------------------------------------------*/
/*--------------------------
    1. PRODUCT PREVIEW
--------------------------*/
.product-preview {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.product-preview.fixed-height {
  height: 360px;
}

.product-preview.small {
  background-color: transparent;
  box-shadow: none;
}

.product-preview.small .product-preview-image {
  height: 144px;
  border-radius: 12px;
}

.product-preview.small .product-preview-info {
  padding: 20px 0 0;
}

.product-preview.small .product-preview-info .text-sticker {
  right: -8px;
}

.product-preview.small .product-preview-info .product-preview-title {
  font-size: 0.875rem;
}

.product-preview.tiny {
  display: -ms-flexbox;
  display: flex;
  background-color: transparent;
  box-shadow: none;
}

.product-preview.tiny .product-preview-image {
  width: 94px;
  height: 60px;
  margin-right: 20px;
  border-radius: 12px;
}

.product-preview.tiny .product-preview-image.short {
  width: 60px;
}

.product-preview.tiny .product-preview-info {
  padding: 4px 0 0;
}

.product-preview.tiny .product-preview-info .product-preview-title {
  font-size: 0.875rem;
}

.product-preview.tiny .product-preview-info .product-preview-category {
  margin-top: 6px;
}

.product-preview.tiny .product-preview-info .product-preview-creator {
  margin-top: 6px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 700;
}

.product-preview.tiny .product-preview-info .product-preview-creator a {
  color: var(--color-text-alt-2);
  font-weight: 700;
}

.product-preview.micro {
  display: -ms-flexbox;
  display: flex;
  background-color: transparent;
  box-shadow: none;
}

.product-preview.micro .product-preview-image {
  width: 68px;
  height: 44px;
  margin-right: 12px;
  border-radius: 12px;
}

.product-preview.micro .product-preview-info {
  padding: 6px 0 0;
}

.product-preview.micro .product-preview-info .product-preview-title {
  font-size: 0.875rem;
}

.product-preview.micro .product-preview-info .product-preview-category {
  margin-top: 6px;
}

.product-preview .product-preview-image {
  height: 180px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.product-preview .product-preview-info {
  padding: 28px;
  position: relative;
}

.product-preview .product-preview-info .text-sticker {
  position: absolute;
  top: -14px;
  right: 14px;
}

.product-preview .product-preview-info .product-preview-title a,
.product-preview .product-preview-info .product-preview-category a {
  color: var(--color-text);
  font-weight: 700;
}

.product-preview .product-preview-info .product-preview-title {
  font-size: 1rem;
  font-weight: 700;
}

.product-preview .product-preview-info .product-preview-category {
  margin-top: 8px;
  padding-left: 14px;
  font-size: 0.75rem;
  font-weight: 700;
  position: relative;
}

.product-preview .product-preview-info .product-preview-category.digital::before {
  border-color: #3ad2fe;
}

.product-preview .product-preview-info .product-preview-category.physical::before {
  border-color: #23d2e2;
}

.product-preview .product-preview-info .product-preview-category::before {
  content: '';
  width: 8px;
  height: 8px;
  border-radius: 50%;
  border: 2px solid #3e3f5e;
  position: absolute;
  top: 1px;
  left: 0;
}

.product-preview .product-preview-info .product-preview-text {
  margin-top: 20px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.product-preview .product-preview-info .button {
  margin-top: 36px;
}

.product-preview .product-preview-meta {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  height: 53px;
  padding: 0 28px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-box-background-alt);
  border-top: 1px solid var(--color-divider);
}

.product-preview .product-preview-author {
  padding-left: 26px;
  position: relative;
}

.product-preview .product-preview-author .product-preview-author-image {
  position: absolute;
  top: 1px;
  left: 0;
}

.product-preview .product-preview-author .product-preview-author-title {
  font-size: 0.625rem;
  font-weight: 500;
}

.product-preview .product-preview-author .product-preview-author-text {
  margin-top: 1px;
  font-size: 0.75rem;
  font-weight: 700;
}

.product-preview .product-preview-author .product-preview-author-text a {
  color: var(--color-text);
  font-weight: 700;
}

/*-----------------------------
    1. PRODUCT CATEGORY BOX
-----------------------------*/
.product-category-box {
  display: block;
  height: 142px;
  padding: 26px 0 0 28px;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
}

.product-category-box.category-all {
  background: url("../img/marketplace/category/01.png") no-repeat right top, linear-gradient(to right, #615dfa, #8d7aff);
}

.product-category-box.category-all .product-category-box-tag {
  color: #615dfa;
}

.product-category-box.category-featured {
  background: url("../img/marketplace/category/02.png") no-repeat right top, linear-gradient(to right, #417ae1, #5aafff);
}

.product-category-box.category-featured .product-category-box-tag {
  color: #4f8dff;
}

.product-category-box.category-digital {
  background: url("../img/marketplace/category/03.png") no-repeat right top, linear-gradient(to right, #2ebfef, #4ce4ff);
}

.product-category-box.category-digital .product-category-box-tag {
  color: #3ad2fe;
}

.product-category-box.category-physical {
  background: url("../img/marketplace/category/04.png") no-repeat right top, linear-gradient(to right, #17cada, #2becfe);
}

.product-category-box.category-physical .product-category-box-tag {
  color: #23d2e2;
}

.product-category-box .product-category-box-title {
  color: #fff;
  font-size: 1.125rem;
  font-weight: 700;
}

.product-category-box .product-category-box-text {
  margin-top: 4px;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
}

.product-category-box .product-category-box-tag {
  display: inline-block;
  height: 20px;
  margin-top: 36px;
  padding: 0 8px;
  border-radius: 200px;
  background-color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 20px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .stream-box
-------------------------------------------------------------------*/
/*----------------------
    1. STREAM BOX
----------------------*/
.stream-box {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
  transition: border-radius .2s ease-in-out;
}

.stream-box.no-video-radius:hover .stream-box-info {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.stream-box.no-video-radius .stream-box-video iframe {
  border-radius: 0;
}

.stream-box.big:hover .stream-box-info {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.stream-box.big .stream-box-video {
  width: 100%;
  padding-top: 56.25%;
  position: relative;
}

.stream-box.big .stream-box-video iframe {
  position: absolute;
  top: 0;
  left: 0;
}

.stream-box.big .stream-box-info {
  padding: 28px 28px 28px 88px;
}

.stream-box.big .stream-box-info .stream-box-game-image {
  width: 44px;
  height: 60px;
  position: absolute;
  top: 28px;
  left: 28px;
}

.stream-box.big .stream-box-info .stream-box-title {
  font-size: 1.125rem;
}

.stream-box.big .stream-box-info .stream-box-category {
  margin-top: 6px;
  font-size: 0.875rem;
}

.stream-box.big .stream-box-info .stream-box-views {
  margin-top: 10px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.stream-box .stream-box-video {
  height: 160px;
}

.stream-box .stream-box-video iframe {
  width: 100%;
  height: 100%;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.stream-box .stream-box-image {
  border-radius: 50%;
  border: 4px solid var(--color-box-background);
  position: absolute;
  top: 138px;
  left: 24px;
  z-index: 3;
}

.stream-box .stream-box-info {
  padding: 22px 28px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  position: relative;
  z-index: 2;
  transition: border-radius .2s ease-in-out;
}

.stream-box .stream-box-info .stream-box-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.stream-box .stream-box-info .stream-box-title a {
  color: var(--color-text);
  font-weight: 700;
}

.stream-box .stream-box-info .stream-box-text {
  margin-top: 6px;
  font-size: 0.75rem;
  font-weight: 500;
}

.stream-box .stream-box-info .stream-box-text a {
  color: var(--color-text-alt);
  font-weight: 500;
}

.stream-box .stream-box-info .stream-box-category {
  margin-top: 14px;
  font-size: 0.75rem;
  font-weight: 600;
}

.stream-box .stream-box-meta {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 77px;
  border-top: 1px solid var(--color-divider);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-box-background-alt);
  box-shadow: 0 0 40px 0 rgba(94, 92, 154, 0.06);
  position: absolute;
  bottom: -77px;
  left: 0;
  z-index: 9999;
  -webkit-transform: translate(0, -20px);
  transform: translate(0, -20px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out;
  transition: transform .3s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.stream-box:hover {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
}

.stream-box:hover .stream-box-info {
  border-radius: 0;
}

.stream-box:hover .stream-box-meta {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
}

/*------------------------------------------------------------------
[Table of contents]

1. .video-box
2. .video-box-list
-------------------------------------------------------------------*/
/*-------------------
    1. VIDEO BOX
-------------------*/
.video-box {
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
}

.video-box .checkbox-box {
  cursor: pointer;
  position: absolute;
  top: 8px;
  right: 6px;
  z-index: 3;
  transition: none;
}

.video-box .checkbox-box .icon-cross {
  transition: none;
}

.video-box.video-box-cover-only .video-box-cover::after {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.video-box.video-box-cover-only .video-box-cover .video-box-cover-image {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

.video-box.small .video-box-cover:hover .play-button {
  -webkit-transform: translate(0, -20px);
  transform: translate(0, -20px);
}

.video-box.small .video-box-cover:hover .video-box-info .video-box-title,
.video-box.small .video-box-cover:hover .video-box-info .video-box-text {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
}

.video-box.small .video-box-cover::after {
  border-radius: 12px;
}

.video-box.small .video-box-cover .video-box-cover-image {
  height: 128px;
  border-radius: 12px;
}

.video-box.small .video-box-cover .play-button {
  top: 40px;
  transition: -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out;
  transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.video-box.small .video-box-cover .video-box-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: end;
  justify-content: flex-end;
  width: 100%;
  height: 100%;
  padding: 0 16px 14px;
  background-color: transparent;
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 2;
}

.video-box.small .video-box-cover .video-box-info .video-box-title,
.video-box.small .video-box-cover .video-box-info .video-box-text {
  color: #fff;
  -webkit-transform: translate(20px, 0);
  transform: translate(20px, 0);
  opacity: 0;
  visibility: hidden;
  transition: visibility .3s ease-in-out, opacity .3s ease-in-out, -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out, visibility .3s ease-in-out, opacity .3s ease-in-out;
  transition: transform .3s ease-in-out, visibility .3s ease-in-out, opacity .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.video-box.small .video-box-cover .video-box-info .video-box-title {
  font-size: 0.75rem;
}

.video-box.small .video-box-cover .video-box-info .video-box-text {
  margin-top: 4px;
  transition-delay: .15s;
}

.video-box .video-box-cover {
  cursor: pointer;
  position: relative;
}

.video-box .video-box-cover:hover::after {
  opacity: 1;
  visibility: visible;
}

.video-box .video-box-cover::after {
  content: '';
  width: 100%;
  height: 100%;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background-color: rgba(21, 21, 31, 0.6);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out;
}

.video-box .video-box-cover .video-wrap {
  border-radius: 12px;
}

.video-box .video-box-cover .video-wrap video {
  border-radius: 12px;
}

.video-box .video-box-cover .video-box-cover-image {
  height: 160px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.video-box .video-box-cover .play-button {
  position: absolute;
  top: 56px;
  left: 50%;
  margin-left: -23px;
  z-index: 2;
}

.video-box .video-box-info {
  padding: 22px 28px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-box-background);
}

.video-box .video-box-info .video-box-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.video-box .video-box-info .video-box-text {
  margin-top: 6px;
  font-size: 0.75rem;
  font-weight: 500;
}

/*-----------------------
    2. VIDEO BOX LIST
-----------------------*/
.video-box-list .video-box {
  margin-bottom: 22px;
}

.video-box-list .video-box:last-child {
  margin-bottom: 0;
}

/*------------------------------------------------------------------
[Table of contents]

1. .video-status
-------------------------------------------------------------------*/
/*----------------------
    1. VIDEO STATUS
----------------------*/
.video-status {
  display: block;
  border-radius: 12px;
  box-shadow: var(--color-overbox-big-shadow);
}

.video-status.small {
  padding-left: 180px;
  position: relative;
}

.video-status.small .video-status-image {
  width: 180px;
  height: 180px;
  border-top-right-radius: 0;
  border-bottom-left-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
}

.video-status.small .video-status-info {
  height: 180px;
  padding: 26px 28px 22px;
  border-top-right-radius: 12px;
  border-bottom-left-radius: 0;
}

.video-status.small .video-status-info .video-status-title {
  margin-top: 0;
  font-size: 1rem;
}

.video-status.small .video-status-info .video-status-text {
  margin-top: 10px;
}

.video-status.small .video-status-info .video-status-meta {
  margin-top: 22px;
}

.video-status .video-status-image {
  width: 100%;
  height: auto;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.video-status .video-status-image.mobile {
  display: none;
}

.video-status .video-status-info {
  padding: 22px 28px;
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-box-background-alt);
}

.video-status .video-status-info .video-status-meta {
  color: var(--color-text-alt-2);
  font-size: 0.6875rem;
  font-weight: 700;
  text-transform: uppercase;
}

.video-status .video-status-info .video-status-title {
  margin-top: 12px;
  font-size: 1.125rem;
  font-weight: 500;
}

.video-status .video-status-info .video-status-title .bold {
  font-weight: 700;
}

.video-status .video-status-info .video-status-title .highlighted {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.video-status .video-status-info .video-status-text {
  margin-top: 2px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 680px) {
  .video-status.small {
    padding-left: 0;
  }

  .video-status.small .video-status-image {
    display: none;
    width: 100%;
    height: auto;
    border-top-right-radius: 12px;
    border-bottom-left-radius: 0;
    position: static;
  }

  .video-status.small .video-status-image.mobile {
    display: block;
  }

  .video-status.small .video-status-info {
    height: auto;
    padding: 22px 28px;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
    border-top-right-radius: 0;
  }

  .video-status.small .video-status-info .video-status-title {
    margin-top: 12px;
    font-size: 1.125rem;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .content-actions
2. .reaction-item-list
3. .reaction-image
4. .user-avatar-list
-------------------------------------------------------------------*/
/*--------------------------
    1. CONTENT ACTIONS
--------------------------*/
.content-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  height: 52px;
}

.content-actions .content-action {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/*-----------------------------
    2. REACTION ITEM LIST
-----------------------------*/
.reaction-item-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.reaction-item-list.small .reaction-item {
  width: 20px;
  height: 20px;
}

.reaction-item-list.small .reaction-item .reaction-image {
  width: 16px;
  height: 16px;
}

.reaction-item-list .reaction-item-wrap {
  margin-left: -6px;
}

.reaction-item-list .reaction-item-wrap:last-child {
  margin-left: 0;
}

.reaction-item-list .reaction-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: var(--color-box-background);
  margin-left: -6px;
}

.reaction-item-list .reaction-item .simple-dropdown .simple-dropdown-text:first-child {
  margin-bottom: 10px;
}

.reaction-item-list .reaction-item>.reaction-image {
  cursor: pointer;
}

.reaction-item-list .reaction-item:last-child {
  margin-left: 0;
}

/*-------------------------
    3. REACTION IMAGE
-------------------------*/
.reaction-image {
  width: 20px;
  height: 20px;
}

/*---------------------------
    4. USER AVATAR LIST
---------------------------*/
.user-avatar-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
}

.user-avatar-list.reverse {
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.user-avatar-list.reverse.medium .user-avatar:last-child,
.user-avatar-list.reverse.medium .user-avatar-circle:last-child {
  margin-left: -10px;
}

.user-avatar-list.reverse.medium .user-avatar:first-child,
.user-avatar-list.reverse.medium .user-avatar-circle:first-child {
  margin-left: 0;
}

.user-avatar-list.centered {
  -ms-flex-pack: center;
  justify-content: center;
}

.user-avatar-list.medium .user-avatar,
.user-avatar-list.medium .user-avatar-circle {
  margin-left: -10px;
}

.user-avatar-list.medium .user-avatar:last-child,
.user-avatar-list.medium .user-avatar-circle:last-child {
  margin-left: 0;
}

.user-avatar-list .user-avatar,
.user-avatar-list .user-avatar-circle {
  margin-left: -8px;
}

.user-avatar-list .user-avatar .user-avatar-border,
.user-avatar-list .user-avatar-circle .user-avatar-border {
  z-index: 3;
}

.user-avatar-list .user-avatar:last-child,
.user-avatar-list .user-avatar-circle:last-child {
  margin-left: 0;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 479px) {
  .content-actions .user-avatar-list {
    display: none;
  }

  .content-actions .user-avatar-list+.meta-line-text {
    display: none;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .user-preview
-------------------------------------------------------------------*/
/*----------------------
    1. USER PREVIEW
----------------------*/
.user-preview {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.user-preview:not(.landscape) {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.user-preview.fixed-height {
  height: 140px;
}

.user-preview.fixed-height-medium {
  height: 284px;
}

.user-preview.small .user-preview-cover {
  height: 70px;
}

.user-preview.small .user-preview-info .tag-sticker {
  right: 16px;
}

.user-preview.small .user-preview-info .user-short-description .user-short-description-title {
  font-size: 1.125rem;
}

.user-preview.small .user-preview-info .user-short-description .user-short-description-title.small {
  font-size: 0.875rem;
}

.user-preview.small .user-preview-info .user-stats,
.user-preview.small .user-preview-info .social-links {
  margin-top: 36px;
}

.user-preview.small .user-preview-info .no-results-text.no-results-social {
  margin-top: 32px;
}

.user-preview.small .user-preview-info .user-preview-social-links-wrap {
  width: 160px;
  margin: 32px auto 0;
}

.user-preview.small .user-preview-info .user-preview-social-links-wrap .slider-controls {
  width: 208px;
}

.user-preview.landscape {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  min-height: 100px;
  padding-left: 84px;
  position: relative;
}

.user-preview.landscape .user-stats .user-stat {
  padding: 0 24px;
}

.user-preview.landscape .user-preview-cover {
  width: 84px;
  height: 100%;
  border-top-right-radius: 0;
  border-bottom-left-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
}

.user-preview.landscape .user-preview-info {
  width: 100%;
  padding: 0 28px 0 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.user-preview.landscape .user-preview-info .no-results-text {
  width: 184px;
  margin-top: 0;
  line-height: auto;
}

.user-preview.landscape .user-preview-info .no-results-text.no-results-social {
  width: 160px;
  margin-top: 0;
}

.user-preview.landscape .user-preview-info .user-short-description {
  width: 200px;
}

.user-preview.landscape .user-preview-info .user-short-description .vikinger-user-tag,
.user-preview.landscape .user-preview-info .user-short-description .vikinger-pmpro-level-tag {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.user-preview.landscape .user-preview-info .user-short-description+.user-stats {
  margin-top: 0;
}

.user-preview.landscape .user-preview-info .user-avatar-list {
  width: 250px;
}

.user-preview.landscape .user-preview-info .user-avatar-list+.user-preview-actions {
  margin-top: 0;
}

.user-preview.landscape .user-preview-info .user-avatar-list,
.user-preview.landscape .user-preview-info .badge-list,
.user-preview.landscape .user-preview-info .user-preview-actions,
.user-preview.landscape .user-preview-info .social-links {
  margin-top: 0;
}

.user-preview.landscape .user-preview-info .social-links {
  width: 168px;
}

.user-preview.landscape .user-preview-info .badge-list {
  display: -ms-flexbox;
  display: flex;
  width: 184px;
}

.user-preview.landscape .user-preview-info .badge-list .badge-item {
  margin-right: 8px;
}

.user-preview.landscape .user-preview-info .badge-list .badge-item:last-child {
  margin-right: 0;
}

.user-preview.landscape .user-preview-info .vikinger-user-tag-list {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.user-preview.landscape .user-preview-info .user-preview-social-links-wrap {
  width: 160px;
  margin: 0 0 0 8px;
}

.user-preview.landscape .user-preview-info .user-preview-social-links-wrap .slider-controls {
  width: 208px;
}

.user-preview.landscape .user-preview-info .user-preview-actions {
  min-width: 140px;
  min-height: auto;
}

.user-preview.landscape .user-preview-info .user-preview-actions .button,
.user-preview.landscape .user-preview-info .user-preview-actions .tag-sticker {
  margin-right: 12px;
}

.user-preview.landscape .user-preview-info .user-preview-actions .button:last-child,
.user-preview.landscape .user-preview-info .user-preview-actions .tag-sticker:last-child {
  margin-right: 0;
}

.user-preview.landscape .user-preview-info .user-preview-actions .tag-sticker {
  position: static;
}

.user-preview.landscape .user-preview-info .user-preview-actions .button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 44px;
}

.user-preview .user-preview-cover {
  height: 96px;
  border-top-right-radius: 12px;
  border-top-left-radius: 12px;
  position: relative;
}

.user-preview .user-preview-cover .uploadable-item-remove-button {
  position: absolute;
  top: 0;
  right: 0;
}

.user-preview .vikinger-user-tag-list {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.user-preview .vikinger-user-tag-list>* {
  margin-right: 4px;
}

.user-preview .vikinger-user-tag-list>*:last-child {
  margin-right: 0;
}

.user-preview .user-preview-info {
  padding: 0 28px 32px;
  position: relative;
}

.user-preview .user-preview-info .uploadable-item-remove-button {
  position: absolute;
  top: -48px;
  right: 88px;
  z-index: 2;
}

.user-preview .user-preview-info>.tag-sticker {
  position: absolute;
  top: -12px;
  right: 28px;
}

.user-preview .user-preview-info .no-results-text {
  margin-top: 28px;
  line-height: 35px;
}

.user-preview .user-preview-info .no-results-text.no-results-social {
  margin-top: 20px;
  line-height: 36px;
}

.user-preview .user-preview-info .user-short-description.tiny .user-short-description-title {
  font-size: 0.875rem;
}

.user-preview .user-preview-info .user-short-description.tiny .user-short-description-text {
  font-size: 0.75rem;
}

.user-preview .user-preview-info .user-short-description .user-short-description-title {
  font-size: 1.25rem;
}

.user-preview .user-preview-info .user-short-description .user-short-description-text {
  font-size: 0.875rem;
}

.user-preview .user-preview-info .user-short-description+.user-stats {
  margin-top: 30px;
}

.user-preview .user-preview-info .user-short-description+.button {
  margin-top: 34px;
}

.user-preview .user-preview-info .badge-list {
  margin-top: 28px;
}

.user-preview .user-preview-info .user-preview-stats-slides {
  height: 60px;
  margin-top: 30px;
}

.user-preview .user-preview-info .user-preview-stats-roster {
  position: absolute;
  top: 22px;
  right: 28px;
}

.user-preview .user-preview-info .user-preview-text {
  width: 270px;
  margin: -5px auto 0;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

.user-preview .user-preview-info .social-links {
  margin-top: 24px;
  height: 32px;
}

.user-preview .user-preview-info .user-preview-social-links-wrap {
  width: 200px;
  height: 36px;
  margin: 20px auto 0;
  position: relative;
}

.user-preview .user-preview-info .user-preview-social-links-wrap .user-preview-social-links {
  padding-top: 4px;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

.user-preview .user-preview-info .user-preview-social-links-wrap .slider-controls {
  width: 248px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  position: absolute;
  top: 10px;
  left: -28px;
}

.user-preview .user-preview-info .user-avatar-list {
  margin-top: 34px;
  height: 36px;
}

.user-preview .user-preview-info .user-avatar-list+.user-preview-actions {
  margin-top: 36px;
}

.user-preview .user-preview-info .user-preview-actions {
  display: -ms-flexbox;
  display: flex;
  min-height: 48px;
  margin-top: 40px;
}

.user-preview .user-preview-info .user-preview-actions.user-preview-actions-tagged .tag-sticker {
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.user-preview .user-preview-info .user-preview-actions.user-preview-actions-tagged .tag-sticker.button-tag {
  -ms-flex-negative: 1;
  flex-shrink: 1;
}

.user-preview .user-preview-info .user-preview-actions .button-tag,
.user-preview .user-preview-info .user-preview-actions .button {
  width: 100%;
  height: 48px;
  margin-right: 16px;
}

.user-preview .user-preview-info .user-preview-actions .button-tag:last-child,
.user-preview .user-preview-info .user-preview-actions .button:last-child {
  margin-right: 0;
}

.user-preview .user-preview-info .user-preview-actions .button-tag .button-icon,
.user-preview .user-preview-info .user-preview-actions .button .button-icon {
  fill: #fff;
}

.user-preview .user-preview-info .user-preview-actions .button-tag.white .button-icon,
.user-preview .user-preview-info .user-preview-actions .button.white .button-icon {
  fill: var(--color-icon);
}

.user-preview .user-preview-info .user-preview-actions .button-tag.white:hover .button-icon,
.user-preview .user-preview-info .user-preview-actions .button.white:hover .button-icon {
  fill: #fff;
}

.user-preview .user-preview-info .user-preview-actions .button-tag.full,
.user-preview .user-preview-info .user-preview-actions .button.full {
  width: 100%;
}

.user-preview .user-preview-info .user-preview-actions .button-tag.full .button-icon,
.user-preview .user-preview-info .user-preview-actions .button.full .button-icon {
  position: relative;
  left: -12px;
}

.user-preview .user-preview-author {
  padding-left: 26px;
  position: relative;
}

.user-preview .user-preview-author .user-preview-author-image {
  position: absolute;
  top: 1px;
  left: 0;
}

.user-preview .user-preview-author .user-preview-author-title {
  font-size: 0.625rem;
  font-weight: 500;
}

.user-preview .user-preview-author .user-preview-author-text {
  margin-top: 1px;
  font-size: 0.75rem;
  font-weight: 700;
}

.user-preview .user-preview-author .user-preview-author-text a {
  color: var(--color-text);
  font-weight: 700;
}

.user-preview .user-preview-footer {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 65px;
  border-top: 1px solid var(--color-divider);
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
  background-color: var(--color-box-background-alt);
}

.user-preview .user-preview-footer.padded {
  height: auto;
  padding: 16px 28px;
}

.user-preview .user-preview-footer .user-preview-footer-action {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 50%;
  border-right: 1px solid var(--color-divider);
}

.user-preview .user-preview-footer .user-preview-footer-action:last-child {
  border-right: none;
}

.user-preview .user-preview-footer .user-preview-footer-action.full {
  width: 100%;
  padding: 0 28px;
}

.user-preview .user-preview-footer .user-preview-footer-action.full .tag-sticker,
.user-preview .user-preview-footer .user-preview-footer-action.full .button {
  width: 100%;
}

.user-preview .user-preview-footer .user-preview-footer-action .button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 64px;
  height: 44px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .user-preview.landscape .user-preview-info .badge-list {
    display: none;
  }

  .user-preview.landscape .user-preview-info .no-results-text {
    display: none;
  }

  .user-preview.landscape .user-preview-info .no-results-text.no-results-social {
    display: block;
  }
}

@media screen and (max-width: 1260px) {

  .user-preview.landscape .user-preview-info .social-links,
  .user-preview.landscape .user-preview-info .user-preview-social-links-wrap,
  .user-preview.landscape .user-preview-info .user-avatar-list {
    display: none;
  }

  .user-preview.landscape .user-preview-info .no-results-text.no-results-social {
    display: none;
  }
}

@media screen and (max-width: 960px) {
  .user-preview.landscape .user-preview-info .user-stats {
    display: none;
  }
}

@media screen and (max-width: 460px) {
  .user-preview.landscape {
    padding-left: 60px;
  }

  .user-preview.landscape .user-preview-cover {
    width: 60px;
  }

  .user-preview.landscape .user-preview-info {
    height: 100px;
    padding: 0 68px 0 0;
  }

  .user-preview.landscape .user-preview-info .user-short-description {
    width: auto;
  }

  .user-preview.landscape .user-preview-info .user-preview-actions {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    position: absolute;
    top: 8px;
    right: 12px;
  }

  .user-preview.landscape .user-preview-info .user-preview-actions .button,
  .user-preview.landscape .user-preview-info .user-preview-actions .tag-sticker {
    width: 44px;
    height: 40px;
    margin: 0 0 4px 0;
  }

  .user-preview.landscape .user-preview-info .user-preview-actions .button:last-child,
  .user-preview.landscape .user-preview-info .user-preview-actions .tag-sticker:last-child {
    margin-bottom: 0;
  }

  .user-preview .user-preview-info .user-preview-stats-slides {
    height: 70px;
  }

  .user-preview .user-preview-info .user-preview-text {
    width: 95%;
  }

  .user-preview-widget .user-preview-widget-footer {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    height: 60px;
    padding-top: 20px;
  }

  .user-preview-widget .user-preview-widget-footer .user-preview-widget-footer-action {
    position: static;
  }

  .user-preview-widget .user-preview-widget-footer .user-preview-widget-footer-action:first-child {
    display: none;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .album-preview
2. .photo-preview
-------------------------------------------------------------------*/
/*----------------------
    1. ALBUM PREVIEW
----------------------*/
.album-preview {
  display: block;
  height: 340px;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
  cursor: pointer;
  position: relative;
}

.album-preview .album-preview-image {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.album-preview .text-sticker {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 3;
  pointer-events: none;
}

.album-preview .album-preview-info {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  box-shadow: inset 0 -120px 50px -40px rgba(0, 0, 0, 0.8);
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 0 28px 26px;
  position: relative;
  z-index: 2;
  transition: box-shadow .2s ease-in-out;
}

.album-preview .album-preview-info:hover {
  box-shadow: inset 0 -120px 50px -40px rgba(35, 210, 226, 0.9);
}

.album-preview .album-preview-info .album-preview-title,
.album-preview .album-preview-info .album-preview-text {
  color: #fff;
}

.album-preview .album-preview-info .album-preview-title {
  font-size: 1rem;
  font-weight: 700;
}

.album-preview .album-preview-info .album-preview-text {
  margin-top: 6px;
  font-size: 0.875rem;
  font-weight: 500;
}

/*----------------------
    2. PHOTO PREVIEW
----------------------*/
.photo-preview {
  display: block;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
  cursor: pointer;
  position: relative;
}

.photo-preview.small {
  height: 184px;
}

.photo-preview:hover .photo-preview-info {
  opacity: 1;
  visibility: visible;
}

.photo-preview:hover .photo-preview-info .reaction-count-list .reaction-count {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.photo-preview .photo-preview-image {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.photo-preview .checkbox-box {
  position: absolute;
  top: 8px;
  right: 6px;
  z-index: 3;
  transition: none;
}

.photo-preview .checkbox-box .icon-cross {
  transition: none;
}

.photo-preview .photo-preview-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  background-color: rgba(21, 21, 31, 0.96);
  position: relative;
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease-in-out, visibility .2s ease-in-out;
}

.photo-preview .photo-preview-info .reaction-count-list .reaction-count {
  -webkit-transform: scale(0);
  transform: scale(0);
  transition: -webkit-transform .2s ease-in-out;
  transition: transform .2s ease-in-out;
  transition: transform .2s ease-in-out, -webkit-transform .2s ease-in-out;
}

.photo-preview .photo-preview-info .reaction-count-list .reaction-count:first-child {
  transition-delay: .1s;
}

.photo-preview .photo-preview-info .reaction-count-list .reaction-count:last-child {
  transition-delay: .2s;
}

/*------------------------------------------------------------------
[Table of contents]

1. .popup-box
-------------------------------------------------------------------*/
/*--------------------
    1. POPUP BOX
--------------------*/
.popup-box {
  width: 90%;
  max-width: 984px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  opacity: 0;
  visibility: hidden;
}

.popup-box.mid {
  max-width: 784px;
}

.popup-box.small {
  max-width: 384px;
}

.popup-box .popup-box-title {
  padding: 32px 28px 0;
  font-size: 1rem;
  font-weight: 700;
}

.popup-box .popup-box-subtitle {
  padding: 0 28px;
  margin-top: 6px;
  font-size: 0.875rem;
  font-weight: 700;
}

.popup-box .popup-box-subtitle .light {
  color: var(--color-text-alt);
  font-weight: 500;
}

.popup-box .form {
  margin-top: 32px;
}

.popup-box .form .form-row {
  padding: 0 28px;
}

.popup-box .form .form-uploadables {
  margin-top: 32px;
  padding: 0 28px 40px;
  height: 406px;
  overflow-y: auto;
}

.popup-box .widget-box .form .form-row {
  padding: 0;
}

.popup-box .popup-box-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: end;
  justify-content: flex-end;
  padding: 32px 38px;
  box-shadow: var(--color-box-shadow);
}

.popup-box .popup-box-actions.void {
  box-shadow: none;
}

.popup-box .popup-box-actions.medium {
  padding: 40px 28px;
}

.popup-box .popup-box-actions.full {
  display: block;
  padding: 40px 28px 28px;
}

.popup-box .popup-box-actions .popup-box-action-text {
  margin-top: 24px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.popup-box .popup-box-actions .popup-box-action {
  width: 180px;
  margin-right: 16px;
}

.popup-box .popup-box-actions .popup-box-action.full {
  width: 100%;
}

.popup-box .popup-box-actions .popup-box-action:last-child {
  margin-right: 0;
}

.popup-box-body {
  display: -ms-flexbox;
  display: flex;
  border-radius: 12px;
  background-color: var(--color-box-background);
}

.popup-box-body>.page-loader-indicator {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin: 0 auto;
}

.popup-box-body .popup-box-sidebar {
  width: 36.2244897959%;
  border-right: 1px solid var(--color-divider);
}

.popup-box-body .popup-box-sidebar .sidebar-menu-item.limited {
  max-height: 260px;
  overflow: hidden auto;
}

.popup-box-body .popup-box-sidebar .popup-box-sidebar-footer {
  padding: 28px;
}

.popup-box-body .popup-box-sidebar .popup-box-sidebar-footer .button {
  margin-bottom: 16px;
}

.popup-box-body .popup-box-sidebar .popup-box-sidebar-footer .button:last-child {
  margin-bottom: 0;
}

.popup-box-body .popup-box-sidebar .popup-box-sidebar-footer .required-field-message {
  margin-bottom: 16px;
  text-align: center;
}

.popup-box-body .popup-box-sidebar .user-preview {
  box-shadow: none;
  border-top-right-radius: 0;
}

.popup-box-body .popup-box-sidebar .user-preview .user-preview-cover {
  border-top-right-radius: 0;
}

.popup-box-body .popup-box-sidebar .product-preview {
  box-shadow: none;
  border-top-right-radius: 0;
}

.popup-box-body .popup-box-sidebar .product-preview .product-preview-image {
  border-top-right-radius: 0;
}

.popup-box-body .popup-box-content {
  width: 63.7755102041%;
  border-bottom-right-radius: 12px;
}

.popup-box-body .popup-box-content.limited {
  max-height: 620px;
  overflow: hidden auto;
}

.popup-box-body .popup-box-content .widget-box {
  box-shadow: none;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 680px) {
  .popup-box-body {
    display: block;
  }

  .popup-box-body .popup-box-sidebar,
  .popup-box-body .popup-box-content {
    width: 100%;
  }

  .popup-box-body .popup-box-sidebar {
    border-right: none;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .badge-item-preview
-------------------------------------------------------------------*/
/*----------------------------
    1. BADGE ITEM PREVIEW
----------------------------*/
.badge-item-preview {
  display: -ms-flexbox;
  display: flex;
  height: 154px;
  padding: 32px 28px 0;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.badge-item-preview .badge-item-preview-image {
  width: 82px;
  height: 90px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.badge-item-preview .badge-item-preview-info {
  padding-left: 24px;
}

.badge-item-preview .badge-item-preview-info .badge-item-preview-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.badge-item-preview .badge-item-preview-info .badge-item-preview-text {
  margin-top: 8px;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.badge-item-preview .badge-item-preview-info .badge-item-preview-timestamp {
  margin-top: 14px;
  color: var(--color-text-alt-2);
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 460px) {
  .badge-item-preview {
    height: auto;
    padding-bottom: 32px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .badge-item-stat
-------------------------------------------------------------------*/
/*--------------------------
    1. BADGE ITEM STAT
--------------------------*/
.badge-item-stat {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.badge-item-stat.void {
  padding: 20px 0 0;
  box-shadow: none;
}

.badge-item-stat .text-sticker {
  position: absolute;
  top: 10px;
  right: -6px;
}

.badge-item-stat .badge-item-stat-image-preview {
  position: absolute;
  top: 32px;
  left: 28px;
}

.badge-item-stat .badge-item-stat-image {
  display: block;
  margin: 0 auto;
}

.badge-item-stat .badge-item-stat-title {
  margin-top: 36px;
  font-size: 1.125rem;
  font-weight: 700;
  text-align: center;
}

.badge-item-stat .badge-item-stat-text {
  width: 180px;
  margin: 16px auto 0;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
  text-align: center;
}

.badge-item-stat .progress-stat {
  max-width: 204px;
  margin: 54px auto 0;
}

/*------------------------------------------------------------------
[Table of contents]

1. .streamer-box
-------------------------------------------------------------------*/
/*----------------------
    1. STREAMER BOX
----------------------*/
.streamer-box {
  background-color: var(--color-box-background);
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
}

.streamer-box.small .streamer-box-cover {
  height: 48px;
}

.streamer-box.small .streamer-box-info .streamer-box-image {
  top: -26px;
}

.streamer-box.small .streamer-box-info .streamer-box-title {
  font-size: 1rem;
}

.streamer-box.small .streamer-box-info .button {
  margin-top: 28px;
}

.streamer-box.small .streamer-box-info .button+.button {
  margin-top: 12px;
}

.streamer-box .streamer-box-cover {
  width: 100%;
  height: 70px;
  border-top-right-radius: 12px;
  border-top-left-radius: 12px;
}

.streamer-box .streamer-box-info {
  padding: 50px 28px 32px;
  text-align: center;
  position: relative;
}

.streamer-box .streamer-box-info .streamer-box-image {
  width: 72px;
  height: 72px;
  border: 6px solid var(--color-box-background);
  border-radius: 50%;
  position: absolute;
  top: -30px;
  left: 50%;
  margin-left: -36px;
}

.streamer-box .streamer-box-info .streamer-box-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.streamer-box .streamer-box-info .streamer-box-text {
  margin-top: 4px;
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 500;
}

.streamer-box .streamer-box-info .streamer-box-status {
  margin-top: 10px;
  display: inline-block;
  height: 18px;
  padding: 0 6px;
  border-radius: 4px;
  background-color: var(--color-text-alt-2);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 18px;
  text-transform: uppercase;
}

.streamer-box .streamer-box-info .streamer-box-status.active {
  background-color: #f1315e;
}

.streamer-box .streamer-box-info .user-stats {
  margin-top: 38px;
}

.streamer-box .streamer-box-info .button {
  margin-top: 40px;
  width: 100%;
}

/*------------------------------------------------------------------
[Table of contents]

1. .calendar
2. .calendar-weekly
3. .calendar-daily
4. .calendar-events-preview
5. .calendar-event-preview-list
6. .calendar-event-preview
7. .calendar-widget
-------------------------------------------------------------------*/
/*--------------------
    1. CALENDAR
--------------------*/
.calendar {
  background-color: var(--color-box-background);
}

.calendar.small {
  max-width: 215px;
}

.calendar.small .calendar-week {
  border: none;
}

.calendar.small .calendar-week .calendar-week-day {
  padding: 16px 0;
  font-size: 0.75rem;
}

.calendar.small .calendar-week .calendar-week-day .week-day-short {
  display: block;
}

.calendar.small .calendar-week .calendar-week-day .week-day-long {
  display: none;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 44px;
  padding: 0;
  border: none;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day.inactive {
  background-color: var(--color-box-background);
}

.calendar.small .calendar-days .calendar-day-row .calendar-day.current .calendar-day-number,
.calendar.small .calendar-days .calendar-day-row .calendar-day.active .calendar-day-number {
  width: 24px;
  height: 24px;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day .calendar-day-number {
  font-size: 0.75rem;
  position: static;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day .calendar-day-events {
  position: absolute;
  bottom: 2px;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event {
  display: block;
  margin: 0 2px 0 0;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event:last-child {
  margin: 0;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day .calendar-day-event {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  padding: 0;
}

.calendar.small .calendar-days .calendar-day-row .calendar-day .calendar-day-event .calendar-day-event-text {
  display: none;
}

.calendar .calendar-week {
  display: -ms-flexbox;
  display: flex;
  border-bottom: 1px solid var(--color-divider);
}

.calendar .calendar-week .calendar-week-day {
  width: 14.2857142857%;
  padding: 28px 0;
  color: var(--color-text-alt);
  font-size: 1rem;
  font-weight: 500;
  text-align: center;
}

.calendar .calendar-week .calendar-week-day .week-day-short {
  display: none;
}

.calendar .calendar-days .calendar-day-row {
  display: -ms-flexbox;
  display: flex;
}

.calendar .calendar-days .calendar-day-row .calendar-day {
  width: 14.2857142857%;
  height: 120px;
  padding: 52px 12px 0 16px;
  border-right: 1px solid var(--color-divider);
  border-bottom: 1px solid var(--color-divider);
  position: relative;
}

.calendar .calendar-days .calendar-day-row .calendar-day:last-child {
  border-right: none;
}

.calendar .calendar-days .calendar-day-row .calendar-day.inactive {
  background-color: var(--color-box-background-alt);
}

.calendar .calendar-days .calendar-day-row .calendar-day.inactive .calendar-day-number {
  color: var(--color-text-alt);
  font-weight: 500;
}

.calendar .calendar-days .calendar-day-row .calendar-day.current .calendar-day-number,
.calendar .calendar-days .calendar-day-row .calendar-day.active .calendar-day-number {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  top: 8px;
  left: 10px;
}

.calendar .calendar-days .calendar-day-row .calendar-day.current .calendar-day-number {
  box-shadow: 3px 5px 20px 0px rgba(94, 92, 154, 0.16);
}

.calendar .calendar-days .calendar-day-row .calendar-day.active .calendar-day-number {
  background-color: var(--color-secondary);
  color: #fff;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-number {
  font-size: 1rem;
  font-weight: 700;
  position: absolute;
  top: 20px;
  left: 18px;
  z-index: 1;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-events {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event {
  display: none;
  margin-bottom: 6px;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event:nth-child(1),
.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event:nth-child(2) {
  display: block;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event:last-child {
  margin-bottom: 0;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-event {
  border-radius: 200px;
  padding: 6px 12px;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-event.primary {
  background-color: var(--color-primary);
}

.calendar .calendar-days .calendar-day-row .calendar-day .calendar-day-event.secondary {
  background-color: var(--color-secondary);
}

/*-------------------------
    2. CALENDAR WEEKLY
-------------------------*/
.calendar-weekly {
  background-color: var(--color-box-background);
}

.calendar-weekly .calendar-weekly-week {
  display: -ms-flexbox;
  display: flex;
  padding-left: 56px;
}

.calendar-weekly .calendar-weekly-week-day {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 14.2857142857%;
  padding: 28px 0;
}

.calendar-weekly .calendar-weekly-week-day.active .calendar-weekly-week-day-number {
  color: var(--color-secondary);
  font-weight: 700;
}

.calendar-weekly .calendar-weekly-week-day .calendar-weekly-week-day-text {
  color: var(--color-text-alt);
  font-size: 1rem;
  font-weight: 500;
}

.calendar-weekly .calendar-weekly-week-day .calendar-weekly-week-day-number {
  margin-top: 8px;
  font-size: 1.25rem;
  font-weight: 500;
}

.calendar-weekly .calendar-weekly-body-wrap {
  height: 640px;
  overflow-y: auto;
}

.calendar-weekly .calendar-weekly-body {
  padding: 6px 0 0 56px;
  position: relative;
}

.calendar-weekly .calendar-weekly-hours {
  position: absolute;
  top: 0;
  left: 0;
}

.calendar-weekly .calendar-weekly-hours .calendar-weekly-hour {
  height: 120px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.calendar-weekly .calendar-weekly-days {
  display: -ms-flexbox;
  display: flex;
}

.calendar-weekly .calendar-weekly-day-column {
  width: 14.2857142857%;
}

.calendar-weekly .calendar-weekly-day-column.active .calendar-weekly-day-interval {
  background-color: var(--color-box-background-alt);
}

.calendar-weekly .calendar-weekly-day-column:last-child .calendar-weekly-day-interval {
  border-right: none;
}

.calendar-weekly .calendar-weekly-day-interval {
  width: 100%;
  height: 120px;
  border-top: 1px solid var(--color-divider);
  border-right: 1px solid var(--color-divider);
}

.calendar-weekly .calendar-weekly-day-interval:last-child {
  border-bottom: 1px solid var(--color-divider);
}

.calendar-weekly .calendar-weekly-day-part {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  height: 50%;
  padding: 0 10px;
  border-bottom: 1px solid rgba(234, 234, 245, 0.5);
}

.calendar-weekly .calendar-weekly-day-part:last-child {
  border-bottom: none;
}

.calendar-weekly .calendar-weekly-day-part .calendar-weekly-day-event {
  border-radius: 200px;
  padding: 6px 12px;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.calendar-weekly .calendar-weekly-day-part .calendar-weekly-day-event.span-3 {
  width: 100%;
  height: 180px;
  border-radius: 12px;
  position: relative;
  z-index: 1;
}

.calendar-weekly .calendar-weekly-day-part .calendar-weekly-day-event.primary {
  background-color: var(--color-primary);
}

.calendar-weekly .calendar-weekly-day-part .calendar-weekly-day-event.secondary {
  background-color: var(--color-secondary);
}

/*-------------------------
    3. CALENDAR DAILY
-------------------------*/
.calendar-daily {
  background-color: var(--color-box-background);
}

.calendar-daily .calendar-daily-body-wrap {
  height: 640px;
  overflow-y: auto;
}

.calendar-daily .calendar-daily-body {
  padding: 6px 0 0 56px;
  position: relative;
}

.calendar-daily .calendar-daily-hours {
  position: absolute;
  top: 0;
  left: 0;
}

.calendar-daily .calendar-daily-hours .calendar-daily-hour {
  height: 120px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.calendar-daily .calendar-daily-interval {
  width: 100%;
  height: 120px;
  border-top: 1px solid var(--color-divider);
}

.calendar-daily .calendar-daily-interval:last-child {
  border-bottom: 1px solid var(--color-divider);
}

.calendar-daily .calendar-daily-interval-part {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: start;
  align-items: flex-start;
  width: 100%;
  height: 50%;
  border-bottom: 1px solid rgba(234, 234, 245, 0.5);
}

.calendar-daily .calendar-daily-interval-part:last-child {
  border-bottom: none;
}

.calendar-daily .calendar-daily-event {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  padding: 12px 14px;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.calendar-daily .calendar-daily-event.span-3 {
  height: 180px;
  position: relative;
  z-index: 1;
}

.calendar-daily .calendar-daily-event.primary {
  background-color: var(--color-primary);
}

.calendar-daily .calendar-daily-event.secondary {
  background-color: var(--color-secondary);
}

/*--------------------------------
    4. CALENDAR EVENTS PREVIEW
---------------------------------*/
.calendar-events-preview {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.calendar-events-preview.small .calendar-events-preview-title {
  font-size: 0.875rem;
}

.calendar-events-preview.small .calendar-event-preview-list {
  margin-top: 36px;
}

.calendar-events-preview .calendar-events-preview-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.calendar-events-preview .calendar-event-preview-list {
  margin-top: 48px;
}

/*-------------------------------------
    5. CALENDAR EVENT PREVIEW LIST
-------------------------------------*/
.calendar-event-preview-list .calendar-event-preview {
  margin-bottom: 28px;
}

.calendar-event-preview-list .calendar-event-preview:last-child {
  margin-bottom: 0;
}

/*--------------------------------
    6. CALENDAR EVENT PREVIEW
---------------------------------*/
.calendar-event-preview {
  padding-left: 72px;
  position: relative;
}

.calendar-event-preview.small .calendar-event-preview-start-time .calendar-event-preview-start-time-title {
  font-size: 0.875rem;
}

.calendar-event-preview.small .calendar-event-preview-start-time .calendar-event-preview-start-time-text {
  margin-top: 4px;
  font-size: 0.75rem;
}

.calendar-event-preview.small .calendar-event-preview-info::before {
  content: '';
  width: 8px;
  height: 8px;
  border: 2px solid transparent;
  top: 2px;
}

.calendar-event-preview.small .calendar-event-preview-info .calendar-event-preview-title {
  font-size: 0.875rem;
}

.calendar-event-preview.small .calendar-event-preview-info .calendar-event-preview-text {
  font-size: 0.75rem;
  line-height: 1.1666666667em;
}

.calendar-event-preview.primary .calendar-event-preview-info::before {
  border-color: var(--color-primary);
}

.calendar-event-preview.secondary .calendar-event-preview-info::before {
  border-color: var(--color-secondary);
}

.calendar-event-preview .calendar-event-preview-start-time {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.calendar-event-preview .calendar-event-preview-start-time .calendar-event-preview-start-time-title {
  font-size: 1rem;
  font-weight: 700;
}

.calendar-event-preview .calendar-event-preview-start-time .calendar-event-preview-start-time-text {
  margin-top: 2px;
  font-size: 0.875rem;
  font-weight: 500;
}

.calendar-event-preview .calendar-event-preview-info {
  position: relative;
}

.calendar-event-preview .calendar-event-preview-info::before {
  content: '';
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 3px solid transparent;
  position: absolute;
  top: 0;
  left: -24px;
}

.calendar-event-preview .calendar-event-preview-info .calendar-event-preview-title {
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
}

.calendar-event-preview .calendar-event-preview-info .calendar-event-preview-text {
  margin-top: 6px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.calendar-event-preview .calendar-event-preview-info .calendar-event-preview-time {
  margin-top: 14px;
  font-size: 0.875rem;
  font-weight: 500;
}

.calendar-event-preview .calendar-event-preview-info .calendar-event-preview-time .bold {
  font-weight: 700;
}

/*------------------------
    7. CALENDAR WIDGET
------------------------*/
.calendar-widget {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.calendar-widget .calendar-widget-header {
  padding: 28px 28px 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.calendar-widget .calendar-widget-header .calendar-widget-header-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.calendar-widget .calendar-widget-header .calendar-widget-header-actions .slider-controls {
  margin-right: 25px;
}

.calendar-widget .calendar-widget-title {
  font-size: 1.25rem;
  font-weight: 700;
}

.calendar-widget .slider-controls {
  display: -ms-flexbox;
  display: flex;
}

.calendar-widget .slider-controls .slider-control {
  margin-right: 18px;
}

.calendar-widget .slider-controls .slider-control:last-child {
  margin-right: 0;
}

.calendar-widget .calendar,
.calendar-widget .calendar-weekly {
  margin-top: 26px;
  padding: 0 28px;
}

.calendar-widget .calendar-daily {
  margin-top: 60px;
  padding: 0 28px;
}

.calendar-widget .calendar-events-preview {
  margin-top: 60px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 680px) {
  .calendar.full .calendar-week {
    border: none;
  }

  .calendar.full .calendar-week .calendar-week-day {
    padding: 16px 0;
    font-size: 0.75rem;
  }

  .calendar.full .calendar-week .calendar-week-day .week-day-short {
    display: block;
  }

  .calendar.full .calendar-week .calendar-week-day .week-day-long {
    display: none;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    height: 44px;
    padding: 0;
    border: none;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day.inactive {
    background-color: #fff;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day.current .calendar-day-number,
  .calendar.full .calendar-days .calendar-day-row .calendar-day.active .calendar-day-number {
    width: 24px;
    height: 24px;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day .calendar-day-number {
    font-size: 0.75rem;
    position: static;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day .calendar-day-events {
    -ms-flex-direction: row;
    flex-direction: row;
    position: absolute;
    bottom: 2px;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event {
    display: block;
    margin: 0 2px 0 0;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day .calendar-day-events .calendar-day-event:last-child {
    margin: 0;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day .calendar-day-event {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    padding: 0;
  }

  .calendar.full .calendar-days .calendar-day-row .calendar-day .calendar-day-event .calendar-day-event-text {
    display: none;
  }
}

@media screen and (max-width: 460px) {
  .calendar-widget .calendar-widget-header {
    display: block;
  }

  .calendar-widget .calendar-widget-header .calendar-widget-header-actions {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .calendar-widget .calendar-widget-header .calendar-widget-header-actions:first-child {
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .calendar-widget .calendar-widget-header .calendar-widget-header-actions:first-child .slider-controls {
    -ms-flex-order: 2;
    order: 2;
    margin: 12px 0 0;
  }

  .calendar-widget .calendar-widget-header .calendar-widget-header-actions:last-child {
    margin-top: 18px;
  }

  .calendar-widget .calendar-widget-title {
    font-size: 1rem;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .event-preview-list
2. .event-preview
-------------------------------------------------------------------*/
/*----------------------------
    1. EVENT PREVIEW LIST
----------------------------*/
.event-preview-list .event-preview {
  margin-bottom: 32px;
}

.event-preview-list .event-preview:last-child {
  margin-bottom: 0;
}

/*------------------------
    2. EVENT PREVIEW
------------------------*/
.event-preview {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.event-preview.small {
  box-shadow: none;
}

.event-preview.small .event-preview-cover {
  height: 80px;
  border-radius: 12px;
}

.event-preview.small .event-preview-info {
  display: block;
  height: auto;
  padding: 20px 0 0 42px;
}

.event-preview.small .event-preview-info .date-sticker {
  width: 30px;
  top: 22px;
  left: 0;
}

.event-preview.small .event-preview-info .date-sticker .date-sticker-day {
  padding: 6px 0 2px;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  font-size: 1rem;
}

.event-preview.small .event-preview-info .date-sticker .date-sticker-month {
  padding: 2px 0;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  font-size: 0.625rem;
}

.event-preview.small .event-preview-title {
  font-size: 0.875rem;
}

.event-preview.small .event-preview-text {
  margin-top: 12px;
  font-size: 0.75rem;
  line-height: 1.1666666667em;
}

.event-preview.small .event-preview-timestamp {
  margin-top: 6px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
}

.event-preview .event-preview-cover {
  width: 100%;
  height: 98px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.event-preview .event-preview-info {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  justify-content: space-between;
  height: 385px;
  padding: 40px 28px 32px;
  position: relative;
}

.event-preview .event-preview-info .date-sticker {
  position: absolute;
  top: -42px;
  left: 28px;
}

.event-preview .event-preview-title {
  font-size: 1rem;
  font-weight: 700;
  cursor: pointer;
}

.event-preview .event-preview-timestamp {
  margin-top: 10px;
  font-size: 0.875rem;
  font-weight: 500;
}

.event-preview .event-preview-timestamp .bold {
  font-weight: 700;
}

.event-preview .event-preview-text {
  margin-top: 20px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.event-preview .meta-line {
  margin-top: 26px;
}

.event-preview .button {
  width: 100%;
  margin-top: 38px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .achievement-preview-list
2. .achievement-preview
-------------------------------------------------------------------*/
/*----------------------------
    1. ACHIEVEMENT PREVIEW LIST
----------------------------*/
.achievement-preview-list .achievement-preview {
  margin-bottom: 28px;
}

.achievement-preview-list .achievement-preview:last-child {
  margin-bottom: 0;
}

/*-----------------------
    2. ACHIEVEMENT PREVIEW
-----------------------*/
.achievement-preview .achievement-preview-info {
  padding: 2px 8px 0 44px;
  position: relative;
}

.achievement-preview .achievement-preview-info .achievement-preview-image {
  width: 32px;
  height: auto;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.achievement-preview .achievement-preview-info .achievement-preview-title {
  font-size: 0.875rem;
  font-weight: 700;
}

.achievement-preview .achievement-preview-info .achievement-preview-text {
  margin-top: 4px;
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 500;
  line-height: 1.3333333333em;
}

.achievement-preview .progress-stat {
  margin-top: 16px;
}

/*------------------------------------------------------------------
[Table of contents]

1. .quest-item
-------------------------------------------------------------------*/
/*---------------------
    1. QUEST ITEM
---------------------*/
.quest-item {
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.quest-item .quest-item-cover {
  width: 100%;
  height: 120px;
  border-top-right-radius: 12px;
  border-top-left-radius: 12px;
}

.quest-item .text-sticker {
  position: absolute;
  top: 10px;
  right: -6px;
}

.quest-item .quest-item-info {
  padding: 44px 28px 0;
  position: relative;
}

.quest-item .quest-item-badge {
  border: 6px solid var(--color-box-background);
  border-radius: 50%;
  position: absolute;
  top: -28px;
  left: 22px;
}

.quest-item .quest-item-title {
  font-size: 1.125rem;
  font-weight: 700;
}

.quest-item .quest-item-text {
  margin-top: 18px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.4285714286em;
}

.quest-item .progress-stat {
  max-width: 228px;
  margin-top: 48px;
}

.quest-item .quest-item-meta {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 22px;
  padding: 14px 0;
  border-top: 1px solid var(--color-divider);
}

.quest-item .quest-item-meta .quest-item-meta-info {
  margin-left: 10px;
}

.quest-item .quest-item-meta .quest-item-meta-title {
  font-size: 0.75rem;
  font-weight: 700;
}

.quest-item .quest-item-meta .quest-item-meta-text {
  color: var(--color-text);
  font-size: 0.625rem;
  font-weight: 500;
}

/*------------------------------------------------------------------
[Table of contents]

1. .forum-post-header
2. .forum-post-list
3. .forum-post
-------------------------------------------------------------------*/
/*---------------------------
    1. FORUM POST HEADER
---------------------------*/
.forum-post-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 40px;
}

.forum-post-header .forum-post-header-title {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
}

.forum-post-header .forum-post-header-title:first-child {
  width: 184px;
  padding-left: 28px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.forum-post-header .forum-post-header-title:last-child {
  width: 79.185520362%;
}

/*------------------------
    2. FORUM POST LIST
------------------------*/
.forum-post-list {
  box-shadow: var(--color-box-shadow);
}

.forum-post-list .forum-post {
  box-shadow: none;
}

.forum-post-list .forum-post:first-child {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.forum-post-list .forum-post:first-child .forum-post-meta {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
}

.forum-post-list .forum-post:last-child {
  border-bottom-left-radius: 12px;
  border-bottom-right-radius: 12px;
}

/*--------------------
    3. FORUM POST
--------------------*/
.forum-post {
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.forum-post .forum-post-meta {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  min-height: 56px;
  padding: 0 28px;
  background-color: var(--color-box-background-alt);
}

.forum-post .forum-post-timestamp {
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.forum-post .forum-post-actions {
  display: -ms-flexbox;
  display: flex;
}

.forum-post .forum-post-actions .forum-post-action {
  margin-right: 32px;
}

.forum-post .forum-post-actions .forum-post-action:last-child {
  margin-right: 0;
}

.forum-post .forum-post-action {
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
}

.forum-post .forum-post-action:hover {
  color: var(--color-primary-dark);
}

.forum-post .forum-post-action.light {
  color: var(--color-text-alt-2);
}

.forum-post .forum-post-action.light:hover {
  color: var(--color-text);
}

.forum-post .forum-post-content {
  display: -ms-flexbox;
  display: flex;
  min-height: 234px;
}

.forum-post .forum-post-content .forum-post-user {
  width: 184px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.forum-post .forum-post-content .forum-post-info {
  width: 79.185520362%;
}

.forum-post .forum-post-user {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  padding-top: 28px;
}

.forum-post .forum-post-user .user-avatar.small,
.forum-post .forum-post-user .user-avatar-circle.small {
  display: none;
}

.forum-post .forum-post-user .forum-post-user-title {
  margin-top: 8px;
  font-size: 0.875rem;
  font-weight: 700;
}

.forum-post .forum-post-user .forum-post-user-title a {
  color: var(--color-text);
  font-weight: 700;
}

.forum-post .forum-post-user .forum-post-user-text {
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

.forum-post .forum-post-user .forum-post-user-text a {
  color: var(--color-text-alt);
  font-weight: 500;
}

.forum-post .forum-post-user .forum-post-user-text a:hover {
  color: var(--color-primary-dark);
}

.forum-post .forum-post-user .forum-post-user-tag {
  height: 20px;
  margin-top: 12px;
  padding: 0 8px;
  border-radius: 200px;
  background-color: var(--color-secondary-dark);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 20px;
  text-transform: uppercase;
}

.forum-post .forum-post-user .forum-post-user-tag.organizer {
  background-color: var(--color-secondary);
}

.forum-post .forum-post-info {
  padding: 32px 28px 32px 0;
}

.forum-post .forum-post-info .forum-post-paragraph {
  margin-top: 24px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.forum-post .forum-post-info .forum-post-paragraph:first-child {
  margin-top: 0;
}

.forum-post .forum-post-info .forum-post-paragraph .bold {
  font-weight: 700;
}

.forum-post .forum-post-info .forum-post-image {
  margin-top: 24px;
  width: 75%;
  height: auto;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 460px) {
  .forum-post-header {
    display: none;
  }

  .forum-post .forum-post-content {
    display: block;
  }

  .forum-post .forum-post-content .forum-post-user,
  .forum-post .forum-post-content .forum-post-info {
    width: 100%;
  }

  .forum-post .forum-post-actions .forum-post-action {
    margin-right: 16px;
  }

  .forum-post .forum-post-actions .forum-post-action:last-child {
    margin-right: 0;
  }

  .forum-post .forum-post-user {
    -ms-flex-align: start;
    align-items: flex-start;
    padding-left: 28px;
  }

  .forum-post .forum-post-user .user-avatar,
  .forum-post .forum-post-user .user-avatar-circle {
    display: none;
  }

  .forum-post .forum-post-user .user-avatar.small,
  .forum-post .forum-post-user .user-avatar-circle.small {
    display: block;
  }

  .forum-post .forum-post-info {
    padding-left: 28px;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .slider-panel
2. .roster-pictures
3. .roster-picture
-------------------------------------------------------------------*/
/*----------------------
    1. SLIDER PANEL
----------------------*/
.slider-panel .slider-panel-slide {
  width: 100%;
  padding-top: 56.25%;
  position: relative;
}

.slider-panel .slider-panel-slide-image {
  width: 100%;
  height: 100%;
  border-radius: 12px;
  position: absolute;
  top: 0;
  left: 0;
}

.slider-panel .slider-panel-roster {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 100px;
  margin-top: 16px;
  padding: 0 46px 0 74px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.slider-panel .slider-panel-roster .slider-controls {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 0 12px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.slider-panel .slider-panel-roster .slider-controls::before,
.slider-panel .slider-panel-roster .slider-controls::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 40px;
}

.slider-panel .slider-panel-roster .slider-controls::before {
  left: 46px;
}

.slider-panel .slider-panel-roster .slider-controls::after {
  display: none;
  right: 46px;
}

.slider-panel .slider-panel-roster .button {
  width: 180px;
  margin-right: 28px;
  position: relative;
  z-index: 2;
}

.slider-panel .slider-panel-roster .roster-pictures {
  position: relative;
  z-index: 2;
}

/*------------------------
    2. ROSTER PICTURES
------------------------*/
.roster-pictures {
  display: -ms-flexbox;
  display: flex;
  padding: 0 22px;
  position: relative;
}

.roster-pictures::before,
.roster-pictures::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 14px;
}

.roster-pictures::before {
  left: 0;
}

.roster-pictures::after {
  right: 0;
}

.roster-pictures .roster-picture {
  margin-right: 28px;
}

.roster-pictures .roster-picture:last-child {
  margin-right: 0;
}

/*------------------------
    3. ROSTER PICTURE
------------------------*/
.roster-picture {
  width: 48px;
  height: 48px;
  cursor: pointer;
  position: relative;
}

.roster-picture.tns-nav-active::before {
  content: '';
  width: 100%;
  height: 100%;
  border-radius: 12px;
  border: 4px solid var(--color-secondary);
  position: absolute;
  top: 0;
  left: 0;
}

.roster-picture .roster-picture-image {
  width: 100%;
  height: 100%;
  border-radius: 12px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .slider-panel .slider-panel-roster {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .slider-panel .slider-panel-roster .roster-pictures {
    display: none;
  }

  .slider-panel .slider-panel-roster .slider-controls::after {
    display: block;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .chart-wrap
2. .chart
-------------------------------------------------------------------*/
/*----------------------
    1. CHART WRAP
----------------------*/
.chart-wrap {
  width: 100%;
  height: 360px;
}

.chart-wrap.small {
  height: 210px;
}

/*---------------
    2. CHART
---------------*/
.chart {
  width: 100%;
  height: 100%;
  position: relative;
}

.demo-box {
  padding: 48px 28px 32px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.demo-box::before {
  content: '';
  width: 100%;
  height: 48px;
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  background-color: var(--color-secondary);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}

.demo-box:nth-child(2n+2)::before {
  background-color: var(--color-primary);
}

.demo-box .demo-box-icon-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background-color: var(--color-box-background);
  margin: -26px auto 0;
  position: relative;
  z-index: 2;
}

.demo-box .demo-box-icon-wrap .demo-box-icon {
  fill: var(--color-icon-highlighted);
}

.demo-box .demo-box-title,
.demo-box .demo-box-text {
  text-align: center;
}

.demo-box .demo-box-title {
  margin-top: 8px;
  font-size: 1rem;
  font-weight: 700;
}

.demo-box .demo-box-text {
  margin-top: 4px;
  font-size: 0.75rem;
  font-weight: 500;
}

.demo-box .button {
  margin-top: 36px;
  overflow: hidden;
  position: relative;
}

.demo-box .button .active-text,
.demo-box .button .inactive-text {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out;
  transition: transform .3s ease-in-out, -webkit-transform .3s ease-in-out;
}

.demo-box .button .active-text {
  -webkit-transform: translate(0, 100%);
  transform: translate(0, 100%);
}

.demo-box .button.active {
  background-color: var(--color-primary);
}

.demo-box .button.active .inactive-text {
  -webkit-transform: translate(0, -100%);
  transform: translate(0, -100%);
}

.demo-box .button.active .active-text {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

/*-------------
    PLUGIN
-------------*/
.tab-container .tab-item {
  display: none;
}

.tab-container .tab-item:first-child {
  display: block;
}

.xm-popup_container {
  width: 90%;
  max-width: 900px;
  position: relative;
}

.xm-popup_container.xm-popup_container-gallery {
  width: auto;
}

.xm-popup_overlay {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 100%;
  background-color: var(--color-overlay);
  position: fixed;
  top: 0;
  left: 0;
  z-index: 100000;
  overflow: hidden auto;
}

.xm-popup_overlay.xm-popup_overlay-premade {
  display: block;
}

.xm-popup_overlay.xm-popup_overlay-premade .xm-popup_container {
  margin: auto;
}

.xm-popup_gallery-container {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
}

.xm-popup_gallery-image {
  max-width: 100%;
  height: auto;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.xm-popup_button-next,
.xm-popup_button-previous {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 60px;
  height: 100%;
  position: absolute;
  top: 0;
  cursor: pointer;
}

.xm-popup_button-next {
  right: 0;
}

.xm-popup_button-previous {
  left: 0;
}

.xm-popup_button-next-icon,
.xm-popup_button-previous-icon {
  fill: #fff;
  width: 8px;
  height: 12px;
}

.xm-popup_button-previous-icon {
  -webkit-transform: rotate(180deg);
  transform: rotate(180deg);
}

.xm-popup_iframe-container {
  padding-top: 56.25%;
  background-color: black;
  position: relative;
}

.xm-popup_iframe-container iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.xm-popup_close-button {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background-color: var(--color-secondary-dark);
  cursor: pointer;
  position: absolute;
  top: -20px;
  right: -20px;
  z-index: 2;
  transition: background-color .2s ease-in-out;
}

.xm-popup_close-button:hover {
  background-color: var(--color-primary);
}

.xm-popup_close-button-icon {
  fill: #fff;
  width: 12px;
  height: 12px;
  pointer-events: none;
}

@media screen and (max-width: 980px) {
  .xm-popup_container.xm-popup_container-gallery {
    max-width: 80%;
  }
}

@media screen and (max-width: 680px) {
  .xm-popup_container {
    width: 85%;
  }
}

.xm-popup_container.reaction-box-popup {
  max-width: 484px;
}

.xm-popup_container.group-manage-popup {
  max-width: 984px;
}

.xm-popup_container.share-box-popup,
.xm-popup_container.upload-box-popup {
  max-width: 584px;
}

.xm-popup_container.activity-media-popup {
  max-width: 100%;
  height: 100%;
  max-height: 80%;
}

.xm-popup_container.message-box-popup {
  max-width: 416px;
}

.xm-popup_container.form-popup {
  max-width: 484px;
}

.xm-popup_container.form-popup .form-box {
  width: 100%;
}

.activity :is(.bp-verified-badge, .bp-unverified-badge) {
  margin-right: 0;
}

.author-preview-title :is(.bp-verified-badge, .bp-unverified-badge),
.author-preview-text :is(.bp-verified-badge, .bp-unverified-badge),
.user-status-title.medium :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview.small .user-short-description-title :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview.small .user-short-description-text :is(.bp-verified-badge, .bp-unverified-badge),
.vikinger-forum-reply-author-title :is(.bp-verified-badge, .bp-unverified-badge),
.vikinger-forum-reply-author-text :is(.bp-verified-badge, .bp-unverified-badge),
.navigation-widget .user-short-description-title :is(.bp-verified-badge, .bp-unverified-badge),
.navigation-widget .user-short-description-text :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview-widget .user-short-description-title :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview-widget .user-short-description-text :is(.bp-verified-badge, .bp-unverified-badge) {
  width: 16px;
  height: 16px;
  background-size: 6px 6px;
}

.post-comment-text :is(.bp-verified-badge, .bp-unverified-badge),
.user-status-title :is(.bp-verified-badge, .bp-unverified-badge),
.user-status-text :is(.bp-verified-badge, .bp-unverified-badge),
.navigation-widget-info-title :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview.landscape .user-short-description-title :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview.landscape .user-short-description-text :is(.bp-verified-badge, .bp-unverified-badge),
.bbp-forum-description-author-title :is(.bp-verified-badge, .bp-unverified-badge),
.forum-topic-meta-author-title :is(.bp-verified-badge, .bp-unverified-badge),
.user-preview-author-text :is(.bp-verified-badge, .bp-unverified-badge),
.woocommerce-review__author :is(.bp-verified-badge, .bp-unverified-badge) {
  width: 14px;
  height: 14px;
  background-size: 6px 6px;
}

.post-comment-text :is(.bp-verified-badge, .bp-unverified-badge) {
  margin-left: -2px;
}

.theme-vikinger {
  --main-bm-color: var(--color-text-rgb);

  --bm-text-color: var(--color-text-rgb);
  --bm-placeholder: var(--color-text-rgb);

  --bm-bg-color: var(--color-box-background-rgb);
  --bm-bg-secondary: var(--color-box-background-alt-rgb);

  --bm-border-color: var(--color-divider-rgb);
  --bm-border-secondary-color: var(--color-divider-rgb);

  --bm-hover-bg: var(--color-box-hover-background-rgb);

  --bm-mention-bg: var(--color-box-hover-background-rgb);
  --bm-mention-color: var(--color-text-rgb);

  --bm-sticky-date-bg: #3e3f5e;
  --bm-sticky-date-color: #ffffff;

  --bm-tooltip-bg: 62, 63, 94;
  --bm-tooltip-color: 255, 255, 255;

  --left-message-nickname-color: var(--color-text-rgb);
  --left-message-text-color: var(--color-text-rgb);
  --left-message-bg-color: var(--color-box-hover-background-rgb);

  --right-message-nickname-color: var(--color-text-rgb);
  --right-message-text-color: 255, 255, 255;
  --right-message-bg-color: var(--color-secondary-rgb);
}

.bp-messages-wrap .threads-list .thread .unread-count {
  color: #ffffff;
  background: var(--color-secondary);
}

.bm-tooltip,
.bp-messages-wrap .bm-messages-list .bm-list .bm-sticky-date,
.bp-messages-wrap .bm-messages-list .bm-list .bm-conversation-start {
  opacity: 1;
}

.bp-messages-wrap button {
  color: var(--color-text) !important;
  background: var(--color-box-background) !important;
}

.contexify_item:not(.contexify_item-disabled):hover>.contexify_itemContent,
.contexify_item:not(.contexify_item-disabled):focus>.contexify_itemContent {
  color: var(--color-text);
  background-color: var(--color-box-hover-background);
}

/*****************************/
.pmpro,
.pmpro .pmpro_card_title {
  color: var(--color-text);
}

.pmpro :is(.pmpro_message, .pmpro_card) {
  box-shadow: var(--color-box-shadow);
}

.pmpro .pmpro_card {
  background-color: var(--color-box-background);
  border-color: var(--color-border);
}

#pmpro_login .pmpro_actions_nav {
  margin-top: 0;
}

.pmpro :is(.pmpro_form_field-password-toggle button, .pmpro_form_field-password-toggle button:hover, .pmpro_form_field-password-toggle button:focus, .pmpro_form_field-password-toggle button:active) {
  color: var(--color-text);
}

.pmpro .pmpro_section #loginform .login-submit .button,
.pmpro .pmpro_btn {
  color: #fff;
  background-color: var(--color-secondary);
  border: none;
  box-shadow: var(--color-secondary-shadow);
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.pmpro .pmpro_section #loginform .login-submit .button:hover,
.pmpro .pmpro_section #loginform .login-submit .button:focus,
.pmpro .pmpro_btn:hover,
.pmpro .pmpro_btn:focus {
  color: #fff;
  background-color: var(--color-secondary-hover);
}

.pmpro .pmpro_section #loginform .input,
.pmpro .pmpro_form_input {
  background-color: var(--color-box-background);
  border: 1px solid var(--color-border);
  color: var(--color-text);
  transition: border-color .2s ease-in-out;
}

.pmpro :is(.pmpro_form_input-text:focus, .pmpro_form_input-email:focus, .pmpro_form_input-url:focus, .pmpro_form_input-password:focus, .pmpro_form_input-search:focus, .pmpro_form_input-select:focus, .pmpro_form_input-checkbox:focus, .pmpro_form_input-radio:focus, .pmpro_form_input-multiselect:focus, .pmpro_form_input-number:focus, .pmpro_form_input-file:focus, .pmpro_form_input-date:focus, .pmpro_form_input-textarea:focus,
  .pmpro_section #loginform .input:focus) {
  background-color: var(--color-box-background);
  border-color: var(--color-secondary);
  box-shadow: none;
}

.pmpro .pmpro_card_actions {
  background-color: var(--color-box-background-alt);
  border-color: var(--color-border);
}

.pmpro .pmpro_card_content+.pmpro_card_actions {
  border-color: var(--color-border);
}

.pmpro .pmpro_btn-print,
.pmpro .pmpro_btn-print:hover,
.pmpro .pmpro_btn-print:focus {
  color: var(--color-secondary-dark);
}

.pmpro .pmpro_table {
  background-color: var(--color-box-background);
}

.pmpro .pmpro_table :is(thead th, tbody th, tbody td, tfoot td) {
  background-color: var(--color-box-background);
  border-color: var(--color-border);
}

/*************************************************/

.section-banner+.vikinger-pmpro-page-wrap {
  margin-top: 64px;
}

.section-header+.pmpro,
.section-header+#pmpro_account,
.section-header+.pmpro_invoice_wrap,
.section-header+.pmpro_billing_wrap {
  margin-top: 32px;
}

.section-header+.pmpro .pmpro_font-x-large {
  font-size: 1.5em;
}

.grid+.membership-group-details_title {
  margin-top: 32px;
}

.membership-group-details_text {
  margin-top: 18px;
  color: var(--color-text-alt);
  font-weight: 500;
}

.pmpro_content_message {
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1em;
  text-align: center;
  box-shadow: var(--color-box-shadow);
}

.pmpro_content_message .pmpro_content_message_title {
  margin-bottom: 12px;
  color: #fff;
  font-size: 1.125rem;
}

.pmpro_content_message .pmpro_content_message_content {
  font-weight: 500;
}

.pmpro_content_message a,
.pmpro_content_message a:link {
  height: 48px;
  margin: 16px 0 0;
  padding: 0 40px;
  border-radius: 10px;
  border: none;
  background-color: #3e3f5e;
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  line-height: 48px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.pmpro_content_message a:hover,
.pmpro_content_message a:link:hover {
  color: #fff;
  background-color: #2e2e47;
}

.pmpro_content_message a:nth-child(2),
.pmpro_content_message a:link:nth-child(2) {
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

.pmpro_content_message a:nth-child(2):hover,
.pmpro_content_message a:link:nth-child(2):hover {
  background-color: var(--color-primary-hover);
}

.pmpro_content_message a+a,
.pmpro_content_message a+a:link,
.pmpro_content_message a:link+a,
.pmpro_content_message a:link+a:link {
  margin-left: 12px;
}

.vikinger-pmpro-page-wrap .vikinger-pmpro-page-title {
  margin-bottom: 32px;
  font-size: 2em;
}

.membership-preview {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 32px 40px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.membership-preview .membership-preview-price {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  font-size: 3rem;
  font-weight: 700;
}

.membership-preview .membership-preview-price .membership-preview-price-currency {
  color: var(--color-primary);
  font-size: 1.75rem;
}

.membership-preview .membership-preview-name {
  margin-top: 18px;
  font-size: 2rem;
  font-weight: 700;
}

.membership-preview .membership-preview-period,
.membership-preview .membership-preview-description {
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.7142857143em;
}

.membership-preview .membership-preview-period {
  margin-top: 12px;
}

.membership-preview .membership-preview-description {
  margin-top: 20px;
  color: var(--color-text);
}

.membership-preview .membership-preview-description blockquote,
.membership-preview .membership-preview-description ul,
.membership-preview .membership-preview-description ol {
  margin-top: 20px;
  padding-left: 20px;
}

.membership-preview .membership-preview-description a {
  color: var(--color-primary);
  font-weight: 700;
}

.membership-preview .membership-preview-description ul ul,
.membership-preview .membership-preview-description ul ol,
.membership-preview .membership-preview-description ol ul,
.membership-preview .membership-preview-description ol ol {
  padding-left: 0;
  margin: 12px;
}

.membership-preview .membership-preview-description ul li,
.membership-preview .membership-preview-description ol li {
  margin-bottom: 12px;
  display: list-item;
}

.membership-preview .membership-preview-description ul li:last-child,
.membership-preview .membership-preview-description ol li:last-child {
  margin-bottom: 0;
}

.membership-preview .membership-preview-description ul {
  list-style: disc;
}

.membership-preview .membership-preview-description ul ul {
  list-style: circle;
}

.membership-preview .membership-preview-description ul ol {
  list-style: lower-alpha;
}

.membership-preview .membership-preview-description ol {
  list-style: decimal;
}

.membership-preview .membership-preview-description ol ul {
  list-style: circle;
}

.membership-preview .membership-preview-description ol ol {
  list-style: lower-alpha;
}

.membership-preview .membership-preview-button,
.membership-preview .membership-preview-notice {
  margin-top: 46px;
}

.membership-preview .membership-preview-notice {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  border-radius: 200px;
  background-color: var(--color-box-over-box-light-background);
  font-size: 0.875rem;
  font-weight: 700;
  box-shadow: var(--color-overbox-shadow);
}

.pmpro_actions_nav {
  margin-top: 32px;
  overflow: hidden;
}

.pmpro_actions_nav a {
  font-size: 0.875rem;
  font-weight: 700;
}

#pmpro_account .pmpro_box,
.pmpro_box,
.pmpro_invoice_wrap,
.pmpro_billing_wrap,
.pmpro_checkout,
.pmpro_cancel_wrap,
.pmpro_confirmation_wrap {
  margin: 0;
  padding: 32px 28px;
  border-radius: 12px;
  border-top: none;
  background-color: var(--color-box-background);
  font-size: 0.875rem;
  font-weight: 500;
  box-shadow: var(--color-box-shadow);
}

#pmpro_account .pmpro_box h3,
.pmpro_box h3,
.pmpro_invoice_wrap h3,
.pmpro_billing_wrap h3,
.pmpro_checkout h3,
.pmpro_cancel_wrap h3,
.pmpro_confirmation_wrap h3 {
  margin-bottom: 32px;
  font-size: 1rem;
}

#pmpro_account .pmpro_box p,
.pmpro_box p,
.pmpro_invoice_wrap p,
.pmpro_billing_wrap p,
.pmpro_checkout p,
.pmpro_cancel_wrap p,
.pmpro_confirmation_wrap p {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.7142857143em;
}

#pmpro_account .pmpro_box .pmpro_table p,
.pmpro_box .pmpro_table p,
.pmpro_invoice_wrap .pmpro_table p,
.pmpro_billing_wrap .pmpro_table p,
.pmpro_checkout .pmpro_table p,
.pmpro_cancel_wrap .pmpro_table p,
.pmpro_confirmation_wrap .pmpro_table p {
  line-height: 1em;
}

#pmpro_account .pmpro_box a,
.pmpro_box a,
.pmpro_invoice_wrap a,
.pmpro_billing_wrap a,
.pmpro_checkout a,
.pmpro_cancel_wrap a,
.pmpro_confirmation_wrap a {
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: 700;
}

#pmpro_account .pmpro_box a.pmpro_a-print,
.pmpro_box a.pmpro_a-print,
.pmpro_invoice_wrap a.pmpro_a-print,
.pmpro_billing_wrap a.pmpro_a-print,
.pmpro_checkout a.pmpro_a-print,
.pmpro_cancel_wrap a.pmpro_a-print,
.pmpro_confirmation_wrap a.pmpro_a-print {
  font-size: 0.75rem;
  font-weight: 500;
}

#pmpro_account .pmpro_box ul,
.pmpro_box ul,
.pmpro_invoice_wrap ul,
.pmpro_billing_wrap ul,
.pmpro_checkout ul,
.pmpro_cancel_wrap ul,
.pmpro_confirmation_wrap ul {
  margin: 6px 0 28px;
}

#pmpro_account .pmpro_box ul li,
.pmpro_box ul li,
.pmpro_invoice_wrap ul li,
.pmpro_billing_wrap ul li,
.pmpro_checkout ul li,
.pmpro_cancel_wrap ul li,
.pmpro_confirmation_wrap ul li {
  margin-bottom: 4px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

#pmpro_account .pmpro_box ul li strong,
.pmpro_box ul li strong,
.pmpro_invoice_wrap ul li strong,
.pmpro_billing_wrap ul li strong,
.pmpro_checkout ul li strong,
.pmpro_cancel_wrap ul li strong,
.pmpro_confirmation_wrap ul li strong {
  font-weight: 500;
}

#pmpro_account .pmpro_box ul li:last-child,
.pmpro_box ul li:last-child,
.pmpro_invoice_wrap ul li:last-child,
.pmpro_billing_wrap ul li:last-child,
.pmpro_checkout ul li:last-child,
.pmpro_cancel_wrap ul li:last-child,
.pmpro_confirmation_wrap ul li:last-child {
  margin-bottom: 0;
}

#pmpro_account .pmpro_box+.pmpro_box,
.pmpro_box+.pmpro_box,
.pmpro_invoice_wrap+.pmpro_box,
.pmpro_billing_wrap+.pmpro_box,
.pmpro_checkout+.pmpro_box,
.pmpro_cancel_wrap+.pmpro_box,
.pmpro_confirmation_wrap+.pmpro_box {
  margin-top: 16px;
}

.pmpro_billing_wrap .pmpro_checkout {
  margin: 32px 0;
  padding: 0;
  box-shadow: none;
}

#pmpro_account #pmpro_account-profile .pmpro_actionlinks {
  margin-top: 0;
}

.pmpro_invoice_wrap .pmpro_actions_nav {
  margin-top: 32px;
}

.pmpro_invoice_wrap>ul {
  margin-bottom: 0;
}

.pmpro_invoice_details {
  color: var(--color-text);
  font-size: 0.875rem;
}

.pmpro_invoice_details p {
  font-weight: 500;
}

.pmpro_invoice_details>div {
  margin-top: 32px;
}

.pmpro_table {
  color: var(--color-text);
  font-size: 0.875rem;
}

.pmpro_table p {
  line-height: 1em;
}

.pmpro_table a {
  color: var(--color-primary);
  font-weight: 700;
}

.pmpro_table thead tr th {
  padding-bottom: 16px;
  border-bottom: 1px solid var(--color-divider);
  font-size: 0.75rem;
  text-transform: uppercase;
  text-align: left;
}

.pmpro_table tbody {
  vertical-align: top;
}

.pmpro_table tbody tr td {
  padding: 8px 0;
  font-weight: 700;
}

.pmpro_actionlinks {
  font-size: 0.875rem;
  font-weight: 700;
}

.pmpro_actionlinks a {
  color: var(--color-primary);
}

.pmpro_actionlinks a.pmpro_btn {
  color: #fff;
}

.pmpro_message {
  padding: 20px 28px;
  border: 2px solid var(--color-secondary);
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  border-radius: 12px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 2em;
}

.pmpro_message.pmpro_alert {
  border: 2px solid var(--color-primary);
}

.pmpro_message a {
  color: var(--color-text);
  font-weight: 700;
  text-decoration: none;
}

.pmpro_message a:hover {
  color: var(--color-primary);
}

.pmpro_checkout {
  margin: 32px 0;
}

.pmpro_checkout .pmpro_checkout-h3-msg a {
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: 700;
}

.pmpro_checkout .pmpro_checkout-fields {
  color: var(--color-text);
  font-size: 0.875rem;
  line-height: 2em;
}

#pmpro_form .pmpro_checkout h3 {
  margin: 0 0 28px;
}

#pmpro_form .pmpro_checkout h3 .pmpro_checkout-h3-name {
  margin: 0;
}

#pmpro_form .pmpro_checkout h3 .pmpro_checkout-h3-msg {
  font-size: 0.75rem;
  font-weight: 500;
}

#pmpro_form #pmpro_pricing_fields .pmpro_checkout-fields {
  font-weight: 500;
}

#pmpro_form #pmpro_pricing_fields p {
  font-weight: 500;
}

form.pmpro_form .pmpro_checkout-fields div {
  margin: 0;
}

form.pmpro_form .pmpro_checkout-fields .pmpro_checkout-field {
  margin-bottom: 28px;
}

form.pmpro_form .pmpro_checkout-fields .pmpro_checkout-field:last-child {
  margin-bottom: 0;
}

form.pmpro_form label {
  margin-bottom: 12px;
  font-weight: 500;
}

form.pmpro_form input[type="text"],
form.pmpro_form input[type="email"],
form.pmpro_form select {
  height: 48px;
  font-size: 0.875rem;
}

form.pmpro_form select {
  padding: 0 48px 0px 18px;
  cursor: pointer;
  background: url("img/form/select-arrow.png") no-repeat right 20px top 20px;
}

form.pmpro_form .pmpro_asterisk {
  color: var(--color-secondary);
  font-weight: 700;
}

form.pmpro_form .pmpro_payment-expiration select:nth-child(2) {
  margin-bottom: 12px;
}

form.pmpro_form #pmpro_processing_message {
  margin: 32px 0 0;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

#loginform p.login-submit {
  margin-top: 32px;
}

.page-open-content .pmpro_login_wrap #loginform label {
  margin-bottom: 8px;
}

.page-open-content .pmpro_login_wrap #loginform input[type="text"],
.page-open-content .pmpro_login_wrap #loginform input[type="password"] {
  max-width: 100%;
}

.page-open-content .pmpro_login_wrap hr:not(.wp-block-separator) {
  width: 100%;
  height: 1px;
  background-color: var(--color-divider);
}

.login-submit input[type="submit"] {
  height: 48px;
  padding: 0 40px;
  border-radius: 10px;
  border: none;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  line-height: 48px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
  box-shadow: var(--color-primary-shadow);
}

.login-submit input[type="submit"]:hover {
  background-color: var(--color-primary-hover);
}

.pmpro_btn,
.pmpro_btn:link {
  height: 48px;
  padding: 0 40px;
  border-radius: 10px;
  border: none;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  line-height: 48px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
  box-shadow: var(--color-primary-shadow);
}

.pmpro_btn.pmpro_btn-cancel,
.pmpro_btn.pmpro_btn-cancel:link,
.pmpro_btn:link.pmpro_btn-cancel,
.pmpro_btn:link.pmpro_btn-cancel:link {
  color: #fff;
  text-decoration: none;
  background-color: #3e3f5e;
  box-shadow: 3px 5px 10px 0 rgba(62, 63, 94, 0.2);
}

.pmpro_btn.pmpro_btn-cancel:hover,
.pmpro_btn.pmpro_btn-cancel:link:hover,
.pmpro_btn:link.pmpro_btn-cancel:hover,
.pmpro_btn:link.pmpro_btn-cancel:link:hover {
  color: #fff;
  background-color: #2e2e47;
  text-decoration: none;
}

.pmpro_btn:hover,
.pmpro_btn:link:hover {
  background-color: var(--color-primary-hover);
}

.pmpro_btn:focus,
.pmpro_btn:link:focus {
  outline: none;
}

.pmpro_btn.pmpro_btn-submit-checkout,
.pmpro_btn:link.pmpro_btn-submit-checkout {
  width: 100%;
  margin-top: 32px;
}

.pmpro_btn+.pmpro_btn,
.pmpro_btn:link+.pmpro_btn {
  margin-left: 8px;
}

#pmpro_message_bottom {
  margin: 0;
}

.pmpro_error {
  background-color: var(--color-box-background);
  border-color: var(--color-tertiary);
  color: var(--color-text);
}

input[type="text"].pmpro_error,
input[type="email"].pmpro_error,
input[type="url"].pmpro_error,
input[type="password"].pmpro_error,
input[type="number"].pmpro_error,
input[type="tel"].pmpro_error,
input[type="range"].pmpro_error,
input[type="date"].pmpro_error,
input[type="month"].pmpro_error,
input[type="week"].pmpro_error,
input[type="time"].pmpro_error,
input[type="datetime"].pmpro_error,
input[type="datetime-local"].pmpro_error,
input[type="color"].pmpro_error,
textarea.pmpro_error {
  background-color: transparent;
  border-color: var(--color-tertiary);
  color: var(--color-text);
}

.pmpro_cancel_wrap .pmpro_actionlinks,
.pmpro_cancel_wrap .pmpro_cancel_return_home {
  margin-top: 32px;
}

.pmpro_cancel_wrap .pmpro_message {
  margin: 0;
}

.pmpro_confirmation_wrap {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 2em;
}

.pmpro_confirmation_wrap blockquote,
.pmpro_confirmation_wrap ul,
.pmpro_confirmation_wrap ol {
  padding-left: 20px;
}

.pmpro_confirmation_wrap a {
  color: var(--color-primary);
  font-weight: 700;
}

.pmpro_confirmation_wrap ul ul,
.pmpro_confirmation_wrap ul ol,
.pmpro_confirmation_wrap ol ul,
.pmpro_confirmation_wrap ol ol {
  padding-left: 0;
  margin: 12px;
}

.pmpro_confirmation_wrap ul li,
.pmpro_confirmation_wrap ol li {
  margin-bottom: 12px;
  display: list-item;
}

.pmpro_confirmation_wrap ul li:last-child,
.pmpro_confirmation_wrap ol li:last-child {
  margin-bottom: 0;
}

.pmpro_confirmation_wrap ul {
  list-style: disc;
}

.pmpro_confirmation_wrap ul ul {
  list-style: circle;
}

.pmpro_confirmation_wrap ul ol {
  list-style: lower-alpha;
}

.pmpro_confirmation_wrap ol {
  list-style: decimal;
}

.pmpro_confirmation_wrap ol ul {
  list-style: circle;
}

.pmpro_confirmation_wrap ol ol {
  list-style: lower-alpha;
}

.pmpro_confirmation_wrap h3 {
  margin: 32px 0 20px;
}

.pmpro_confirmation_wrap ul {
  margin-top: 12px;
}

.pmpro_price_part_label::after,
.pmpro_invoice-field-billing_city::after {
  display: inline;
}

.pmpro_price_part-total {
  margin-top: 4;
  padding-top: 12px;
  border-top: 1px solid var(--color-border);
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .section-banner+.vikinger-pmpro-page-wrap {
    margin-top: 32px;
  }

  .vikinger-pmpro-page-wrap .section-header:first-child {
    margin-top: 60px;
  }
}

@media screen and (max-width: 768px) {

  .page-open-content .pmpro_login_wrap form#loginform input[type="text"].input,
  .page-open-content .pmpro_login_wrap form#loginform input[type="password"].input {
    width: 100%;
  }

  form.pmpro_form .pmpro_submit .pmpro_btn,
  form.pmpro_form .pmpro_submit .pmpro_btn:link {
    display: block;
    width: 100%;
  }

  form.pmpro_form .pmpro_submit .pmpro_btn+.pmpro_btn,
  form.pmpro_form .pmpro_submit .pmpro_btn:link+.pmpro_btn {
    margin: 12px 0 0;
  }

  .pmpro_cancel_wrap .pmpro_actionlinks .pmpro_btn,
  .pmpro_cancel_wrap .pmpro_actionlinks .pmpro_btn:link {
    display: block;
    width: 100%;
  }

  .pmpro_cancel_wrap .pmpro_actionlinks .pmpro_btn+.pmpro_btn,
  .pmpro_cancel_wrap .pmpro_actionlinks .pmpro_btn:link+.pmpro_btn {
    margin: 12px 0 0;
  }
}

.pmpro_bbp_membership_msg {
  margin: 32px 0;
  padding: 32px 28px;
  border-radius: 12px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1em;
  text-align: center;
  box-shadow: var(--color-box-shadow);
}

.vikinger-pmpro-level-tag {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.vikinger-pmpro-level-tag.vikinger-pmpro-level-tag_small .vikinger-pmpro-level-tag-text {
  padding-top: 5px;
  font-size: 0.6875rem;
}

.vikinger-pmpro-level-tag .vikinger-pmpro-level-tag-text {
  padding: 4px 8px;
  border-radius: 200px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
}

/*-------------
    LAYOUT
-------------*/
/*------------------------------------------------------------------
[Table of contents]

1. .header
2. .sidemenu-trigger
3. .floaty-bar
-------------------------------------------------------------------*/
/*-----------------
    1. HEADER
-----------------*/
.header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 80px;
  background-color: var(--color-header-background);
  position: sticky;
  top: 0;
  z-index: 3;
  transition: transform .15s ease-out;
}

.header.header--hidden {
  transform: translateY(-100%);
}

.header .logo {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 80px;
  height: 100%;
}

.header .logo.logo-encased {
  background-color: var(--color-header-logo-background);
}

.header .header-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.header .header-actions.header-actions-full {
  height: 100%;
}

.header .header-actions.search-bar {
  width: 30%;
  margin-right: 26px;
}

.header .header-actions.search-bar #vk-search-form,
.header .header-actions.search-bar .header-search-dropdown {
  width: 100%;
  height: 100%;
}

.header .header-actions.search-bar .search-form-wrap {
  width: 100%;
  height: 100%;
}

.header .header-actions.search-bar .search-form-wrap .dropdown-box {
  width: 100%;
  padding-bottom: 0;
}

.header .header-actions.search-bar .search-form-wrap .dropdown-box .loader-spinner-wrap {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
}

.header .header-actions .navigation {
  margin-right: 16px;
}

.header .header-actions .progress-stat {
  width: 110px;
  margin-right: 36px;
}

.header .header-actions .login-button,
.header .header-actions .register-button {
  padding: 0 26px;
  margin-right: 12px;
}

.header .header-actions .login-button:last-child,
.header .header-actions .register-button:last-child {
  margin-right: 28px;
}

.header .header-actions .login-form {
  margin: 0 14px 0 12px;
}

.header .header-actions .login-form .button {
  width: 52px;
  height: 52px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.header .header-actions .point-item-list {
  margin-right: 26px;
}

.header .header-brand {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.header .header-brand .header-brand-text {
  color: var(--color-header-text);
  font-family: var(--font-secondary);
  font-size: 1.25rem;
  font-weight: 900;
  text-transform: uppercase;
}

.header .header-brand .header-brand-text:first-child {
  margin-left: 20px;
}

.header .sidemenu-trigger,
.header .mobilemenu-trigger {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 80px;
  height: 80px;
  cursor: pointer;
}

.header .sidemenu-trigger.active .icon-grid,
.header .sidemenu-trigger:hover .icon-grid {
  fill: var(--color-header-icon-hover);
}

.header .sidemenu-trigger .icon-grid {
  pointer-events: none;
  transition: fill .3s ease-in-out;
}

.header .mobilemenu-trigger {
  display: none;
}

.header .mobilemenu-trigger .burger-icon .burger-icon-bar {
  background-color: var(--color-header-mobilemenu-trigger-icon);
}

.header .input-search {
  width: 100%;
}

.header .action-list {
  height: 80px;
}

.header .action-list.action-list-small {
  height: 60px;
}

.header .action-list.action-list-small::before,
.header .action-list.action-list-small::after {
  display: none;
}

.header .action-list.action-list-small .action-list-item.unread::after {
  top: 16px;
}

.header .action-list.action-list-mobile {
  padding: 0;
  display: none;
}

.header .action-list::before,
.header .action-list::after {
  top: 24px;
}

.header .action-item-wrap {
  margin-left: 18px;
}

.header .action-item-wrap:last-child {
  margin-right: 18px;
}

.header .action-item-wrap+.action-item-wrap {
  margin: 0 18px 0 0;
}

.header .action-item {
  height: 80px;
  padding: 0 14px;
}

.header .progress-stat .bar-progress-wrap .bar-progress-info {
  color: var(--color-header-text);
}

.header .point-item .point-item-text {
  color: var(--color-header-text);
}

/*--------------------------
    2. SIDEMENU TRIGGER
--------------------------*/
.sidemenu-trigger .icon-grid {
  fill: var(--color-header-icon);
}

.sidemenu-trigger.active .icon-grid {
  fill: var(--color-icon-highlighted);
}

/*---------------------
    3. FLOATY BAR
---------------------*/
.floaty-bar {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 60px;
  background-color: var(--color-header-background);
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 10000;
  display: none;
}

.floaty-bar .login-button {
  padding: 0 26px;
}

/*-------------------------------------------------
    DESKTOP FLOATING PILL BOX HEADER ACTIONS
-------------------------------------------------*/

/* Last header-actions div → Floating Pill Box */
.header .header-actions:last-child {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 40px;
  height: 48px;
  padding: 0 6px;
  margin-right: 16px;
  gap: 2px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  transition: background 0.3s ease, box-shadow 0.3s ease;
}

.header .header-actions:last-child:hover {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.12);
}

/* Remove default margins on action-item-wrap inside pill */
.header .header-actions:last-child .action-item-wrap {
  margin: 0 !important;
  position: relative;
}

/* Action items inside the pill — rounded hover capsules */
.header .header-actions:last-child .action-item {
  height: 38px;
  padding: 0 12px;
  border-radius: 24px;
  transition: background-color 0.25s ease;
  position: relative;
}

.header .header-actions:last-child .action-item:hover {
  background-color: rgba(255, 255, 255, 0.08);
}

/* Action list (notifications, cart) inside the pill */
.header .header-actions:last-child .action-list {
  height: 48px !important;
  border-radius: 24px;
  display: flex !important;
  align-items: center !important;
}

/* Cart wrapper inside the pill — force alignment through entire chain */
.header .header-actions:last-child .header-cart {
  display: flex !important;
  align-items: center !important;
  height: 48px !important;
}

.header .header-actions:last-child .header-cart .action-list {
  height: 48px !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 !important;
}

.header .header-actions:last-child .header-cart .action-list-item-wrap {
  display: flex !important;
  align-items: center !important;
  height: 48px !important;
}

.header .header-actions:last-child .header-cart .action-list .action-list-item,
.header .header-actions:last-child .action-list .action-list-item {
  height: 38px !important;
  padding: 0 10px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 20px;
  transition: background-color 0.25s ease;
}

.header .header-actions:last-child .header-cart .action-list-item-icon-wrap {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: auto !important;
}

.header .header-actions:last-child .action-list::before,
.header .header-actions:last-child .action-list::after {
  display: none !important;
}

.header .header-actions:last-child .action-list .action-list-item:hover {
  background-color: rgba(255, 255, 255, 0.08);
}

/* Progress stat + point items inside pill */
.header .header-actions:last-child .progress-stat {
  margin: 0 8px;
}

/* Profile avatar trigger inside pill */
.header .header-actions:last-child .header-profile-trigger {
  border-radius: 24px;
  transition: background-color 0.25s ease;
}

.header .header-actions:last-child .header-profile-trigger:hover {
  background-color: rgba(255, 255, 255, 0.08);
}

/* Pill divider between icon groups */
.header .header-actions:last-child .action-item-wrap+.action-item-wrap::before {
  content: '';
  position: absolute;
  left: -1px;
  top: 50%;
  transform: translateY(-50%);
  width: 1px;
  height: 20px;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 1px;
}

/*-------------------------------------------------
    SMOOTH HOVER DROPDOWN ANIMATION
-------------------------------------------------*/

/* Profile Settings Dropdown — smooth hover reveal */
.header .action-item-wrap .dropdown-navigation.header-settings-dropdown {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 8px;
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px) scale(0.97);
  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  pointer-events: none;
  transform-origin: top right;
  z-index: 10000;
}

/* Show dropdown on hover with smooth animation */
.header .action-item-wrap:hover .dropdown-navigation.header-settings-dropdown,
.header .action-item-wrap .dropdown-navigation.header-settings-dropdown.active {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
  pointer-events: auto;
}

/* Also apply to notification/cart dropdown boxes */
.header .action-list-item-wrap .dropdown-box,
.header .action-list .dropdown-box {
  transform: translateY(12px) scale(0.97);
  transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1),
    visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  transform-origin: top right;
}

.header .action-list-item-wrap:hover .dropdown-box,
.header .action-list .action-list-item:hover+.dropdown-box,
.header .action-list-item-wrap .dropdown-box.active,
.header .action-list .dropdown-box.active {
  transform: translateY(0) scale(1);
}

/* Dropdown inner content subtle stagger effect */
.header .action-item-wrap:hover .dropdown-navigation .dropdown-navigation-link {
  animation: pillDropdownFadeIn 0.2s ease forwards;
  animation-delay: calc(var(--item-index, 0) * 0.03s);
}

@keyframes pillDropdownFadeIn {
  from {
    opacity: 0.5;
    transform: translateX(-4px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/*-------------------------------------------------
    DESKTOP PILL — DARK MODE COLORS
-------------------------------------------------*/
body.active-dark-mode .header .header-actions:last-child {
  background: rgba(255, 255, 255, 0.05);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

body.active-dark-mode .header .header-actions:last-child .action-item:hover,
body.active-dark-mode .header .header-actions:last-child .action-list .action-list-item:hover,
body.active-dark-mode .header .header-actions:last-child .header-profile-trigger:hover {
  background-color: rgba(255, 255, 255, 0.1);
}

body.active-dark-mode .header .header-actions:last-child .action-item-wrap+.action-item-wrap::before {
  background: rgba(255, 255, 255, 0.08);
}

/*-------------------------------------------------
    DESKTOP PILL — LIGHT MODE COLORS
-------------------------------------------------*/
body:not(.active-dark-mode) .header .header-actions:last-child {
  background: rgba(0, 0, 0, 0.03);
  border-color: rgba(0, 0, 0, 0.06);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
}

body:not(.active-dark-mode) .header .header-actions:last-child .action-item:hover,
body:not(.active-dark-mode) .header .header-actions:last-child .action-list .action-list-item:hover,
body:not(.active-dark-mode) .header .header-actions:last-child .header-profile-trigger:hover {
  background-color: rgba(0, 0, 0, 0.05);
}

body:not(.active-dark-mode) .header .header-actions:last-child .action-item-wrap+.action-item-wrap::before {
  background: rgba(0, 0, 0, 0.08);
}

/* Profile widget — light mode text & avatar */
body:not(.active-dark-mode) .header .header-actions:last-child .header-profile-name {
  color: var(--color-text) !important;
}

body:not(.active-dark-mode) .header .header-actions:last-child .header-profile-avatar {
  border-color: rgba(0, 0, 0, 0.1) !important;
}

/* Action item icons — dark fill in light mode */
body:not(.active-dark-mode) .header .header-actions:last-child .action-item .action-item-icon {
  fill: var(--color-text-alt) !important;
}

body:not(.active-dark-mode) .header .header-actions:last-child .action-item:hover .action-item-icon {
  fill: var(--color-text) !important;
}

/* Action list icons inside pill */
body:not(.active-dark-mode) .header .header-actions:last-child .action-list-item-icon {
  fill: var(--color-text-alt) !important;
}

body:not(.active-dark-mode) .header .header-actions:last-child .action-list .action-list-item:hover .action-list-item-icon {
  fill: var(--color-text) !important;
}

/*-------------------------------------------------
    HEADER REGISTER & LOGIN BUTTONS — DARK MODE
-------------------------------------------------*/
body.active-dark-mode .header .header-actions .register-button {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}

body.active-dark-mode .header .header-actions .register-button:hover {
  background-color: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
}

body.active-dark-mode .header .header-actions .login-button {
  background-color: var(--color-primary) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
}

body.active-dark-mode .header .header-actions .login-button:hover {
  background-color: var(--color-primary-hover) !important;
}

/*-------------------------------------------------
    HEADER REGISTER & LOGIN BUTTONS — LIGHT MODE
-------------------------------------------------*/
body:not(.active-dark-mode) .header .header-actions .register-button {
  background-color: rgba(0, 0, 0, 0.06) !important;
  color: var(--color-text) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
}

body:not(.active-dark-mode) .header .header-actions .register-button:hover {
  background-color: rgba(0, 0, 0, 0.1) !important;
  border-color: rgba(0, 0, 0, 0.12) !important;
  color: var(--color-text) !important;
}

body:not(.active-dark-mode) .header .header-actions .login-button {
  background-color: var(--color-primary) !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
}

body:not(.active-dark-mode) .header .header-actions .login-button:hover {
  background-color: var(--color-primary-hover) !important;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1500px) {
  .header .header-brand .header-brand-text {
    display: none;
  }
}

@media screen and (max-width: 1365px) {
  .header.logged-out .header-actions .mobilemenu-trigger {
    display: -ms-flexbox;
    display: flex;
  }

  .header .header-actions .sidemenu-trigger,
  .header .header-actions .navigation,
  .header .header-actions .point-item-list {
    display: none;
  }

  .header .header-actions:last-child .action-item-wrap {
    display: none;
  }

  .header .header-actions #header-notifications .action-list::before {
    display: none;
  }

  .header .header-actions .mobilemenu-trigger {
    display: -ms-flexbox;
    display: flex;
  }

  .header .header-actions.search-bar {
    width: 50%;
  }

  .header .header-actions .progress-stat {
    margin-right: 26px;
  }
}

@media screen and (max-width: 960px) {
  .header {
    height: 60px;
  }

  .header .logo {
    width: 60px;
  }

  .header.logged-out .header-actions:nth-last-child(2) {
    display: block;
  }

  .header.logged-out .header-actions:last-child {
    display: none;
  }

  .header.logged-out .header-actions .navigation {
    display: none;
  }

  .header .action-list.action-list-mobile {
    display: -ms-flexbox;
    display: flex;
  }

  .header .header-actions:last-child {
    display: none;
  }

  .header .header-actions .header-brand .logo {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    width: 60px;
    margin-left: 0;
  }

  .header .header-actions .mobilemenu-trigger {
    width: 60px;
    height: 60px;
  }

  .header .header-actions.search-bar {
    width: 100%;
    margin-right: 0;
    position: absolute;
    top: 60px;
    height: 60px;
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translate(0, -20px);
    transform: translate(0, -20px);
    transition: opacity .2s ease-in-out, visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
    transition: transform .2s ease-in-out, opacity .2s ease-in-out, visibility .2s ease-in-out;
    transition: transform .2s ease-in-out, opacity .2s ease-in-out, visibility .2s ease-in-out, -webkit-transform .2s ease-in-out;
  }

  .header .header-actions.search-bar.search-bar-active {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }

  .header .header-actions.search-bar .interactive-input {
    height: 100%;
  }

  .header .header-actions.search-bar .interactive-input input {
    border-radius: 0;
  }

  .header .header-actions.search-bar .interactive-input .interactive-input-action,
  .header .header-actions.search-bar .interactive-input .interactive-input-icon-wrap {
    display: none;
  }

  .header .header-actions .progress-stat {
    display: none;
  }

  .floaty-bar {
    display: -ms-flexbox;
    display: flex;
  }

  body.vikinger-logged-out {
    padding-bottom: 0;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .navigation
2. .menu-main
3. .menu
4. .section-navigation
5. .section-menu
-------------------------------------------------------------------*/
/*---------------------
    1. NAVIGATION
---------------------*/
.navigation {
  height: 80px;
}

/*---------------------
    2. MENU MAIN
---------------------*/
.menu-main {
  display: -ms-flexbox;
  display: flex;
}

.menu-main .menu-main-item {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  position: relative;
}

.menu-main .menu-main-item .menu-main-item-link {
  padding: 0 24px;
  display: block;
  color: var(--color-header-text);
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 80px;
  cursor: pointer;
  transition: color .2s ease-in-out;
  word-break: break-word;
}

.menu-main .menu-main-item .menu-main-item-link .icon-dots {
  transition: fill .2s ease-in-out;
}

.menu-main .menu-main-item .menu-main-item-link .menu-sub-item-icon {
  fill: var(--color-header-text);
  position: absolute;
  top: 11px;
  right: 10px;
  pointer-events: none;
  transition: fill .2s ease-in-out;
}

.menu-main .menu-main-item .menu-main-item-link .menu-main-item-link-icon {
  fill: var(--color-header-text);
  width: 6px;
  height: 6px;
  margin-left: 8px;
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  transition: fill .2s ease-in-out;
}

.menu-main .menu-main-item:hover>.menu-main-item-link {
  color: var(--color-primary-light);
}

.menu-main .menu-main-item:hover>.menu-main-item-link .menu-sub-item-icon,
.menu-main .menu-main-item:hover>.menu-main-item-link .menu-main-item-link-icon,
.menu-main .menu-main-item:hover>.menu-main-item-link .icon-dots {
  fill: var(--color-primary-light);
}

.menu-main .menu-main-item:hover>.menu-main,
.menu-main .menu-main-item:hover>.menu-wide {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
  -webkit-animation: .6s linear forwards menuSlideDownPointerEvents;
  animation: .6s linear forwards menuSlideDownPointerEvents;
}

.menu-main .menu-main-item:hover>.menu-main .menu-main-item:hover>.menu-main,
.menu-main .menu-main-item:hover>.menu-wide .menu-main-item:hover>.menu-main {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
}

.menu-main .menu-main-item .menu-wide,
.menu-main .menu-main-item .menu-main {
  position: absolute;
  z-index: 99997;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  transition: transform .3s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out;
  transition: transform .3s ease-in-out, opacity .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
  -webkit-transform: translate(0, -40px);
  transform: translate(0, -40px);
}

.menu-main .menu-main-item .menu-wide .menu-main,
.menu-main .menu-main-item .menu-main .menu-main {
  top: -8px;
  left: 100%;
  -webkit-transform: translate(-40px, 0);
  transform: translate(-40px, 0);
}

.menu-main .menu-main-item .menu-wide {
  top: 72px;
}

.menu-main .menu-main-item .menu-main {
  display: block;
  min-width: 120px;
  padding: 8px 0;
  border-radius: 10px;
  background-color: var(--color-header-background);
  top: 64px;
}

.menu-main .menu-main-item .menu-main .menu-main-item {
  display: block;
}

.menu-main .menu-main-item .menu-main .menu-main-item .menu-main-item-link {
  padding: 8px 18px;
  line-height: 1em;
  white-space: nowrap;
}

/*---------------
    3. MENU
---------------*/
.menu.small .menu-item.active .menu-item-link:hover {
  padding-left: 0;
}

.menu.small .menu-item .menu-item-link {
  padding-left: 0;
}

.menu.small .menu-item .menu-item-link:focus,
.menu.small .menu-item .menu-item-link:hover {
  padding-left: 0;
}

.menu .menu-item {
  padding: 0 16px;
  margin-bottom: 10px;
}

.menu .menu-item:last-child {
  margin-bottom: 0;
}

.menu .menu-item.active>.menu-item-link {
  color: #fff;
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
}

.menu .menu-item.active>.menu-item-link:hover {
  background-color: var(--color-primary);
  color: #fff;
  padding-left: 62px;
  box-shadow: var(--color-primary-shadow);
}

.menu .menu-item.active>.menu-item-link:hover .menu-item-link-icon {
  fill: #fff;
}

.menu .menu-item.active>.menu-item-link .menu-item-link-icon {
  fill: #fff;
}

.menu .menu-item .menu {
  margin: 12px 0;
}

.menu .menu-item .menu-item-link {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  height: 48px;
  padding-left: 62px;
  border-radius: 12px;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.2857142857em;
  position: relative;
  transition: all .2s ease-in-out;
}

.menu .menu-item .menu-item-link:focus,
.menu .menu-item .menu-item-link:hover {
  background-color: var(--color-box-over-box-light-background);
  color: var(--color-text);
  padding-left: 70px;
  box-shadow: var(--color-overbox-shadow);
}

.menu .menu-item .menu-item-link:focus .menu-item-link-icon,
.menu .menu-item .menu-item-link:hover .menu-item-link-icon {
  fill: var(--color-primary);
}

.menu .menu-item .menu-item-link .menu-item-link-icon {
  fill: var(--color-icon);
  position: absolute;
  top: 14px;
  left: 14px;
  pointer-events: none;
  transition: all .2s ease-in-out;
}

/*-----------------------------
    4. SECTION NAVIGATION
-----------------------------*/
.section-navigation {
  height: 80px;
  padding: 0 43px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
  position: relative;
}

.section-navigation .slider-controls .slider-control {
  width: 43px;
  height: 80px;
  position: absolute;
  top: 0;
}

.section-navigation .slider-controls .slider-control.left {
  left: 0;
}

.section-navigation .slider-controls .slider-control.right {
  right: 0;
}

/*----------------------
    5. SECTION MENU
----------------------*/
.section-menu {
  height: 80px;
}

.section-menu.secondary .section-menu-item.active,
.section-menu.secondary .section-menu-item:hover {
  border-bottom: 4px solid var(--color-secondary);
}

.section-menu.secondary .section-menu-item.active .section-menu-item-icon {
  fill: var(--color-icon-highlighted);
}

.section-menu.medium .section-menu-item {
  width: 160px;
}

.section-menu .section-menu-item {
  float: left;
  width: 122px;
  height: 80px;
  position: relative;
}

.section-menu .section-menu-item.active {
  border-bottom: 4px solid var(--color-primary);
}

.section-menu .section-menu-item.active .section-menu-item-icon {
  fill: var(--color-icon-highlighted);
  opacity: 1;
}

.section-menu .section-menu-item:hover {
  border-bottom: 4px solid var(--color-primary);
}

.section-menu .section-menu-item:hover .section-menu-item-icon {
  -webkit-transform: translate(0, -20px);
  transform: translate(0, -20px);
  opacity: 0;
  visibility: hidden;
}

.section-menu .section-menu-item:hover .section-menu-item-text {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: 1;
  visibility: visible;
}

.section-menu .section-menu-item.no-icon .section-menu-item-text {
  -webkit-transform: translate(0, 0);
  transform: translate(0, 0);
  opacity: .6;
  visibility: visible;
}

.section-menu .section-menu-item.no-icon:hover .section-menu-item-text,
.section-menu .section-menu-item.no-icon.active .section-menu-item-text {
  opacity: 1;
}

.section-menu .section-menu-item::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 30px;
  right: 0;
}

.section-menu .section-menu-item:first-child::before {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 30px;
  left: 0;
}

.section-menu .section-menu-item .section-menu-item-icon {
  fill: var(--color-icon);
  opacity: .6;
  position: absolute;
  top: 30px;
  left: 50%;
  margin-left: -10px;
  transition: opacity .25s ease-in-out, visibility .25s ease-in-out, -webkit-transform .25s ease-in-out;
  transition: opacity .25s ease-in-out, visibility .25s ease-in-out, transform .25s ease-in-out;
  transition: opacity .25s ease-in-out, visibility .25s ease-in-out, transform .25s ease-in-out, -webkit-transform .25s ease-in-out;
}

.section-menu .section-menu-item .section-menu-item-text {
  width: 100%;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
  position: absolute;
  top: 34px;
  -webkit-transform: translate(0, 20px);
  transform: translate(0, 20px);
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease-in-out, visibility .25s ease-in-out, -webkit-transform .25s ease-in-out;
  transition: opacity .25s ease-in-out, visibility .25s ease-in-out, transform .25s ease-in-out;
  transition: opacity .25s ease-in-out, visibility .25s ease-in-out, transform .25s ease-in-out, -webkit-transform .25s ease-in-out;
}

/*---------------------
    6. MENU WIDE
---------------------*/
.menu-wide {
  display: -ms-flexbox;
  display: flex;
  padding: 50px 16px 50px 60px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.menu-wide .navigation-section {
  width: 184px;
  margin-right: 16px;
}

.menu-wide .navigation-section:last-child {
  margin-right: 0;
}

@-webkit-keyframes menuSlideDownPointerEvents {
  0% {
    pointer-events: none;
  }

  100% {
    pointer-events: auto;
  }
}

@keyframes menuSlideDownPointerEvents {
  0% {
    pointer-events: none;
  }

  100% {
    pointer-events: auto;
  }
}

/*------------------------------------------------------------------
[Table of contents]

1. .sidebar
-------------------------------------------------------------------*/
/*-------------------
    1. SIDEBAR
-------------------*/
.sidebar {
  height: 100%;
  padding-top: 80px;
  position: fixed;
  top: 0;
  z-index: 10000;
}

.sidebar.right {
  right: 0;
}

.sidebar.left {
  left: 0;
}

.sidebar.navigation-widget {
  padding-top: 0;
  margin-top: 80px;
  overflow-y: auto;
  transition: -webkit-transform .35s ease-in-out, margin-top .15s ease-out;
  transition: transform .35s ease-in-out, margin-top .15s ease-out;
  transition: transform .35s ease-in-out, -webkit-transform .35s ease-in-out, margin-top .15s ease-out;
}

.sidebar.navigation-widget.navigation-widget--offset {
  margin-top: 0;
}

.sidebar.navigation-widget.navigation-widget-mobile {
  margin-top: 0;
  z-index: 100000;
}

.sidebar.navigation-widget.navigation-widget-closed {
  padding-top: 20px;
  overflow-y: visible;
}

.sidebar.navigation-widget.navigation-widget-delayed {
  transition: -webkit-transform .35s ease-in-out .25s, margin-top .15s ease-out;
  transition: transform .35s ease-in-out .25s, margin-top .15s ease-out;
  transition: transform .35s ease-in-out .25s, -webkit-transform .35s ease-in-out .25s, margin-top .15s ease-out;
}

.sidebar.navigation-widget.navigation-widget-hidden {
  -webkit-transform: translate(-100%, 0);
  transform: translate(-100%, 0);
}

.sidebar.chat-widget {
  height: 100%;
}

.sidebar.chat-widget.chat-widget-overlay {
  height: auto;
}

.sidebar.chat-widget.chat-widget-overlay .chat-widget-form {
  bottom: 0;
}

.sidebar.chat-widget.closed {
  -webkit-transform: translate(220px, 0);
  transform: translate(220px, 0);
}

.sidebar.chat-widget.closed .chat-widget-form {
  bottom: 0;
}

.sidebar.chat-widget.hidden {
  -webkit-transform: translate(100%, 0);
  transform: translate(100%, 0);
}

.sidebar.chat-widget .chat-widget-form,
.sidebar.chat-widget .chat-widget-button {
  position: absolute;
  left: 0;
  z-index: 9999;
}

.sidebar.chat-widget .chat-widget-form {
  bottom: 80px;
}

.sidebar.chat-widget .chat-widget-button {
  bottom: 0;
}

/*------------------------------------------------------------------
[Table of contents]

1. .section
2. .section-header
3. .section-header-info
4. .section-header-actions
5. .section-filters-bar
6. .section-pager-bar-wrap
7. .section-pager-bar
8. .section-pager
9. .section-results-text
10. .section-banner
-------------------------------------------------------------------*/
/*---------------------
    1. SECTION
---------------------*/
.section .section-filters-bar {
  margin-top: 30px;
}

/*-----------------------
    2. SECTION HEADER
-----------------------*/
.section-header {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.section-header .item-list-options {
  -ms-flex-align: end;
  align-items: flex-end;
}

/*-----------------------------
    3. SECTION HEADER INFO
-----------------------------*/
.section-header-info .section-pretitle {
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
}

.section-header-info .section-title {
  margin-top: 8px;
  font-size: 1.625rem;
  font-weight: 700;
}

.section-header-info .section-title .highlighted {
  color: var(--color-primary-dark);
}

.section-header-info .section-title .highlighted.secondary {
  color: var(--color-secondary);
}

.section-header-info .section-title.pinned::before {
  content: 'pinned';
  display: inline-block;
  margin-right: 12px;
  padding: 4px 8px;
  border-radius: 200px;
  background-color: var(--color-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1em;
  text-transform: uppercase;
  position: relative;
  top: -4px;
}

/*--------------------------------
    4. SECTION HEADER ACTIONS
--------------------------------*/
.section-header-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: end;
  align-items: flex-end;
  padding-bottom: 4px;
}

.section-header-actions .section-header-action {
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  font-weight: 700;
  cursor: pointer;
  transition: color .2s ease-in-out;
}

.section-header-actions .section-header-action:hover {
  color: var(--color-text);
}

.section-header-actions .section-header-action+.section-header-action {
  margin-left: 32px;
}

.section-header-actions .slider-controls {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  width: 60px;
}

.section-header-actions .section-header-subsection {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

.section-header-actions .section-header-subsection:last-child {
  color: var(--color-text-alt-2);
}

.section-header-actions .section-header-subsection+.section-header-subsection {
  margin-left: 26px;
  position: relative;
}

.section-header-actions .section-header-subsection+.section-header-subsection::before {
  content: '';
  width: 2px;
  height: 10px;
  background-color: var(--color-primary);
  position: absolute;
  top: 2px;
  left: -13px;
}

/*------------------------------
    5. SECTION FILTERS BAR
------------------------------*/
.section-filters-bar {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  height: 96px;
  padding: 0 28px;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
  background-color: var(--color-box-background);
}

.section-filters-bar .form+.button {
  margin-top: 0;
}

.section-filters-bar.centered {
  -ms-flex-pack: center;
  justify-content: center;
}

.section-filters-bar.v1 .form .form-select {
  display: none;
}

.section-filters-bar.v2 .form-row .form-item.small {
  max-width: 80px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}

.section-filters-bar.v2 .form-row .form-item:last-child {
  margin-right: 36px;
}

.section-filters-bar.v3 .form {
  display: none;
}

.section-filters-bar.v5 .section-filters-bar-actions:first-child .form {
  display: none;
}

.section-filters-bar .section-filters-bar-actions {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.section-filters-bar .section-filters-bar-actions.full {
  width: 100%;
}

.section-filters-bar .section-filters-bar-actions .form+.filter-tabs {
  margin-left: 80px;
}

.section-filters-bar .section-filters-bar-actions .form+.button {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-left: 16px;
}

.section-filters-bar .filter-tabs {
  height: 96px;
}

.section-filters-bar .section-filters-bar-title {
  font-size: 1rem;
  font-weight: 700;
}

.section-filters-bar .section-filters-bar-title a {
  color: var(--color-text);
  font-weight: 700;
}

.section-filters-bar .section-filters-bar-title .separator {
  display: inline-block;
  width: 2px;
  height: 10px;
  margin: 0 12px;
  background-color: var(--color-primary);
}

/*--------------------------------
    6. SECTION PAGER BAR WRAP
--------------------------------*/
.section-pager-bar-wrap {
  margin-top: 32px;
}

.section-pager-bar-wrap.align-right {
  text-align: right;
}

.section-pager-bar-wrap.align-center {
  text-align: center;
}

.section-pager-bar-wrap .section-pager-bar {
  display: inline-block;
  margin: 0;
}

/*----------------------------
    7. SECTION PAGER BAR
----------------------------*/
.section-pager-bar {
  height: 60px;
  border-radius: 12px;
  background-color: var(--color-box-background);
  box-shadow: var(--color-box-shadow);
}

.section-pager-bar .section-pager {
  height: 100%;
}

.section-pager-bar .slider-control {
  width: 60px;
  height: 60px;
  background-color: var(--color-box-background);
}

.section-pager-bar .slider-control.left {
  border-top-left-radius: 12px;
  border-bottom-left-radius: 12px;
}

.section-pager-bar .slider-control.right {
  border-top-right-radius: 12px;
  border-bottom-right-radius: 12px;
}

/*------------------------
    8. SECTION PAGER
------------------------*/
.section-pager {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.section-pager.secondary .section-pager-item.active .section-pager-item-text,
.section-pager.secondary .section-pager-item:hover .section-pager-item-text {
  color: var(--color-secondary);
}

.section-pager .section-pager-item {
  padding: 0 8px;
  cursor: pointer;
  position: relative;
}

.section-pager .section-pager-item.section-pager-item-no-link {
  cursor: auto;
}

.section-pager .section-pager-item.section-pager-item-no-link:hover .section-pager-item-text {
  background-color: var(--color-box-background);
  color: var(--color-text);
  box-shadow: none;
}

.section-pager .section-pager-item::before {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 12px;
  left: 0;
}

.section-pager .section-pager-item:last-child::after {
  content: '';
  width: 1px;
  height: 20px;
  background-color: var(--color-divider);
  position: absolute;
  top: 12px;
  right: 0;
}

.section-pager .section-pager-item.active .section-pager-item-text,
.section-pager .section-pager-item:hover .section-pager-item-text {
  background-color: var(--color-box-over-box-background);
  color: var(--color-primary-dark);
  box-shadow: var(--color-overbox-shadow);
}

.section-pager .section-pager-item .section-pager-item-text {
  background-color: var(--color-box-background);
  padding: 16px;
  border-radius: 12px;
  font-size: 0.875rem;
  font-weight: 700;
  transition: color .2s ease-in-out, box-shadow .2s ease-in-out, background-color .2s ease-in-out;
}

/*------------------------------
    9. SECTION RESULTS TEXT
------------------------------*/
.section-results-text {
  margin-top: 12px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

/*-------------------------
    10. SECTION BANNER
-------------------------*/
.section-banner {
  min-height: 160px;
  padding: 52px 60px 0 200px;
  border-radius: 12px;
  position: relative;
}

.section-banner .section-banner-icon {
  position: absolute;
  bottom: 0;
  left: 0;
}

.section-banner .section-banner-title,
.section-banner .section-banner-text {
  color: #fff;
}

.section-banner .section-banner-title {
  font-size: 2.25rem;
  font-weight: 700;
}

.section-banner .section-banner-text {
  margin-top: 10px;
  font-size: 1rem;
  font-weight: 500;
}

.section-banner+.post-preview.sticky {
  margin-top: 64px;
}

.section-banner+.forum-heading {
  margin-top: 64px;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1500px) {
  .section-filters-bar.v4 .form-item.split .form-select.small {
    width: 200px;
  }
}

@media screen and (max-width: 1365px) {

  .section-filters-bar.v1,
  .section-filters-bar.v3,
  .section-filters-bar.v4,
  .section-filters-bar.v5,
  .section-filters-bar.v7 {
    -ms-flex-direction: column;
    flex-direction: column;
    height: auto;
    padding: 32px 28px;
  }

  .section-filters-bar.v1 .filter-tabs,
  .section-filters-bar.v3 .filter-tabs,
  .section-filters-bar.v5 .filter-tabs {
    display: none;
  }

  .section-filters-bar.v1 .section-filters-bar-actions,
  .section-filters-bar.v4 .section-filters-bar-actions,
  .section-filters-bar.v7 .section-filters-bar-actions {
    margin-bottom: 40px;
  }

  .section-filters-bar.v1 .section-filters-bar-actions:last-child,
  .section-filters-bar.v4 .section-filters-bar-actions:last-child,
  .section-filters-bar.v7 .section-filters-bar-actions:last-child {
    margin-bottom: 0;
  }

  .section-filters-bar.v1 .section-filters-bar-actions .form {
    display: -ms-flexbox;
    display: flex;
  }

  .section-filters-bar.v1 .section-filters-bar-actions .form .form-select {
    display: block;
    width: 254px;
    margin-left: 16px;
  }

  .section-filters-bar.v3 .form {
    display: block;
  }

  .section-filters-bar.v4 .section-filters-bar-actions {
    margin-bottom: 40px;
  }

  .section-filters-bar.v5 .section-filters-bar-actions {
    width: 100%;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
  }

  .section-filters-bar.v5 .section-filters-bar-actions:first-child .form {
    display: block;
  }

  .section-filters-bar.v5 .section-filters-bar-actions:first-child .form .form-select {
    margin-bottom: 24px;
  }

  .section-filters-bar.v5 .section-filters-bar-actions .form-item.split {
    width: 100%;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
  }

  .section-filters-bar.v5 .section-filters-bar-actions .form-item.split .form-select {
    width: 100%;
    margin: 0 0 24px 0;
  }

  .section-results-text {
    margin-top: 24px;
    text-align: center;
  }
}

@media screen and (max-width: 960px) {
  .section-filters-bar.v1 .section-filters-bar-actions {
    width: 100%;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .section-filters-bar.v1 .section-filters-bar-actions .form {
    display: block;
  }

  .section-filters-bar.v1 .section-filters-bar-actions .form .form-input.with-button {
    width: 100%;
  }

  .section-filters-bar.v1 .section-filters-bar-actions .form .form-select {
    width: 100%;
    margin: 24px 0 0 0;
  }

  .section-filters-bar.v2 {
    -ms-flex-direction: column;
    flex-direction: column;
    height: auto;
    padding: 32px 28px;
  }

  .section-filters-bar.v2 .form-row .form-item:last-child {
    max-width: 100%;
    margin-right: 0;
  }

  .section-filters-bar.v2 .section-filters-bar-actions {
    margin-bottom: 32px;
  }

  .section-filters-bar.v2 .section-filters-bar-actions:last-child {
    margin-bottom: 0;
  }

  .section-filters-bar.v4 .section-filters-bar-actions {
    width: 100%;
    margin-bottom: 0;
  }

  .section-filters-bar.v4 .section-filters-bar-actions .form-item.split {
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
  }

  .section-filters-bar.v4 .section-filters-bar-actions .form-item.split .form-select,
  .section-filters-bar.v4 .section-filters-bar-actions .form-item.split .form-input {
    width: 100%;
    margin: 0 0 24px 0;
  }

  .section-filters-bar.v4 .section-filters-bar-actions:first-child .form-item.split {
    position: relative;
  }

  .section-filters-bar.v4 .section-filters-bar-actions:first-child .form-item.split .form-input {
    width: 100%;
  }

  .section-filters-bar.v4 .section-filters-bar-actions:first-child .form-item.split .form-input input {
    padding-right: 82px;
  }

  .section-filters-bar.v4 .section-filters-bar-actions:first-child .form-item.split .button {
    position: absolute;
    top: 0;
    right: 0;
  }

  .section-filters-bar.v6 {
    -ms-flex-direction: column;
    flex-direction: column;
    height: auto;
    padding: 32px 28px;
  }

  .section-filters-bar.v6.v6-2 .section-filters-bar-actions:first-child .form-item.split {
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
  }

  .section-filters-bar.v6.v6-2 .section-filters-bar-actions:first-child .form-item.split .form-input {
    width: 100%;
  }

  .section-filters-bar.v6.v6-2 .section-filters-bar-actions:first-child .form-item.split .form-input input {
    padding-right: 0;
  }

  .section-filters-bar.v6.v6-2 .section-filters-bar-actions:first-child .form-item.split .button {
    width: 180px;
    margin: 0 auto 16px;
    position: static;
  }

  .section-filters-bar.v6 .section-filters-bar-actions {
    width: 100%;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .section-filters-bar.v6 .section-filters-bar-actions:first-child .form-item.split {
    position: relative;
  }

  .section-filters-bar.v6 .section-filters-bar-actions:first-child .form-item.split .form-input {
    width: 100%;
    margin-bottom: 24px;
  }

  .section-filters-bar.v6 .section-filters-bar-actions:first-child .form-item.split .form-input input {
    padding-right: 82px;
  }

  .section-filters-bar.v6 .section-filters-bar-actions:first-child .form-item.split .button {
    position: absolute;
    top: 0;
    right: 0;
  }

  .section-filters-bar.v7 .section-filters-bar-actions {
    width: 100%;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
  }

  .section-filters-bar.v7 .section-filters-bar-actions .form+.button {
    margin-top: 24px;
  }

  .section-filters-bar.v7 .section-filters-bar-actions .form-item.split {
    position: relative;
  }

  .section-filters-bar.v7 .section-filters-bar-actions .form-item.split .form-input {
    width: 100%;
  }

  .section-filters-bar.v7 .section-filters-bar-actions .form-item.split .form-input input {
    padding-right: 82px;
  }

  .section-filters-bar.v7 .section-filters-bar-actions .form-item.split .button {
    position: absolute;
    top: 0;
    right: 0;
  }

  .section-banner {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    height: 86px;
    min-height: auto;
    padding: 0 28px 0 108px;
  }

  .section-banner .section-banner-icon {
    width: 92px;
    height: 86px;
  }

  .section-banner .section-banner-title {
    font-size: 1.5rem;
  }

  .section-banner .section-banner-text {
    display: none;
  }
}

@media screen and (max-width: 480px) {
  .section-filters-bar.v2 .form-item.split.medium .button {
    width: 100%;
  }

  .section-filters-bar .section-filters-bar-actions:last-child .form-item.split.medium .button {
    width: 100%;
  }
}

.footer-wrap {
  background-color: var(--color-box-background);
}

.footer {
  background-color: var(--color-box-background);
}

.footer.content-grid {
  padding-top: 0;
  padding-bottom: 0;
}

.footer-top {
  padding: 82px 0 94px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.footer-bottom {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: center;
  align-items: center;
  min-height: 90px;
  border-top: 1px solid var(--color-divider);
}

.footer-bottom .footer-bottom-text {
  font-size: 0.875rem;
  font-weight: 700;
}

.footer-bottom .footer-bottom-text a {
  font-weight: 700;
}

.footer-info .footer-info-text {
  width: 284px;
  margin-top: 26px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.footer-info .social-items {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 32px;
}

.footer-info .social-items .social-item {
  margin-top: 12px;
}

.footer-info-brand {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

.footer-info-brand .footer-info-brand-image {
  width: 40px;
  height: auto;
}

.footer-info-brand .footer-info-brand-image+.footer-info-brand-info {
  margin-left: 12px;
}

.footer-info-brand .footer-info-brand-info {
  margin-top: -3px;
}

.footer-info-brand .footer-info-brand-title {
  font-family: var(--font-secondary);
  font-size: 1.375rem;
  font-weight: 900;
  text-transform: uppercase;
}

.footer-info-brand .footer-info-brand-subtitle {
  margin-top: 2px;
  color: var(--color-text-alt);
  font-size: 0.625rem;
  font-weight: 700;
  text-transform: uppercase;
}

.footer-navigation {
  display: -ms-flexbox;
  display: flex;
}

.footer-navigation .navigation-section {
  width: 184px;
  margin-right: 16px;
}

.footer-navigation .navigation-section:last-child {
  margin-right: 0;
}

.navigation-section .navigation-section-title {
  font-size: 1rem;
  font-weight: 700;
}

.navigation-section .navigation-section-links {
  margin-top: 46px;
}

.navigation-section .navigation-section-links:first-child {
  margin-top: 60px;
}

.navigation-section .navigation-section-links .navigation-section-link {
  margin-bottom: 16px;
}

.navigation-section .navigation-section-links .navigation-section-link:last-child {
  margin-bottom: 0;
}

.navigation-section .navigation-section-link {
  display: block;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 500;
}

.navigation-section .navigation-section-link:hover {
  color: var(--color-primary);
  font-weight: 600;
}

/*--------------------
    MEDIA QUERIES 
--------------------*/
@media screen and (max-width: 1365px) {
  .footer-top {
    padding: 64px 0;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
  }

  .footer-info .footer-info-text {
    text-align: center;
  }

  .footer-info .social-items {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .footer-info-brand {
    -ms-flex-pack: center;
    justify-content: center;
  }

  .footer-navigation {
    padding: 0 32px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    display: var(--footer-navigation-display-mobile);
  }

  .footer-navigation .navigation-section {
    margin-top: 64px;
  }
}

@media screen and (max-width: 960px) {
  .footer-navigation .navigation-section {
    width: auto;
    margin-right: 64px;
  }

  .footer-bottom {
    padding: 32px 0;
    -ms-flex-direction: column;
    flex-direction: column;
  }

  .footer-bottom .footer-bottom-text:last-child {
    margin-top: 32px;
  }
}

/*-------------------------
    WORDPRESS OVERRIDES
-------------------------*/
/*---------------
    ADMIN BAR
---------------*/
body.vikinger-top-space .header {
  top: 32px;
}

body.vikinger-top-space .sidebar {
  padding-top: 112px;
}

body.vikinger-top-space .sidebar.navigation-widget {
  margin-top: 112px;
  padding-top: 0;
}

body.vikinger-top-space .sidebar.navigation-widget.navigation-widget--offset {
  margin-top: 32px;
}

body.vikinger-top-space .sidebar.navigation-widget.navigation-widget-closed {
  padding-top: 20px;
}

body.vikinger-top-space .sidebar.navigation-widget-mobile {
  margin-top: 32px;
}

svg {
  overflow: hidden;
  vertical-align: middle;
}

/*----------------------------------
    WORDPRESS GENERATED CLASSES
----------------------------------*/
.aligncenter {
  display: block;
  margin: 5px auto 5px auto;
}

.alignright {
  float: right;
  margin: 5px 0 20px 20px;
}

.alignleft {
  float: left;
  margin: 5px 20px 20px 0;
}

.wp-caption {
  margin-top: 20px;
  max-width: 100%;
  /* Image does not overflow the content area */
}

.wp-caption .wp-caption-text {
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  color: var(--color-text-alt);
  text-align: center;
}

.wp-caption .wp-caption-text a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.wp-caption img {
  max-width: 100%;
  height: auto;
}

/* Text meant only for screen readers. */
.screen-reader-text {
  border: 0;
  clip: rect(1px, 1px, 1px, 1px);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute !important;
  width: 1px;
  word-wrap: normal !important;
  /* Many screen reader and browser combinations announce broken words as they would appear visually. */
}

.screen-reader-text:focus {
  background-color: #eee;
  clip: auto !important;
  -webkit-clip-path: none;
  clip-path: none;
  color: #444;
  display: block;
  font-size: 1em;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000;
  /* Above WP toolbar. */
}

.gallery-caption {
  margin-top: 12px;
  width: 100%;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  text-align: center;
}

.gallery-caption a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.bypostauthor .comment-footer-meta .by-post-author {
  display: block;
}

.sticky .post-sticky {
  color: inherit;
}

/*-------------
    POSTS
-------------*/
.post-preview .post-preview-info.fixed-height {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.post-preview .post-preview-info.fixed-height .post-preview-info-bottom {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -ms-flex-align: start;
  align-items: flex-start;
  height: 100%;
}

.post-preview .post-preview-info.fixed-height .post-preview-text {
  margin-top: 16px;
}

.page-open-content figure>img,
.post-open-content-body figure>img,
.post-comment-text>div figure>img {
  max-width: 100%;
  height: auto;
}

.page-open-content>h1,
.page-open-content>h2,
.page-open-content>h3,
.page-open-content>h4,
.page-open-content>h5,
.page-open-content>h6,
.post-open-content-body>h1,
.post-open-content-body>h2,
.post-open-content-body>h3,
.post-open-content-body>h4,
.post-open-content-body>h5,
.post-open-content-body>h6,
.post-comment-text>div>h1,
.post-comment-text>div>h2,
.post-comment-text>div>h3,
.post-comment-text>div>h4,
.post-comment-text>div>h5,
.post-comment-text>div>h6 {
  margin-top: 60px;
}

.page-open-content>h1:first-child,
.page-open-content>h2:first-child,
.page-open-content>h3:first-child,
.page-open-content>h4:first-child,
.page-open-content>h5:first-child,
.page-open-content>h6:first-child,
.post-open-content-body>h1:first-child,
.post-open-content-body>h2:first-child,
.post-open-content-body>h3:first-child,
.post-open-content-body>h4:first-child,
.post-open-content-body>h5:first-child,
.post-open-content-body>h6:first-child,
.post-comment-text>div>h1:first-child,
.post-comment-text>div>h2:first-child,
.post-comment-text>div>h3:first-child,
.post-comment-text>div>h4:first-child,
.post-comment-text>div>h5:first-child,
.post-comment-text>div>h6:first-child {
  margin-top: 0;
}

.page-open-content>h1,
.post-open-content-body>h1,
.post-comment-text>div>h1 {
  font-size: 2.875rem;
  line-height: 1.0434782609em;
}

.page-open-content>h2,
.post-open-content-body>h2,
.post-comment-text>div>h2 {
  font-size: 2.5rem;
  line-height: 1.05em;
}

.page-open-content>h3,
.post-open-content-body>h3,
.post-comment-text>div>h3 {
  font-size: 2.125rem;
  line-height: 1.0588235294em;
}

.page-open-content>h4,
.post-open-content-body>h4,
.post-comment-text>div>h4 {
  font-size: 1.75rem;
  line-height: 1.1428571429em;
}

.page-open-content>h5,
.post-open-content-body>h5,
.post-comment-text>div>h5 {
  font-size: 1.375rem;
  line-height: 1.1818181818em;
}

.page-open-content>h6,
.post-open-content-body>h6,
.post-comment-text>div>h6 {
  font-size: 1.125rem;
  line-height: 1.2222222222em;
}

.page-open-content>p,
.post-open-content-body>p,
.post-comment-text>div>p {
  margin-top: 32px;
  font-weight: 500;
  line-height: 2em;
}

.page-open-content>p.has-drop-cap+*,
.post-open-content-body>p.has-drop-cap+*,
.post-comment-text>div>p.has-drop-cap+* {
  clear: both;
}

.page-open-content>p:first-child,
.post-open-content-body>p:first-child,
.post-comment-text>div>p:first-child {
  margin-top: 0;
}

.page-open-content>p.wp-block-tag-cloud,
.post-open-content-body>p.wp-block-tag-cloud,
.post-comment-text>div>p.wp-block-tag-cloud {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: 20px;
}

.page-open-content>p.wp-block-tag-cloud .tag-cloud-link,
.post-open-content-body>p.wp-block-tag-cloud .tag-cloud-link,
.post-comment-text>div>p.wp-block-tag-cloud .tag-cloud-link {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin: 12px 12px 0 0;
  min-height: 24px;
  padding: 4px 12px;
  border-radius: 200px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  transition: background-color .2s ease-in-out;
}

.page-open-content>p.wp-block-tag-cloud .tag-cloud-link:hover,
.post-open-content-body>p.wp-block-tag-cloud .tag-cloud-link:hover,
.post-comment-text>div>p.wp-block-tag-cloud .tag-cloud-link:hover {
  color: #fff;
  background-color: var(--color-primary);
}

.page-open-content>p.wp-block-tag-cloud .tag-cloud-link:focus,
.post-open-content-body>p.wp-block-tag-cloud .tag-cloud-link:focus,
.post-comment-text>div>p.wp-block-tag-cloud .tag-cloud-link:focus {
  border: none;
  background-color: var(--color-primary);
}

.page-open-content>p code,
.post-open-content-body>p code,
.post-comment-text>div>p code {
  padding: 4px 8px;
  background-color: #eaeaf5;
}

.page-open-content>p img,
.post-open-content-body>p img,
.post-comment-text>div>p img {
  max-width: 100%;
  height: auto;
}

.page-open-content>p iframe,
.post-open-content-body>p iframe,
.post-comment-text>div>p iframe {
  width: 100%;
}

.page-open-content>img,
.post-open-content-body>img,
.post-comment-text>div>img {
  max-width: 100%;
  height: auto;
}

.page-open-content>code,
.post-open-content-body>code,
.post-comment-text>div>code {
  padding: 4px 8px;
  background-color: #eaeaf5;
}

.page-open-content>ul,
.page-open-content>ol,
.post-open-content-body>ul,
.post-open-content-body>ol,
.post-comment-text>div>ul,
.post-comment-text>div>ol {
  padding-left: 20px;
}

.page-open-content>ul ul,
.page-open-content>ul ol,
.page-open-content>ol ul,
.page-open-content>ol ol,
.post-open-content-body>ul ul,
.post-open-content-body>ul ol,
.post-open-content-body>ol ul,
.post-open-content-body>ol ol,
.post-comment-text>div>ul ul,
.post-comment-text>div>ul ol,
.post-comment-text>div>ol ul,
.post-comment-text>div>ol ol {
  padding-left: 0;
  margin: 18px;
}

.page-open-content>ul li,
.page-open-content>ol li,
.post-open-content-body>ul li,
.post-open-content-body>ol li,
.post-comment-text>div>ul li,
.post-comment-text>div>ol li {
  margin-bottom: 16px;
  display: list-item;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 500;
}

.page-open-content>ul li:last-child,
.page-open-content>ol li:last-child,
.post-open-content-body>ul li:last-child,
.post-open-content-body>ol li:last-child,
.post-comment-text>div>ul li:last-child,
.post-comment-text>div>ol li:last-child {
  margin-bottom: 0;
}

.page-open-content>ul,
.post-open-content-body>ul,
.post-comment-text>div>ul {
  list-style: disc;
}

.page-open-content>ul ul,
.post-open-content-body>ul ul,
.post-comment-text>div>ul ul {
  list-style: circle;
}

.page-open-content>ul ol,
.post-open-content-body>ul ol,
.post-comment-text>div>ul ol {
  list-style: lower-alpha;
}

.page-open-content>ol,
.post-open-content-body>ol,
.post-comment-text>div>ol {
  list-style: decimal;
}

.page-open-content>ol ul,
.post-open-content-body>ol ul,
.post-comment-text>div>ol ul {
  list-style: circle;
}

.page-open-content>ol ol,
.post-open-content-body>ol ol,
.post-comment-text>div>ol ol {
  list-style: lower-alpha;
}

.page-open-content>.post-nav-links,
.page-open-content>.wp-block-code,
.page-open-content>.wp-block-search,
.page-open-content>.wp-block-calendar,
.page-open-content>.wp-block-categories-dropdown,
.page-open-content>.wp-block-archives-dropdown,
.page-open-content>.wp-block-embed,
.page-open-content>.wp-block-cover,
.page-open-content>.wp-block-preformatted,
.page-open-content>.wp-block-file,
.page-open-content>.wp-block-audio,
.page-open-content>.wp-block-media-text,
.page-open-content>.wp-block-columns,
.page-open-content>.wp-block-gallery,
.page-open-content>.wp-block-table,
.page-open-content>.wp-block-quote,
.page-open-content>.wp-block-pullquote,
.page-open-content>ul,
.page-open-content>ol,
.page-open-content>pre,
.page-open-content>blockquote,
.page-open-content>table,
.page-open-content>dl,
.page-open-content>div,
.page-open-content>address,
.post-open-content-body>.post-nav-links,
.post-open-content-body>.wp-block-code,
.post-open-content-body>.wp-block-search,
.post-open-content-body>.wp-block-calendar,
.post-open-content-body>.wp-block-categories-dropdown,
.post-open-content-body>.wp-block-archives-dropdown,
.post-open-content-body>.wp-block-embed,
.post-open-content-body>.wp-block-cover,
.post-open-content-body>.wp-block-preformatted,
.post-open-content-body>.wp-block-file,
.post-open-content-body>.wp-block-audio,
.post-open-content-body>.wp-block-media-text,
.post-open-content-body>.wp-block-columns,
.post-open-content-body>.wp-block-gallery,
.post-open-content-body>.wp-block-table,
.post-open-content-body>.wp-block-quote,
.post-open-content-body>.wp-block-pullquote,
.post-open-content-body>ul,
.post-open-content-body>ol,
.post-open-content-body>pre,
.post-open-content-body>blockquote,
.post-open-content-body>table,
.post-open-content-body>dl,
.post-open-content-body>div,
.post-open-content-body>address,
.post-comment-text>div>.post-nav-links,
.post-comment-text>div>.wp-block-code,
.post-comment-text>div>.wp-block-search,
.post-comment-text>div>.wp-block-calendar,
.post-comment-text>div>.wp-block-categories-dropdown,
.post-comment-text>div>.wp-block-archives-dropdown,
.post-comment-text>div>.wp-block-embed,
.post-comment-text>div>.wp-block-cover,
.post-comment-text>div>.wp-block-preformatted,
.post-comment-text>div>.wp-block-file,
.post-comment-text>div>.wp-block-audio,
.post-comment-text>div>.wp-block-media-text,
.post-comment-text>div>.wp-block-columns,
.post-comment-text>div>.wp-block-gallery,
.post-comment-text>div>.wp-block-table,
.post-comment-text>div>.wp-block-quote,
.post-comment-text>div>.wp-block-pullquote,
.post-comment-text>div>ul,
.post-comment-text>div>ol,
.post-comment-text>div>pre,
.post-comment-text>div>blockquote,
.post-comment-text>div>table,
.post-comment-text>div>dl,
.post-comment-text>div>div,
.post-comment-text>div>address {
  margin-top: 40px;
}

.page-open-content>.post-nav-links:first-child,
.page-open-content>.wp-block-code:first-child,
.page-open-content>.wp-block-search:first-child,
.page-open-content>.wp-block-calendar:first-child,
.page-open-content>.wp-block-categories-dropdown:first-child,
.page-open-content>.wp-block-archives-dropdown:first-child,
.page-open-content>.wp-block-embed:first-child,
.page-open-content>.wp-block-cover:first-child,
.page-open-content>.wp-block-preformatted:first-child,
.page-open-content>.wp-block-file:first-child,
.page-open-content>.wp-block-audio:first-child,
.page-open-content>.wp-block-media-text:first-child,
.page-open-content>.wp-block-columns:first-child,
.page-open-content>.wp-block-gallery:first-child,
.page-open-content>.wp-block-table:first-child,
.page-open-content>.wp-block-quote:first-child,
.page-open-content>.wp-block-pullquote:first-child,
.page-open-content>ul:first-child,
.page-open-content>ol:first-child,
.page-open-content>pre:first-child,
.page-open-content>blockquote:first-child,
.page-open-content>table:first-child,
.page-open-content>dl:first-child,
.page-open-content>div:first-child,
.page-open-content>address:first-child,
.post-open-content-body>.post-nav-links:first-child,
.post-open-content-body>.wp-block-code:first-child,
.post-open-content-body>.wp-block-search:first-child,
.post-open-content-body>.wp-block-calendar:first-child,
.post-open-content-body>.wp-block-categories-dropdown:first-child,
.post-open-content-body>.wp-block-archives-dropdown:first-child,
.post-open-content-body>.wp-block-embed:first-child,
.post-open-content-body>.wp-block-cover:first-child,
.post-open-content-body>.wp-block-preformatted:first-child,
.post-open-content-body>.wp-block-file:first-child,
.post-open-content-body>.wp-block-audio:first-child,
.post-open-content-body>.wp-block-media-text:first-child,
.post-open-content-body>.wp-block-columns:first-child,
.post-open-content-body>.wp-block-gallery:first-child,
.post-open-content-body>.wp-block-table:first-child,
.post-open-content-body>.wp-block-quote:first-child,
.post-open-content-body>.wp-block-pullquote:first-child,
.post-open-content-body>ul:first-child,
.post-open-content-body>ol:first-child,
.post-open-content-body>pre:first-child,
.post-open-content-body>blockquote:first-child,
.post-open-content-body>table:first-child,
.post-open-content-body>dl:first-child,
.post-open-content-body>div:first-child,
.post-open-content-body>address:first-child,
.post-comment-text>div>.post-nav-links:first-child,
.post-comment-text>div>.wp-block-code:first-child,
.post-comment-text>div>.wp-block-search:first-child,
.post-comment-text>div>.wp-block-calendar:first-child,
.post-comment-text>div>.wp-block-categories-dropdown:first-child,
.post-comment-text>div>.wp-block-archives-dropdown:first-child,
.post-comment-text>div>.wp-block-embed:first-child,
.post-comment-text>div>.wp-block-cover:first-child,
.post-comment-text>div>.wp-block-preformatted:first-child,
.post-comment-text>div>.wp-block-file:first-child,
.post-comment-text>div>.wp-block-audio:first-child,
.post-comment-text>div>.wp-block-media-text:first-child,
.post-comment-text>div>.wp-block-columns:first-child,
.post-comment-text>div>.wp-block-gallery:first-child,
.post-comment-text>div>.wp-block-table:first-child,
.post-comment-text>div>.wp-block-quote:first-child,
.post-comment-text>div>.wp-block-pullquote:first-child,
.post-comment-text>div>ul:first-child,
.post-comment-text>div>ol:first-child,
.post-comment-text>div>pre:first-child,
.post-comment-text>div>blockquote:first-child,
.post-comment-text>div>table:first-child,
.post-comment-text>div>dl:first-child,
.post-comment-text>div>div:first-child,
.post-comment-text>div>address:first-child {
  margin-top: 0;
}

.page-open-content .post-nav-links,
.post-open-content-body .post-nav-links,
.post-comment-text>div .post-nav-links {
  clear: both;
}

.page-open-content .post-password-form p,
.post-open-content-body .post-password-form p,
.post-comment-text>div .post-password-form p {
  margin-top: 32px;
  font-weight: 500;
  line-height: 2em;
}

.page-open-content .post-password-form p:first-child,
.post-open-content-body .post-password-form p:first-child,
.post-comment-text>div .post-password-form p:first-child {
  margin-top: 0;
}

.page-open-content .post-password-form label,
.post-open-content-body .post-password-form label,
.post-comment-text>div .post-password-form label {
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 600;
}

.page-open-content .post-password-form input[type="password"],
.post-open-content-body .post-password-form input[type="password"],
.post-comment-text>div .post-password-form input[type="password"] {
  margin-top: 12px;
  height: 48px;
  line-height: 48px;
}

.page-open-content .post-password-form input[type="submit"],
.post-open-content-body .post-password-form input[type="submit"],
.post-comment-text>div .post-password-form input[type="submit"] {
  width: 100%;
  height: 40px;
  margin-top: 22px;
  border-radius: 10px;
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 40px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.page-open-content .post-password-form input[type="submit"]:hover,
.post-open-content-body .post-password-form input[type="submit"]:hover,
.post-comment-text>div .post-password-form input[type="submit"]:hover {
  background-color: var(--color-primary-hover);
}

.page-open-content .wp-block-button,
.post-open-content-body .wp-block-button,
.post-comment-text>div .wp-block-button {
  margin-top: 32px;
}

.page-open-content .wp-block-button.is-style-squared .wp-block-button__link,
.post-open-content-body .wp-block-button.is-style-squared .wp-block-button__link,
.post-comment-text>div .wp-block-button.is-style-squared .wp-block-button__link {
  border-radius: 0;
}

.page-open-content hr:not(.wp-block-separator),
.post-open-content-body hr:not(.wp-block-separator),
.post-comment-text>div hr:not(.wp-block-separator) {
  width: 100%;
  height: 2px;
  margin: 32px auto 0;
  background-color: var(--color-text);
}

.page-open-content address,
.page-open-content dl,
.page-open-content table,
.post-open-content-body address,
.post-open-content-body dl,
.post-open-content-body table,
.post-comment-text>div address,
.post-comment-text>div dl,
.post-comment-text>div table {
  color: var(--color-text);
  font-weight: 500;
  line-height: 2em;
}

.page-open-content q::before,
.page-open-content q::after,
.post-open-content-body q::before,
.post-open-content-body q::after,
.post-comment-text>div q::before,
.post-comment-text>div q::after {
  display: inline;
}

.page-open-content address,
.post-open-content-body address,
.post-comment-text>div address {
  line-height: 1.5em;
}

.page-open-content dl.gallery-item .gallery-caption,
.post-open-content-body dl.gallery-item .gallery-caption,
.post-comment-text>div dl.gallery-item .gallery-caption {
  padding-left: 0;
}

.page-open-content dl dt,
.post-open-content-body dl dt,
.post-comment-text>div dl dt {
  margin-top: 16px;
  font-weight: 700;
}

.page-open-content dl dt:first-child,
.post-open-content-body dl dt:first-child,
.post-comment-text>div dl dt:first-child {
  margin-top: 0;
}

.page-open-content dl dd,
.post-open-content-body dl dd,
.post-comment-text>div dl dd {
  padding-left: 28px;
  margin-top: 8px;
}

.page-open-content dl dd:first-child,
.post-open-content-body dl dd:first-child,
.post-comment-text>div dl dd:first-child {
  margin-top: 0;
}

.page-open-content table,
.page-open-content th,
.page-open-content td,
.post-open-content-body table,
.post-open-content-body th,
.post-open-content-body td,
.post-comment-text>div table,
.post-comment-text>div th,
.post-comment-text>div td {
  border: 1px solid var(--color-border);
}

.page-open-content table,
.post-open-content-body table,
.post-comment-text>div table {
  border-collapse: collapse;
}

.page-open-content th,
.page-open-content td,
.post-open-content-body th,
.post-open-content-body td,
.post-comment-text>div th,
.post-comment-text>div td {
  padding: 8px 12px;
}

.page-open-content th a,
.page-open-content td a,
.post-open-content-body th a,
.post-open-content-body td a,
.post-comment-text>div th a,
.post-comment-text>div td a {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.page-open-content th a:hover,
.page-open-content td a:hover,
.post-open-content-body th a:hover,
.post-open-content-body td a:hover,
.post-comment-text>div th a:hover,
.post-comment-text>div td a:hover {
  text-decoration: underline;
}

.page-open-content .wp-block-table.is-style-stripes th,
.page-open-content .wp-block-table.is-style-stripes td,
.post-open-content-body .wp-block-table.is-style-stripes th,
.post-open-content-body .wp-block-table.is-style-stripes td,
.post-comment-text>div .wp-block-table.is-style-stripes th,
.post-comment-text>div .wp-block-table.is-style-stripes td {
  border: none;
}

.page-open-content .wp-block-separator,
.post-open-content-body .wp-block-separator,
.post-comment-text>div .wp-block-separator {
  width: 100px;
  height: 2px;
  margin: 32px auto 0;
}

.page-open-content .wp-block-separator:not(.has-background),
.post-open-content-body .wp-block-separator:not(.has-background),
.post-comment-text>div .wp-block-separator:not(.has-background) {
  color: var(--color-text);
  background-color: var(--color-text);
}

.page-open-content .wp-block-separator.is-style-wide,
.post-open-content-body .wp-block-separator.is-style-wide,
.post-comment-text>div .wp-block-separator.is-style-wide {
  width: 100%;
}

.page-open-content .wp-block-separator.is-style-dots,
.post-open-content-body .wp-block-separator.is-style-dots,
.post-comment-text>div .wp-block-separator.is-style-dots {
  width: auto;
  height: auto;
}

.page-open-content .wp-block-group,
.post-open-content-body .wp-block-group,
.post-comment-text>div .wp-block-group {
  padding: 32px 28px;
}

.page-open-content .wp-block-group p,
.post-open-content-body .wp-block-group p,
.post-comment-text>div .wp-block-group p {
  margin-top: 32px;
  font-weight: 500;
  line-height: 2em;
}

.page-open-content .wp-block-group p:first-child,
.post-open-content-body .wp-block-group p:first-child,
.post-comment-text>div .wp-block-group p:first-child {
  margin-top: 0;
}

.page-open-content .wp-block-group p img,
.post-open-content-body .wp-block-group p img,
.post-comment-text>div .wp-block-group p img {
  max-width: 100%;
  height: auto;
}

.page-open-content .wp-block-video,
.page-open-content .wp-block-image,
.page-open-content .wp-block-embed-youtube,
.post-open-content-body .wp-block-video,
.post-open-content-body .wp-block-image,
.post-open-content-body .wp-block-embed-youtube,
.post-comment-text>div .wp-block-video,
.post-comment-text>div .wp-block-image,
.post-comment-text>div .wp-block-embed-youtube {
  margin: 50px 0 0;
}

.page-open-content .wp-block-video .alignleft,
.page-open-content .wp-block-image .alignleft,
.page-open-content .wp-block-embed-youtube .alignleft,
.post-open-content-body .wp-block-video .alignleft,
.post-open-content-body .wp-block-image .alignleft,
.post-open-content-body .wp-block-embed-youtube .alignleft,
.post-comment-text>div .wp-block-video .alignleft,
.post-comment-text>div .wp-block-image .alignleft,
.post-comment-text>div .wp-block-embed-youtube .alignleft {
  float: left;
  margin: .5em 2em .5em 0;
}

.page-open-content .wp-block-video .alignright,
.page-open-content .wp-block-image .alignright,
.page-open-content .wp-block-embed-youtube .alignright,
.post-open-content-body .wp-block-video .alignright,
.post-open-content-body .wp-block-image .alignright,
.post-open-content-body .wp-block-embed-youtube .alignright,
.post-comment-text>div .wp-block-video .alignright,
.post-comment-text>div .wp-block-image .alignright,
.post-comment-text>div .wp-block-embed-youtube .alignright {
  float: right;
  margin: .5em 0 .5em 2em;
}

.page-open-content .wp-block-video figcaption,
.page-open-content .wp-block-image figcaption,
.page-open-content .wp-block-embed-youtube figcaption,
.post-open-content-body .wp-block-video figcaption,
.post-open-content-body .wp-block-image figcaption,
.post-open-content-body .wp-block-embed-youtube figcaption,
.post-comment-text>div .wp-block-video figcaption,
.post-comment-text>div .wp-block-image figcaption,
.post-comment-text>div .wp-block-embed-youtube figcaption {
  margin-top: 20px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  text-align: center;
}

.page-open-content .wp-block-video figcaption a,
.page-open-content .wp-block-image figcaption a,
.page-open-content .wp-block-embed-youtube figcaption a,
.post-open-content-body .wp-block-video figcaption a,
.post-open-content-body .wp-block-image figcaption a,
.post-open-content-body .wp-block-embed-youtube figcaption a,
.post-comment-text>div .wp-block-video figcaption a,
.post-comment-text>div .wp-block-image figcaption a,
.post-comment-text>div .wp-block-embed-youtube figcaption a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.page-open-content .wp-block-embed-youtube .wp-block-embed__wrapper,
.post-open-content-body .wp-block-embed-youtube .wp-block-embed__wrapper,
.post-comment-text>div .wp-block-embed-youtube .wp-block-embed__wrapper {
  padding-top: 56.25%;
  position: relative;
}

.page-open-content .wp-block-embed-youtube .wp-block-embed__wrapper iframe,
.post-open-content-body .wp-block-embed-youtube .wp-block-embed__wrapper iframe,
.post-comment-text>div .wp-block-embed-youtube .wp-block-embed__wrapper iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.page-open-content div,
.post-open-content-body div,
.post-comment-text>div div {
  font-weight: 500;
  line-height: 2em;
}

.page-open-content pre,
.page-open-content .wp-block-preformatted,
.post-open-content-body pre,
.post-open-content-body .wp-block-preformatted,
.post-comment-text>div pre,
.post-comment-text>div .wp-block-preformatted {
  padding: 32px 28px;
  border: 1px solid var(--color-border);
  color: var(--color-text);
  line-height: 2em;
  overflow: auto;
}

.page-open-content .wp-block-search .wp-block-search__label,
.post-open-content-body .wp-block-search .wp-block-search__label,
.post-comment-text>div .wp-block-search .wp-block-search__label {
  margin-bottom: 6px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 600;
}

.page-open-content .wp-block-search .wp-block-search__input,
.post-open-content-body .wp-block-search .wp-block-search__input,
.post-comment-text>div .wp-block-search .wp-block-search__input {
  max-width: 100%;
  height: 48px;
  line-height: 48px;
}

.page-open-content .wp-block-search .wp-block-search__button,
.post-open-content-body .wp-block-search .wp-block-search__button,
.post-comment-text>div .wp-block-search .wp-block-search__button {
  width: 100%;
  height: 40px;
  margin: 22px 0 0;
  border-radius: 10px;
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 40px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.page-open-content .wp-block-search .wp-block-search__button:hover,
.post-open-content-body .wp-block-search .wp-block-search__button:hover,
.post-comment-text>div .wp-block-search .wp-block-search__button:hover {
  background-color: var(--color-primary-hover);
}

.page-open-content .wp-block-calendar .wp-calendar-table tbody tr td a,
.post-open-content-body .wp-block-calendar .wp-calendar-table tbody tr td a,
.post-comment-text>div .wp-block-calendar .wp-calendar-table tbody tr td a {
  text-decoration: none;
}

.page-open-content .wp-block-calendar .wp-calendar-table tbody tr td#today,
.post-open-content-body .wp-block-calendar .wp-calendar-table tbody tr td#today,
.post-comment-text>div .wp-block-calendar .wp-calendar-table tbody tr td#today {
  border-radius: 0;
}

.page-open-content .wp-block-categories-dropdown label,
.page-open-content .wp-block-archives-dropdown label,
.post-open-content-body .wp-block-categories-dropdown label,
.post-open-content-body .wp-block-archives-dropdown label,
.post-comment-text>div .wp-block-categories-dropdown label,
.post-comment-text>div .wp-block-archives-dropdown label {
  margin-bottom: 6px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 600;
}

.page-open-content .wp-block-categories-dropdown select,
.page-open-content .wp-block-archives-dropdown select,
.post-open-content-body .wp-block-categories-dropdown select,
.post-open-content-body .wp-block-archives-dropdown select,
.post-comment-text>div .wp-block-categories-dropdown select,
.post-comment-text>div .wp-block-archives-dropdown select {
  width: 100%;
  height: 48px;
  padding: 0 48px 0 20px;
  font-size: 0.875rem;
  cursor: pointer;
  background: url("img/form/select-arrow.png") no-repeat right 20px top 20px;
}

.page-open-content .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper,
.post-open-content-body .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper,
.post-comment-text>div .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper {
  padding-top: 56.25%;
  position: relative;
}

.page-open-content .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper iframe,
.post-open-content-body .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper iframe,
.post-comment-text>div .wp-block-embed.wp-embed-aspect-16-9 .wp-block-embed__wrapper iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.page-open-content .wp-block-embed figcaption,
.post-open-content-body .wp-block-embed figcaption,
.post-comment-text>div .wp-block-embed figcaption {
  width: 100%;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  text-align: center;
}

.page-open-content .wp-block-embed figcaption a,
.post-open-content-body .wp-block-embed figcaption a,
.post-comment-text>div .wp-block-embed figcaption a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.page-open-content .wp-block-cover,
.post-open-content-body .wp-block-cover,
.post-comment-text>div .wp-block-cover {
  width: 100%;
  height: auto;
}

.page-open-content .wp-block-cover.has-background-dim,
.post-open-content-body .wp-block-cover.has-background-dim,
.post-comment-text>div .wp-block-cover.has-background-dim {
  color: #fff;
}

.page-open-content .wp-block-cover.alignleft+*,
.page-open-content .wp-block-cover.alignright+*,
.post-open-content-body .wp-block-cover.alignleft+*,
.post-open-content-body .wp-block-cover.alignright+*,
.post-comment-text>div .wp-block-cover.alignleft+*,
.post-comment-text>div .wp-block-cover.alignright+* {
  margin-top: 0;
}

.page-open-content .wp-block-gallery .blocks-gallery-caption,
.post-open-content-body .wp-block-gallery .blocks-gallery-caption,
.post-comment-text>div .wp-block-gallery .blocks-gallery-caption {
  width: 100%;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  text-align: center;
}

.page-open-content .wp-block-gallery .blocks-gallery-caption a,
.post-open-content-body .wp-block-gallery .blocks-gallery-caption a,
.post-comment-text>div .wp-block-gallery .blocks-gallery-caption a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.page-open-content .wp-block-gallery .blocks-gallery-item__caption,
.post-open-content-body .wp-block-gallery .blocks-gallery-item__caption,
.post-comment-text>div .wp-block-gallery .blocks-gallery-item__caption {
  pointer-events: none;
}

.page-open-content .wp-block-media-text p,
.post-open-content-body .wp-block-media-text p,
.post-comment-text>div .wp-block-media-text p {
  font-weight: 500;
  line-height: 2em;
}

.page-open-content .wp-block-column p,
.post-open-content-body .wp-block-column p,
.post-comment-text>div .wp-block-column p {
  font-size: 1rem;
  font-weight: 500;
  line-height: 2em;
}

.page-open-content .wp-block-column .wp-block-quote,
.post-open-content-body .wp-block-column .wp-block-quote,
.post-comment-text>div .wp-block-column .wp-block-quote {
  margin-top: 0;
}

.page-open-content .wp-block-column ul,
.page-open-content .wp-block-column ol,
.post-open-content-body .wp-block-column ul,
.post-open-content-body .wp-block-column ol,
.post-comment-text>div .wp-block-column ul,
.post-comment-text>div .wp-block-column ol {
  padding-left: 20px;
}

.page-open-content .wp-block-column ul ul,
.page-open-content .wp-block-column ul ol,
.page-open-content .wp-block-column ol ul,
.page-open-content .wp-block-column ol ol,
.post-open-content-body .wp-block-column ul ul,
.post-open-content-body .wp-block-column ul ol,
.post-open-content-body .wp-block-column ol ul,
.post-open-content-body .wp-block-column ol ol,
.post-comment-text>div .wp-block-column ul ul,
.post-comment-text>div .wp-block-column ul ol,
.post-comment-text>div .wp-block-column ol ul,
.post-comment-text>div .wp-block-column ol ol {
  padding-left: 0;
  margin: 18px;
}

.page-open-content .wp-block-column ul li,
.page-open-content .wp-block-column ol li,
.post-open-content-body .wp-block-column ul li,
.post-open-content-body .wp-block-column ol li,
.post-comment-text>div .wp-block-column ul li,
.post-comment-text>div .wp-block-column ol li {
  margin-bottom: 16px;
  display: list-item;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 500;
}

.page-open-content .wp-block-column ul li:last-child,
.page-open-content .wp-block-column ol li:last-child,
.post-open-content-body .wp-block-column ul li:last-child,
.post-open-content-body .wp-block-column ol li:last-child,
.post-comment-text>div .wp-block-column ul li:last-child,
.post-comment-text>div .wp-block-column ol li:last-child {
  margin-bottom: 0;
}

.page-open-content .wp-block-column ul,
.post-open-content-body .wp-block-column ul,
.post-comment-text>div .wp-block-column ul {
  list-style: disc;
}

.page-open-content .wp-block-column ul ul,
.post-open-content-body .wp-block-column ul ul,
.post-comment-text>div .wp-block-column ul ul {
  list-style: circle;
}

.page-open-content .wp-block-column ul ol,
.post-open-content-body .wp-block-column ul ol,
.post-comment-text>div .wp-block-column ul ol {
  list-style: lower-alpha;
}

.page-open-content .wp-block-column ol,
.post-open-content-body .wp-block-column ol,
.post-comment-text>div .wp-block-column ol {
  list-style: decimal;
}

.page-open-content .wp-block-column ol ul,
.post-open-content-body .wp-block-column ol ul,
.post-comment-text>div .wp-block-column ol ul {
  list-style: circle;
}

.page-open-content .wp-block-column ol ol,
.post-open-content-body .wp-block-column ol ol,
.post-comment-text>div .wp-block-column ol ol {
  list-style: lower-alpha;
}

.page-open-content blockquote,
.page-open-content .wp-block-quote,
.page-open-content .wp-block-pullquote,
.post-open-content-body blockquote,
.post-open-content-body .wp-block-quote,
.post-open-content-body .wp-block-pullquote,
.post-comment-text>div blockquote,
.post-comment-text>div .wp-block-quote,
.post-comment-text>div .wp-block-pullquote {
  padding: 0 16px;
  font-size: 1.375rem;
  font-weight: 500;
  line-height: 1.5454545455em;
}

.page-open-content blockquote p,
.page-open-content .wp-block-quote p,
.page-open-content .wp-block-pullquote p,
.post-open-content-body blockquote p,
.post-open-content-body .wp-block-quote p,
.post-open-content-body .wp-block-pullquote p,
.post-comment-text>div blockquote p,
.post-comment-text>div .wp-block-quote p,
.post-comment-text>div .wp-block-pullquote p {
  font-weight: 500;
  line-height: 1.5454545455em;
}

.page-open-content blockquote cite,
.page-open-content .wp-block-quote cite,
.page-open-content .wp-block-pullquote cite,
.post-open-content-body blockquote cite,
.post-open-content-body .wp-block-quote cite,
.post-open-content-body .wp-block-pullquote cite,
.post-comment-text>div blockquote cite,
.post-comment-text>div .wp-block-quote cite,
.post-comment-text>div .wp-block-pullquote cite {
  margin-top: 16px;
  display: block;
  font-size: 1rem;
}

.page-open-content .wp-block-quote.is-style-large p,
.post-open-content-body .wp-block-quote.is-style-large p,
.post-comment-text>div .wp-block-quote.is-style-large p {
  font-size: 1.75rem;
  line-height: 1.4285714286em;
}

.page-open-content .wp-block-quote.is-style-large cite,
.post-open-content-body .wp-block-quote.is-style-large cite,
.post-comment-text>div .wp-block-quote.is-style-large cite {
  font-size: 1.375rem;
}

.page-open-content .wp-block-pullquote,
.post-open-content-body .wp-block-pullquote,
.post-comment-text>div .wp-block-pullquote {
  padding: 32px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
}

.page-open-content .wp-block-pullquote.is-style-solid-color blockquote,
.post-open-content-body .wp-block-pullquote.is-style-solid-color blockquote,
.post-comment-text>div .wp-block-pullquote.is-style-solid-color blockquote {
  max-width: 100%;
}

.page-open-content .tag-list,
.post-open-content-body .tag-list,
.post-comment-text>div .tag-list {
  clear: both;
}

.post-comment-text>div .wp-block-code,
.post-comment-text>div .wp-block-search,
.post-comment-text>div .wp-block-calendar,
.post-comment-text>div .wp-block-categories-dropdown,
.post-comment-text>div .wp-block-archives-dropdown,
.post-comment-text>div .wp-block-embed,
.post-comment-text>div .wp-block-cover,
.post-comment-text>div .wp-block-preformatted,
.post-comment-text>div .wp-block-file,
.post-comment-text>div .wp-block-audio,
.post-comment-text>div .wp-block-media-text,
.post-comment-text>div .wp-block-columns,
.post-comment-text>div .wp-block-gallery,
.post-comment-text>div .wp-block-table,
.post-comment-text>div h1,
.post-comment-text>div h2,
.post-comment-text>div h3,
.post-comment-text>div h4,
.post-comment-text>div h5,
.post-comment-text>div h6,
.post-comment-text>div ul,
.post-comment-text>div ol,
.post-comment-text>div blockquote,
.post-comment-text>div table,
.post-comment-text>div dl,
.post-comment-text>div div {
  white-space: normal;
}

.post-comment-text>div .wp-block-code,
.post-comment-text>div .wp-block-search,
.post-comment-text>div .wp-block-calendar,
.post-comment-text>div .wp-block-categories-dropdown,
.post-comment-text>div .wp-block-archives-dropdown,
.post-comment-text>div .wp-block-embed,
.post-comment-text>div .wp-block-cover,
.post-comment-text>div .wp-block-preformatted,
.post-comment-text>div .wp-block-file,
.post-comment-text>div .wp-block-audio,
.post-comment-text>div .wp-block-media-text,
.post-comment-text>div .wp-block-columns,
.post-comment-text>div .wp-block-gallery,
.post-comment-text>div .wp-block-table,
.post-comment-text>div ul,
.post-comment-text>div ol,
.post-comment-text>div pre,
.post-comment-text>div blockquote,
.post-comment-text>div table,
.post-comment-text>div dl,
.post-comment-text>div div,
.post-comment-text>div address {
  margin-top: 16px;
}

.post-comment-text>div .wp-block-code:first-child,
.post-comment-text>div .wp-block-search:first-child,
.post-comment-text>div .wp-block-calendar:first-child,
.post-comment-text>div .wp-block-categories-dropdown:first-child,
.post-comment-text>div .wp-block-archives-dropdown:first-child,
.post-comment-text>div .wp-block-embed:first-child,
.post-comment-text>div .wp-block-cover:first-child,
.post-comment-text>div .wp-block-preformatted:first-child,
.post-comment-text>div .wp-block-file:first-child,
.post-comment-text>div .wp-block-audio:first-child,
.post-comment-text>div .wp-block-media-text:first-child,
.post-comment-text>div .wp-block-columns:first-child,
.post-comment-text>div .wp-block-gallery:first-child,
.post-comment-text>div .wp-block-table:first-child,
.post-comment-text>div ul:first-child,
.post-comment-text>div ol:first-child,
.post-comment-text>div pre:first-child,
.post-comment-text>div blockquote:first-child,
.post-comment-text>div table:first-child,
.post-comment-text>div dl:first-child,
.post-comment-text>div div:first-child,
.post-comment-text>div address:first-child {
  margin-top: 0;
}

.post-comment-text>div h1,
.post-comment-text>div h2,
.post-comment-text>div h3,
.post-comment-text>div h4,
.post-comment-text>div h5,
.post-comment-text>div h6 {
  margin-top: 30px;
}

.post-comment-text>div h1:first-child,
.post-comment-text>div h2:first-child,
.post-comment-text>div h3:first-child,
.post-comment-text>div h4:first-child,
.post-comment-text>div h5:first-child,
.post-comment-text>div h6:first-child {
  margin-top: 0;
}

.post-comment-text>div table th a,
.post-comment-text>div table td a {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.post-comment-text>div table th a:hover,
.post-comment-text>div table td a:hover {
  text-decoration: underline;
}

/*-----------------
    WP CALENDAR
-----------------*/
.wp-calendar-table {
  margin: 0 auto;
  border-collapse: collapse;
  border-spacing: 0;
}

.wp-calendar-table caption {
  margin-bottom: 16px;
  color: var(--color-text);
  font-size: 1rem;
  font-weight: 700;
}

.wp-calendar-table thead tr th {
  padding: 4px 8px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
  text-align: center;
}

.wp-calendar-table tbody tr td {
  padding: 8px;
  color: var(--color-text);
  font-size: 0.75rem;
  font-weight: 700;
  text-align: center;
}

.wp-calendar-table tbody tr td a {
  color: var(--color-secondary);
  border-bottom: 1px solid var(--color-secondary);
}

.wp-calendar-table tbody tr td#today {
  border-radius: 50%;
  background-color: var(--color-secondary);
  color: #fff;
}

.wp-calendar-table tbody tr td#today a {
  color: #fff;
  text-decoration: none;
}

.wp-calendar-table+.wp-calendar-nav {
  margin-top: 16px;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.wp-calendar-table+.wp-calendar-nav span a {
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
  text-decoration: none;
}

.wp-calendar-table+.wp-calendar-nav span a:hover {
  color: var(--color-primary);
}

/*-----------------
    WIDGET BOX
-----------------*/
.widget-box.widget_media_image {
  padding: 0;
}

.widget-box.widget_media_image .widget-box-title {
  margin: 32px 28px;
}

.widget-box.widget_media_image .widget-box-title+img {
  width: 100%;
  height: auto;
  padding: 0 28px 32px;
  border-radius: 0;
}

.widget-box.widget_media_image img {
  display: block;
  border-radius: 12px;
}

.widget-box.widget_calendar .widget-box-title,
.widget-box.widget_archive .widget-box-title,
.widget-box.widget_recent_comments .widget-box-title,
.widget-box.widget_search .widget-box-title,
.widget-box.widget_text .widget-box-title,
.widget-box.widget_categories .widget-box-title,
.widget-box.widget_meta .widget-box-title,
.widget-box.widget_nav_menu .widget-box-title,
.widget-box.widget_pages .widget-box-title,
.widget-box.widget_recent_entries .widget-box-title,
.widget-box.widget_media_video .widget-box-title,
.widget-box.widget_tag_cloud .widget-box-title,
.widget-box.widget_rss .widget-box-title {
  margin-bottom: 32px;
}

.widget-box.widget_recent_comments ul,
.widget-box.widget_archive ul,
.widget-box.widget_categories ul,
.widget-box.widget_meta ul,
.widget-box.widget_nav_menu ul,
.widget-box.widget_pages ul,
.widget-box.widget_recent_entries ul,
.widget-box.widget_rss ul {
  padding-left: 16px;
  list-style: disc;
}

.widget-box.widget_recent_comments ul ul,
.widget-box.widget_archive ul ul,
.widget-box.widget_categories ul ul,
.widget-box.widget_meta ul ul,
.widget-box.widget_nav_menu ul ul,
.widget-box.widget_pages ul ul,
.widget-box.widget_recent_entries ul ul,
.widget-box.widget_rss ul ul {
  list-style: circle;
  padding: 12px 0 0 16px;
}

.widget-box.widget_recent_comments ul li,
.widget-box.widget_archive ul li,
.widget-box.widget_categories ul li,
.widget-box.widget_meta ul li,
.widget-box.widget_nav_menu ul li,
.widget-box.widget_pages ul li,
.widget-box.widget_recent_entries ul li,
.widget-box.widget_rss ul li {
  margin-bottom: 16px;
  padding-left: 0;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

.widget-box.widget_recent_comments ul li:last-child,
.widget-box.widget_archive ul li:last-child,
.widget-box.widget_categories ul li:last-child,
.widget-box.widget_meta ul li:last-child,
.widget-box.widget_nav_menu ul li:last-child,
.widget-box.widget_pages ul li:last-child,
.widget-box.widget_recent_entries ul li:last-child,
.widget-box.widget_rss ul li:last-child {
  margin-bottom: 0;
}

.widget-box.widget_recent_comments ul li a,
.widget-box.widget_archive ul li a,
.widget-box.widget_categories ul li a,
.widget-box.widget_meta ul li a,
.widget-box.widget_nav_menu ul li a,
.widget-box.widget_pages ul li a,
.widget-box.widget_recent_entries ul li a,
.widget-box.widget_rss ul li a {
  font-weight: 500;
}

.widget-box.widget_nav_menu .menu .menu-item {
  padding: 0;
}

.widget-box.widget_rss ul li {
  margin-bottom: 32px;
}

.widget-box.widget_rss ul li:last-child {
  margin-bottom: 0;
}

.widget-box.widget_rss ul li .rsswidget {
  color: var(--color-primary-dark);
  font-weight: 700;
}

.widget-box.widget_rss ul li .rss-date {
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
  display: block;
}

.widget-box.widget_rss ul li .rssSummary {
  margin-top: 12px;
  color: var(--color-text);
}

.widget-box.widget_rss ul li cite {
  display: block;
  margin-top: 4px;
  color: var(--color-text-alt);
  font-size: 0.75rem;
  font-weight: 500;
}

.widget-box.widget_search .searchform label {
  margin-bottom: 6px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 600;
}

.widget-box.widget_search .searchform input[type="text"] {
  height: 48px;
  line-height: 48px;
}

.widget-box.widget_search .searchform input[type="submit"] {
  width: 100%;
  height: 40px;
  margin-top: 22px;
  border-radius: 10px;
  background-color: var(--color-primary);
  box-shadow: var(--color-primary-shadow);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 40px;
  cursor: pointer;
  transition: background-color .2s ease-in-out, color .2s ease-in-out, border-color .2s ease-in-out, box-shadow .2s ease-in-out;
}

.widget-box.widget_search .searchform input[type="submit"]:hover {
  background-color: var(--color-primary-hover);
}

.widget-box.widget_text .textwidget>* {
  margin-bottom: 32px;
}

.widget-box.widget_text .textwidget>*:last-child {
  margin-bottom: 0;
}

.widget-box.widget_text .textwidget .wp-caption {
  margin-top: 20px;
  max-width: 100%;
  /* Image does not overflow the content area */
}

.widget-box.widget_text .textwidget .wp-caption .wp-caption-text {
  margin-top: 12px;
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
  color: var(--color-text-alt);
  text-align: center;
}

.widget-box.widget_text .textwidget .wp-caption .wp-caption-text a {
  color: var(--color-primary-dark);
  font-weight: 600;
}

.widget-box.widget_text .textwidget .wp-caption img {
  max-width: 100%;
  height: auto;
}

.widget-box.widget_text .textwidget p {
  color: var(--color-text);
  font-size: 0.875rem;
  line-height: 1.7142857143em;
  font-weight: 500;
}

.widget-box.widget_text .textwidget p img {
  display: block;
  width: 100%;
  height: auto;
  margin-top: 12px;
}

.widget-box.widget_tag_cloud .tagcloud {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-top: -12px;
}

.widget-box.widget_tag_cloud .tagcloud .tag-cloud-link {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  margin: 12px 12px 0 0;
  min-height: 24px;
  padding: 4px 12px;
  border-radius: 200px;
  background-color: var(--color-secondary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  transition: background-color .2s ease-in-out;
}

.widget-box.widget_tag_cloud .tagcloud .tag-cloud-link:hover {
  color: #fff;
  background-color: var(--color-primary);
}

.widget-box.widget_tag_cloud .tagcloud .tag-cloud-link:focus {
  border: none;
  background-color: var(--color-primary);
}

.widget-box.widget_tag_cloud .tagcloud .tag-cloud-link .tag-link-count {
  font-weight: 700;
}

.widget-box.widget_text label,
.widget-box.widget_archive label,
.widget-box.widget_categories label {
  margin-bottom: 6px;
  color: var(--color-text-alt);
  font-size: 0.875rem;
  font-weight: 600;
}

.widget-box.widget_text select,
.widget-box.widget_archive select,
.widget-box.widget_categories select {
  width: 100%;
  height: 48px;
  padding: 0 48px 0 20px;
  font-size: 0.875rem;
  cursor: pointer;
  background: url("img/form/select-arrow.png") no-repeat right 20px top 20px;
}

/*-------------
    LOADER
-------------*/
.page-loader-indicator {
  margin-top: 60px;
}

/*------------------
    ANIMATION
------------------*/
.animate-slide-down {
  opacity: 0;
  -webkit-transform: translate(0, -20px);
  transform: translate(0, -20px);
  -webkit-animation: slideDown .4s ease-in-out forwards;
  animation: slideDown .4s ease-in-out forwards;
  transition: opacity .4s ease-in-out, -webkit-transform .4s ease-in-out;
  transition: transform .4s ease-in-out, opacity .4s ease-in-out;
  transition: transform .4s ease-in-out, opacity .4s ease-in-out, -webkit-transform .4s ease-in-out;
}

@-webkit-keyframes slideDown {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, -20px);
    transform: translate(0, -20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@keyframes slideDown {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, -20px);
    transform: translate(0, -20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
  }
}

@media screen and (max-width: 782px) {
  body.vikinger-top-space .header {
    top: 46px;
  }

  body.vikinger-top-space .sidebar.navigation-widget-mobile {
    margin-top: 46px;
  }
}

@media screen and (max-width: 600px) {
  body #wpadminbar {
    position: fixed;
  }
}

.elementor h1,
.elementor h2,
.elementor h3,
.elementor h4,
.elementor h5,
.elementor h6,
.elementor a,
.elementor p {
  color: inherit;
  line-height: inherit;
}

.post-preview .swiper-container {
  z-index: auto;
}

body.buddypress.activation,
body.buddypress.registration {
  display: -ms-flexbox;
  display: flex;
  height: 100%;
  background: var(--color-wplogin-body);
  overflow: hidden;
}

body.buddypress.activation .vkregister-header,
body.buddypress.registration .vkregister-header {
  width: 55%;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
}

body.buddypress.activation .vkregister-header .vkregister-header-pretitle,
body.buddypress.activation .vkregister-header .vkregister-header-title,
body.buddypress.activation .vkregister-header .vkregister-header-text,
body.buddypress.registration .vkregister-header .vkregister-header-pretitle,
body.buddypress.registration .vkregister-header .vkregister-header-title,
body.buddypress.registration .vkregister-header .vkregister-header-text {
  color: var(--color-wplogin-header-text);
  text-align: center;
}

body.buddypress.activation .vkregister-header .vkregister-header-pretitle,
body.buddypress.activation .vkregister-header .vkregister-header-title,
body.buddypress.registration .vkregister-header .vkregister-header-pretitle,
body.buddypress.registration .vkregister-header .vkregister-header-title {
  text-transform: uppercase;
}

body.buddypress.activation .vkregister-header .vkregister-header-pretitle,
body.buddypress.registration .vkregister-header .vkregister-header-pretitle {
  font-size: 1.5rem;
  font-weight: 500;
}

body.buddypress.activation .vkregister-header .vkregister-header-title,
body.buddypress.registration .vkregister-header .vkregister-header-title {
  font-family: var(--font-secondary);
  font-size: 6.5rem;
  font-weight: 900;
}

body.buddypress.activation .vkregister-header .vkregister-header-text,
body.buddypress.registration .vkregister-header .vkregister-header-text {
  width: 400px;
  margin: 32px auto 0;
  font-size: 1.125rem;
  font-weight: 500;
  line-height: 1.3333333333em;
}

body.buddypress.activation .vkregister-header .vkregister-header-text .bold,
body.buddypress.registration .vkregister-header .vkregister-header-text .bold {
  font-weight: 700;
}

body.buddypress.activation #buddypress,
body.buddypress.registration #buddypress {
  width: 45%;
  padding: 80px 0;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-pack: center;
  justify-content: center;
}

body.buddypress.activation #buddypress .vkregister-logo,
body.buddypress.registration #buddypress .vkregister-logo {
  display: block;
  width: auto;
  height: auto;
  margin: 0 auto;
}

body.buddypress.activation #buddypress .vkregister-form-title,
body.buddypress.registration #buddypress .vkregister-form-title {
  margin: 60px 0 40px;
  font-size: 1.625rem;
  font-weight: 700;
  text-align: center;
}

body.buddypress.activation #buddypress #activate-page #template-notices+p,
body.buddypress.registration #buddypress #activate-page #template-notices+p {
  margin: 40px auto 0;
}

body.buddypress.activation #buddypress #template-notices,
body.buddypress.registration #buddypress #template-notices {
  width: 356px;
  min-height: 1px;
  margin: 0 auto;
}

body.buddypress.activation #buddypress #template-notices>p,
body.buddypress.registration #buddypress #template-notices>p {
  font-size: 1rem;
  line-height: 1.375em;
  font-weight: 500;
  text-align: center;
}

body.buddypress.activation #buddypress #template-notices+p,
body.buddypress.registration #buddypress #template-notices+p {
  width: 80%;
  margin: 0 auto 40px;
  font-size: 1rem;
  line-height: 1.375em;
  font-weight: 500;
  text-align: center;
}

body.buddypress.activation #buddypress .bp-template-notice,
body.buddypress.registration #buddypress .bp-template-notice {
  padding: 22px 28px 22px 64px;
  border-radius: 12px;
  box-shadow: var(--color-box-shadow);
  position: relative;
}

body.buddypress.activation #buddypress .bp-template-notice::before,
body.buddypress.registration #buddypress .bp-template-notice::before {
  display: block;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 20px;
  left: 20px;
}

body.buddypress.activation #buddypress .bp-template-notice p,
body.buddypress.registration #buddypress .bp-template-notice p {
  color: #fff;
  font-size: 0.875rem;
  font-weight: 500;
  line-height: 1.2857142857em;
}

body.buddypress.activation #buddypress .bp-template-notice.updated,
body.buddypress.activation #buddypress .bp-template-notice.success,
body.buddypress.registration #buddypress .bp-template-notice.updated,
body.buddypress.registration #buddypress .bp-template-notice.success {
  background-color: #00c7d9;
}

body.buddypress.activation #buddypress .bp-template-notice.updated::before,
body.buddypress.activation #buddypress .bp-template-notice.success::before,
body.buddypress.registration #buddypress .bp-template-notice.updated::before,
body.buddypress.registration #buddypress .bp-template-notice.success::before {
  content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IlN1Y2Nlc3NfQm94X0ljb24iIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCINCgkgeT0iMHB4IiB3aWR0aD0iMjBweCIgaGVpZ2h0PSIyMHB4IiB2aWV3Qm94PSIwIDAgMjAgMjAiIGVuYWJsZS1iYWNrZ3JvdW5kPSJuZXcgMCAwIDIwIDIwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSIjRkZGRkZGIiBkPSJNMTYsMjBINGMtMi4yMDksMC00LTEuNzkxLTQtNFY0YzAtMi4yMDgsMS43OTEtNCw0LTRoMTINCgljMi4yMDksMCw0LDEuNzkxLDQsNHYxMkMyMCwxOC4yMDksMTguMjA5LDIwLDE2LDIweiBNMTgsNGMwLTEuMTAzLTAuODk3LTItMi0ySDRDMi44OTcsMiwyLDIuODk3LDIsNHYxMg0KCWMwLDEuMTAzLDAuODk3LDIuMDAxLDIsMi4wMDFoMTJjMS4xMDMsMCwyLTAuODk4LDItMi4wMDFWNHogTTQuOTk1LDEwLjk3M2wxLjA4OC0xLjc0NmwzLjc3MSwyLjAxNmwzLjI2NS01LjIzN2wxLjg4NiwxLjAwOA0KCWwtNC4zNTQsNi45ODJMNC45OTUsMTAuOTczeiIvPg0KPC9zdmc+DQo=");
}

body.buddypress.activation #buddypress .bp-template-notice.error,
body.buddypress.registration #buddypress .bp-template-notice.error {
  background-color: #fd4350;
}

body.buddypress.activation #buddypress .bp-template-notice.error::before,
body.buddypress.registration #buddypress .bp-template-notice.error::before {
  content: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkVycm9yX0JveF9JY29uIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiDQoJIHk9IjBweCIgd2lkdGg9IjIwcHgiIGhlaWdodD0iMjBweCIgdmlld0JveD0iMCAwIDIwIDIwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyMCAyMCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0iI2ZmZmZmZiIgZD0iTTE2LDIwSDRjLTIuMjA5LDAtNC0xLjc5MS00LTRWNGMwLTIuMjA4LDEuNzkxLTQsNC00aDEyDQoJYzIuMjA5LDAsNCwxLjc5MSw0LDR2MTJDMjAsMTguMjA5LDE4LjIwOSwyMCwxNiwyMHogTTE4LDRjMC0xLjEwMy0wLjg5Ny0yLTItMkg0QzIuODk3LDIsMiwyLjg5NywyLDR2MTINCgljMCwxLjEwMywwLjg5NywyLjAwMSwyLDIuMDAxaDEyYzEuMTAzLDAsMi0wLjg5OCwyLTIuMDAxVjR6IE0xMi40MDIsMTQuMDA2TDEwLDExLjYwM2wtMi40MDMsMi40MDNsLTEuNjAyLTEuNjAzbDIuNDAzLTIuNDAyDQoJTDUuOTk1LDcuNTk4bDEuNjAyLTEuNjAyTDEwLDguMzk5bDIuNDAyLTIuNDAzbDEuNjAzLDEuNjAybC0yLjQwMywyLjQwM2wyLjQwMywyLjQwMkwxMi40MDIsMTQuMDA2eiIvPg0KPC9zdmc+DQo=");
}

body.buddypress.activation #buddypress .page form,
body.buddypress.registration #buddypress .page form {
  width: 356px;
  margin: 40px auto 0;
}

body.buddypress.activation #buddypress .page form #pass-strength-result,
body.buddypress.activation #buddypress .page form .error,
body.buddypress.registration #buddypress .page form #pass-strength-result,
body.buddypress.registration #buddypress .page form .error {
  margin-top: 12px;
  color: #fd4350;
  font-size: 0.875rem;
  font-weight: 700;
}

body.buddypress.activation #buddypress .page form #pass-strength-result.good,
body.buddypress.registration #buddypress .page form #pass-strength-result.good {
  color: #ffba00;
}

body.buddypress.activation #buddypress .page form #pass-strength-result.strong,
body.buddypress.registration #buddypress .page form #pass-strength-result.strong {
  color: #00c7d9;
}

body.buddypress.activation #buddypress .page form input[type="text"],
body.buddypress.activation #buddypress .page form input[type="password"],
body.buddypress.activation #buddypress .page form input[type="email"],
body.buddypress.activation #buddypress .page form input[type="tel"],
body.buddypress.activation #buddypress .page form input[type="search"],
body.buddypress.activation #buddypress .page form input[type="number"],
body.buddypress.activation #buddypress .page form select,
body.buddypress.registration #buddypress .page form input[type="text"],
body.buddypress.registration #buddypress .page form input[type="password"],
body.buddypress.registration #buddypress .page form input[type="email"],
body.buddypress.registration #buddypress .page form input[type="tel"],
body.buddypress.registration #buddypress .page form input[type="search"],
body.buddypress.registration #buddypress .page form input[type="number"],
body.buddypress.registration #buddypress .page form select {
  height: 52px;
}

body.buddypress.activation #buddypress .page form input[type="text"],
body.buddypress.activation #buddypress .page form input[type="password"],
body.buddypress.activation #buddypress .page form input[type="email"],
body.buddypress.activation #buddypress .page form input[type="tel"],
body.buddypress.activation #buddypress .page form input[type="search"],
body.buddypress.activation #buddypress .page form input[type="number"],
body.buddypress.activation #buddypress .page form textarea,
body.buddypress.registration #buddypress .page form input[type="text"],
body.buddypress.registration #buddypress .page form input[type="password"],
body.buddypress.registration #buddypress .page form input[type="email"],
body.buddypress.registration #buddypress .page form input[type="tel"],
body.buddypress.registration #buddypress .page form input[type="search"],
body.buddypress.registration #buddypress .page form input[type="number"],
body.buddypress.registration #buddypress .page form textarea {
  background: var(--color-wplogin-body);
}

body.buddypress.activation #buddypress .page form select,
body.buddypress.registration #buddypress .page form select {
  padding: 0 40px 0 20px;
  font-size: 0.875rem;
  cursor: pointer;
}

body.buddypress.activation #buddypress .page form .form-item+.submit,
body.buddypress.registration #buddypress .page form .form-item+.submit {
  margin-top: 28px;
}

body.buddypress.activation #buddypress .page form .form-input label,
body.buddypress.registration #buddypress .page form .form-input label {
  margin: 0;
  color: var(--color-text-alt-2);
  font-size: 1rem;
  font-weight: 600;
}

body.buddypress.activation #buddypress .page form label,
body.buddypress.registration #buddypress .page form label {
  margin-top: 28px;
}

body.buddypress.activation #buddypress .page form fieldset,
body.buddypress.registration #buddypress .page form fieldset {
  margin-bottom: 28px;
}

body.buddypress.activation #buddypress .page form legend,
body.buddypress.activation #buddypress .page form label,
body.buddypress.registration #buddypress .page form legend,
body.buddypress.registration #buddypress .page form label {
  margin-bottom: 16px;
  color: var(--color-text);
  font-size: 0.875rem;
  font-weight: 700;
}

body.buddypress.activation #buddypress .page form fieldset label,
body.buddypress.registration #buddypress .page form fieldset label {
  margin-top: 0;
}

body.buddypress.activation #buddypress .page form fieldset select,
body.buddypress.registration #buddypress .page form fieldset select {
  margin-bottom: 16px;
}

body.buddypress.activation #buddypress .page form fieldset select:last-child,
body.buddypress.registration #buddypress .page form fieldset select:last-child {
  margin-bottom: 0;
}

body.buddypress.activation #buddypress .page form input[type="submit"],
body.buddypress.registration #buddypress .page form input[type="submit"] {
  width: 100%;
  height: 54px;
  padding: 0 18px;
  border-radius: 12px;
  border-color: transparent;
  background: var(--color-secondary);
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  box-shadow: var(--color-secondary-shadow);
  cursor: pointer;
  transition: background-color .2s ease-in-out;
}

body.buddypress.activation #buddypress .page form input[type="submit"]:hover,
body.buddypress.registration #buddypress .page form input[type="submit"]:hover {
  background: var(--color-secondary-hover);
}

body.buddypress.activation #buddypress .page form .register-section+.register-section,
body.buddypress.registration #buddypress .page form .register-section+.register-section {
  margin-top: 32px;
}

body.buddypress.activation #buddypress .page form .register-section h2,
body.buddypress.registration #buddypress .page form .register-section h2 {
  font-size: 1.125rem;
  margin-bottom: 28px;
}

body.buddypress.activation #buddypress .page form .option-label,
body.buddypress.registration #buddypress .page form .option-label {
  cursor: pointer;
}

body.buddypress.activation #buddypress .page form .option-label input[type="checkbox"],
body.buddypress.activation #buddypress .page form .option-label input[type="radio"],
body.buddypress.registration #buddypress .page form .option-label input[type="checkbox"],
body.buddypress.registration #buddypress .page form .option-label input[type="radio"] {
  margin-right: 6px;
  position: relative;
  top: 2px;
}

body.buddypress.activation #buddypress .page form .wp-editor-tools,
body.buddypress.registration #buddypress .page form .wp-editor-tools {
  margin-bottom: 12px;
}

body.buddypress.activation #buddypress .page form .wp-switch-editor,
body.buddypress.registration #buddypress .page form .wp-switch-editor {
  width: auto;
  height: 30px;
  margin: 0 6px 0 0;
  padding: 0 32px;
  border-radius: 12px;
  border: 1px solid var(--color-border);
  background-color: transparent;
  color: var(--color-text-alt-2);
  font-size: 0.875rem;
  box-shadow: none;
}

body.buddypress.activation #buddypress .page form .wp-switch-editor:last-child,
body.buddypress.registration #buddypress .page form .wp-switch-editor:last-child {
  margin-right: 0;
}

body.buddypress.activation #buddypress .page form .tmce-active .switch-tmce,
body.buddypress.registration #buddypress .page form .tmce-active .switch-tmce {
  border-color: var(--color-primary);
  background-color: var(--color-primary);
  color: #fff;
}

body.buddypress.activation #buddypress .page form .html-active .switch-html,
body.buddypress.registration #buddypress .page form .html-active .switch-html {
  border-color: var(--color-primary);
  background-color: var(--color-primary);
  color: #fff;
}

body.buddypress.activation #buddypress .page form .error,
body.buddypress.activation #buddypress .page form .vk-bp-register-disabled-text,
body.buddypress.registration #buddypress .page form .error,
body.buddypress.registration #buddypress .page form .vk-bp-register-disabled-text {
  color: #fd4350;
  font-weight: 700;
}

body.buddypress.activation #buddypress .page form .vk-bp-register-disabled-text,
body.buddypress.registration #buddypress .page form .vk-bp-register-disabled-text {
  text-align: center;
}

body.buddypress.activation #buddypress .page form .error,
body.buddypress.registration #buddypress .page form .error {
  margin-bottom: 8px;
  font-size: 0.75rem;
}

body.buddypress.activation #buddypress .page form .clear-value,
body.buddypress.registration #buddypress .page form .clear-value {
  color: var(--color-primary);
  font-size: 0.875rem;
  font-weight: 700;
}

body.buddypress.activation #buddypress .page form .field-visibility-settings-toggle,
body.buddypress.activation #buddypress .page form .field-visibility-settings-notoggle,
body.buddypress.registration #buddypress .page form .field-visibility-settings-toggle,
body.buddypress.registration #buddypress .page form .field-visibility-settings-notoggle {
  margin-top: 12px;
  font-size: 0.875rem;
  font-weight: 700;
}

body.buddypress.activation #buddypress .page form .field-visibility-settings-toggle .current-visibility-level,
body.buddypress.activation #buddypress .page form .field-visibility-settings-notoggle .current-visibility-level,
body.buddypress.registration #buddypress .page form .field-visibility-settings-toggle .current-visibility-level,
body.buddypress.registration #buddypress .page form .field-visibility-settings-notoggle .current-visibility-level {
  color: var(--color-primary-dark);
}

body.buddypress.activation #buddypress .vk-bp-register-page-nav,
body.buddypress.registration #buddypress .vk-bp-register-page-nav {
  margin: 32px auto 0;
  padding: 0;
  font-size: 0.875rem;
  font-weight: 700;
  text-align: center;
}

body.buddypress.activation #buddypress .vk-bp-register-page-nav a,
body.buddypress.registration #buddypress .vk-bp-register-page-nav a {
  color: var(--color-text);
  transition: color .2s ease-in-out;
}

body.buddypress.activation #buddypress .vk-bp-register-page-nav a:focus,
body.buddypress.activation #buddypress .vk-bp-register-page-nav a:hover,
body.buddypress.registration #buddypress .vk-bp-register-page-nav a:focus,
body.buddypress.registration #buddypress .vk-bp-register-page-nav a:hover {
  color: var(--color-primary);
}

/*-----------------------
    2. MEDIA QUERIES
-----------------------*/
@media screen and (max-width: 1365px) {

  body.buddypress.activation,
  body.buddypress.registration {
    display: block;
    overflow: auto;
  }

  body.buddypress.activation .vkregister-header,
  body.buddypress.registration .vkregister-header {
    display: none;
  }

  body.buddypress.activation #buddypress,
  body.buddypress.registration #buddypress {
    width: 100%;
    display: block;
  }
}

@media screen and (max-width: 480px) {

  body.buddypress.activation #buddypress,
  body.buddypress.registration #buddypress {
    width: 90%;
    margin: 0 auto;
  }

  body.buddypress.activation #buddypress .page form,
  body.buddypress.activation #buddypress .page #template-notices,
  body.buddypress.registration #buddypress .page form,
  body.buddypress.registration #buddypress .page #template-notices {
    width: auto;
  }
}

/*------------------------------------------------------------------
    MOBILE BOTTOM NAVIGATION
-------------------------------------------------------------------*/
@media screen and (max-width: 959px) {
  body {
    padding-bottom: 95px !important;
  }

  .mobile-bottom-nav {
    position: fixed;
    bottom: 15px;
    left: 15px;
    right: 15px;
    height: 64px;
    background-color: var(--color-header-background, #1d203e);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border-radius: 20px;
    border: 1px solid var(--color-border, rgba(255, 255, 255, 0.08));
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
    z-index: 9999;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    transition: transform 0.3s ease-in-out;
  }

  .mobile-bottom-nav-container {
    width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -ms-flex-align: center;
    align-items: center;
    padding: 0 4px;
  }

  .mobile-bottom-nav-item {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-decoration: none;
    color: var(--color-header-icon, #aeafc0) !important;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    padding: 2px 0;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .mobile-bottom-nav-icon-wrap {
    position: relative;
    width: 24px;
    height: 24px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-bottom: 3px;
    transition: transform 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  }

  .mobile-bottom-nav-icon {
    width: 18px;
    height: 18px;
    fill: var(--color-header-icon, #8f91ac);
    transition: fill 0.25s ease, filter 0.25s ease;
  }

  .mobile-bottom-nav-label {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.1px;
    color: var(--color-header-icon, #8f91ac);
    text-transform: capitalize;
    transition: color 0.25s ease, opacity 0.25s ease;
    opacity: 0.8;
  }

  /* Active and Hover states for standard items */
  .mobile-bottom-nav-item:not(.center-fab):hover,
  .mobile-bottom-nav-item:not(.center-fab).active {
    color: var(--color-header-icon-hover, #ffffff) !important;
  }

  .mobile-bottom-nav-item:not(.center-fab).active .mobile-bottom-nav-icon-wrap {
    transform: translateY(-4px) scale(1.08);
  }

  .mobile-bottom-nav-item:not(.center-fab).active .mobile-bottom-nav-icon {
    fill: var(--color-header-icon-hover, #23d2e2);
    filter: drop-shadow(0 0 4px var(--color-header-icon-hover, #23d2e2));
  }

  .mobile-bottom-nav-item:not(.center-fab).active .mobile-bottom-nav-label {
    color: var(--color-header-icon-hover, #23d2e2);
    opacity: 1;
    font-weight: 700;
  }

  /* Creative Indicator Dot/Line for standard items */
  .mobile-bottom-nav-item:not(.center-fab).active::after {
    content: '';
    position: absolute;
    bottom: -3px;
    width: 10px;
    height: 3px;
    background: var(--color-header-icon-hover, #23d2e2);
    border-radius: 2px;
    box-shadow: 0 0 6px var(--color-header-icon-hover, #23d2e2);
    animation: bottomNavDot 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  }

  /* Creative Floating Action Button (FAB) in the center */
  .mobile-bottom-nav-item.center-fab {
    -ms-flex: 0 0 51px;
    flex: 0 0 51px;
    height: 51px;
    margin-top: -30px;
    border-radius: 50%;
    box-shadow: 0 5px 14px rgba(255, 110, 0, 0.45);
    z-index: 10000;
    position: relative;
    background: transparent !important;
  }

  /* The rotating gradient border */
  .mobile-bottom-nav-item.center-fab::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: conic-gradient(from 0deg, #ffffff, #d3d3d3, #8a8a8a, #d3d3d3, #ffffff);
    border-radius: 50%;
    z-index: 1;
    animation: borderRotate 3s linear infinite;
  }

  /* The inner button background (gradient orange) */
  .mobile-bottom-nav-item.center-fab::after {
    content: '';
    position: absolute;
    top: 3px;
    left: 3px;
    right: 3px;
    bottom: 3px;
    background: linear-gradient(135deg, #ff9200 0%, #ff5e00 100%) !important;
    border-radius: 50%;
    z-index: 2;
    display: block !important;
  }

  .mobile-bottom-nav-item.center-fab .mobile-bottom-nav-icon-wrap {
    margin-bottom: 0;
    width: 22px;
    height: 22px;
    transform: none !important;
    position: relative;
    z-index: 3;
  }

  .mobile-bottom-nav-item.center-fab .mobile-bottom-nav-icon {
    fill: #ffffff !important;
    width: 18px;
    height: 18px;
    filter: none !important;
  }

  .mobile-bottom-nav-item.center-fab .mobile-bottom-nav-label {
    position: absolute;
    bottom: -17px;
    white-space: nowrap;
    font-size: 9px;
    font-weight: 600;
    color: var(--color-header-icon, #8f91ac);
    opacity: 0.8;
    z-index: 3;
  }

  .mobile-bottom-nav-item.center-fab.active {
    box-shadow: 0 7px 18px rgba(255, 110, 0, 0.55);
  }

  .mobile-bottom-nav-item.center-fab.active .mobile-bottom-nav-label {
    color: var(--color-header-icon-hover, #23d2e2);
    opacity: 1;
    font-weight: 700;
    z-index: 3;
  }

  /* Push live chat widgets above the bottom navigation bar on mobile */
  #crisp-client,
  #tawkchat-container,
  .tawk-minified,
  #tawk-iframe-container,
  .zopim,
  iframe.zopim,
  .joinchat,
  #tidio-chat,
  #tidio-chat-iframe,
  #smartsupp-widget,
  #hubspot-messages-iframe-container,
  .fb-customerchat,
  .wa-chat-box,
  .elfsight-app-whatsapp-chat,
  #jivo-iframe-container,
  #chatway-widget-container,
  #chatway-container,
  .chatway-widget-container,
  div[id*="chatway"],
  iframe[id*="chatway"],
  div[class*="chatway"],
  iframe[class*="chatway"],
  #wp-live-chat {
    bottom: 92px !important;
  }
}

@keyframes bottomNavDot {
  0% {
    width: 0;
    opacity: 0;
  }

  100% {
    width: 10px;
    opacity: 1;
  }
}

@keyframes borderRotate {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/* Core Liquid Glass */
.mobile-bottom-nav.liquid-glass {
  backdrop-filter: url(#liquidGlass) blur(5px) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(5px) !important;
  box-shadow: 0 30px 30px rgba(0, 0, 0, 0.15), inset 0 0 20px rgba(0, 0, 0, 0.1), inset 3px 3px 2px -2px rgba(255, 255, 255, 0.7), inset -3px -3px 2px -2px rgba(255, 255, 255, 0.7) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  transition: transform 0.3s ease-in-out, background-color 0.3s ease, border-color 0.3s ease;
}

.mobile-bottom-nav.liquid-glass.theme-light {
  background-color: rgba(255, 255, 255, 0.45) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}

.mobile-bottom-nav.liquid-glass.theme-dark {
  background-color: rgba(29, 32, 62, 0.45) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

/* Light Theme Icons and Text color overrides for high contrast against white glass */
.mobile-bottom-nav.theme-light .mobile-bottom-nav-item:not(.center-fab) {
  color: #3e3f5e !important;
}

.mobile-bottom-nav.theme-light .mobile-bottom-nav-item:not(.center-fab) .mobile-bottom-nav-icon {
  fill: #3e3f5e !important;
}

.mobile-bottom-nav.theme-light .mobile-bottom-nav-item .mobile-bottom-nav-label {
  color: #3e3f5e !important;
  opacity: 0.9;
}

/* Light Theme Active States (using primary theme-matching orange highlights) */
.mobile-bottom-nav.theme-light .mobile-bottom-nav-item:not(.center-fab).active {
  color: #ff6e00 !important;
}

.mobile-bottom-nav.theme-light .mobile-bottom-nav-item:not(.center-fab).active .mobile-bottom-nav-icon {
  fill: #ff6e00 !important;
  filter: drop-shadow(0 0 4px rgba(255, 110, 0, 0.4));
}

.mobile-bottom-nav.theme-light .mobile-bottom-nav-item.active .mobile-bottom-nav-label {
  color: #ff6e00 !important;
  opacity: 1;
  font-weight: 700;
}

.mobile-bottom-nav.theme-light .mobile-bottom-nav-item:not(.center-fab).active::after {
  background: #ff6e00 !important;
  box-shadow: 0 0 6px rgba(255, 110, 0, 0.6) !important;
}

/* Hide on desktop screens */
@media screen and (min-width: 960px) {
  .mobile-bottom-nav {
    display: none !important;
  }
}

/*------------------------------------------------------------------
[Modern Dashboard Custom Layout Redesign]
-------------------------------------------------------------------*/

/* 1. Global Viewport Constraints & Glowing Background */
html,
body {
  overflow: hidden !important;
  height: 100vh !important;
  max-height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
}

body {
  background-color: #f1f3f7 !important;
  background-image: radial-gradient(circle at 85% 0%, rgba(124, 58, 237, 0.09) 0%, rgba(236, 72, 153, 0.05) 30%, transparent 60%) !important;
  background-attachment: fixed !important;
}

/* 2. Sleek Fixed Sidebars (Merged with Main Background) */
.sidebar.navigation-widget {
  margin-top: 0 !important;
  height: 100vh !important;
  background-color: transparent !important;
  border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
  z-index: 100 !important;
}

@media screen and (min-width: 1366px) {
  .sidebar.navigation-widget {
    margin-top: 12px !important;
    height: calc(100vh - 24px) !important;
  }
}

#navigation-widget {
  width: 260px !important;
  background-color: transparent !important;
  border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
}

#navigation-widget-small {
  width: 80px !important;
  background-color: transparent !important;
  border-right: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: none !important;
}

/* Fix sidebar user cover container to fit the sleek look */
.navigation-widget-cover {
  height: 80px !important;
  opacity: 0.85;
}

/* 3. Main Layout Wrapper & Dynamic Left Spacing */
.main-layout-wrapper {
  padding: 12px;
  padding-top: 12px !important;
  height: 100vh !important;
  max-height: 100vh !important;
  overflow: hidden !important;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  transition: padding-left .35s ease-in-out;
}

/* Dynamic Left Padding adjustment based on sidebar state on desktop - closer to sidebar */
@media screen and (min-width: 1366px) {
  #navigation-widget-small:not(.navigation-widget-hidden)~.main-layout-wrapper {
    padding-left: calc(80px + 12px) !important;
  }

  #navigation-widget:not(.navigation-widget-hidden)~.main-layout-wrapper {
    padding-left: calc(260px + 12px) !important;
  }

  #navigation-widget-small.navigation-widget-hidden~#navigation-widget.navigation-widget-hidden~.main-layout-wrapper {
    padding-left: 12px !important;
  }
}

/* 4. Rounded Rectangle Dashboard Container */
.main-layout-container {
  background-color: #f7f9fc !important;
  border-radius: 24px !important;
  border: 1px solid #e7ebf2 !important;
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.03) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  scrollbar-width: none !important;
  /* Hide Firefox scrollbar */
  -ms-overflow-style: none !important;
  /* Hide IE/Edge scrollbar */
  flex: 1;
  display: block !important;
  box-sizing: border-box;
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  -webkit-overflow-scrolling: touch;
}

.main-layout-container::-webkit-scrollbar {
  display: none !important;
  /* Hide Chrome/Safari/Opera scrollbars */
}

/* 5. Integrated Header inside Container */
.header {
  position: sticky !important;
  top: 0 !important;
  z-index: 99 !important;
  background: #ffffff !important;
  border-bottom: 1px solid #e7ebf2 !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 24px 24px 0 0 !important;
  height: 80px !important;
  padding: 0 40px !important;
  box-sizing: border-box !important;
  width: 100% !important;
  flex-shrink: 0 !important;
  margin-bottom: 0 !important;
}

body.admin-bar .header {
  top: 32px !important;
}

@media screen and (max-width: 782px) {
  body.admin-bar .header {
    top: 46px !important;
  }
}

/* 6. Content Grid Formatting overrides */
.content-grid {
  transform: none !important;
  margin: 0 auto !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 32px 40px !important;
  box-sizing: border-box !important;
  overflow: visible !important;
  height: auto !important;
}

/* 7. Compact Unified Footer Inside Container */
.footer-wrap {
  background-color: var(--color-box-background) !important;
  border-top: 1px solid #e7ebf2 !important;
  margin-top: 0 !important;
  padding: 16px 32px !important;
  border-radius: 0 0 24px 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.footer-wrap .footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-direction: row !important;
  padding: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
}

.footer-wrap .footer-top {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  display: flex !important;
  align-items: center !important;
}

.footer-wrap .footer-bottom {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important;
  min-height: auto !important;
  display: flex !important;
  align-items: center !important;
}

.footer-wrap .footer-navigation,
.footer-wrap .footer-info-text,
.footer-wrap .social-items {
  display: none !important;
}

.footer-wrap .footer-bottom-text {
  font-size: 0.75rem !important;
  color: rgba(62, 64, 90, 0.5) !important;
}

.footer-info-brand-image {
  max-height: 20px !important;
  width: auto !important;
  margin-right: 8px !important;
}

.footer-info-brand-title {
  font-size: 0.875rem !important;
  color: #3e405a !important;
  margin: 0 !important;
}

.footer-info-brand-subtitle {
  display: none !important;
}

/* 8. Color Improvements & Legibility Fixes */

/* Header brand text color */
.header .header-brand .header-brand-text {
  color: #3e405a !important;
}

/* Header main menu link colors */
.menu-main .menu-main-item .menu-main-item-link {
  color: rgba(62, 64, 90, 0.8) !important;
  font-weight: 600 !important;
}

.menu-main .menu-main-item:hover>.menu-main-item-link {
  color: #1b1d2e !important;
}

.menu-main-item-link .menu-main-item-link-icon {
  fill: rgba(62, 64, 90, 0.6) !important;
}

.menu-main .menu-main-item:hover>.menu-main-item-link .menu-main-item-link-icon {
  fill: #1b1d2e !important;
}

/* Header action list item icons */
.header .action-item .action-item-icon,
.header .action-list-item .action-list-item-icon {
  fill: rgba(62, 64, 90, 0.7) !important;
}

.header .action-item:hover .action-item-icon,
.header .action-list-item:hover .action-list-item-icon {
  fill: #1b1d2e !important;
}

/* Header Sidemenu Trigger Icon */
.header .sidemenu-trigger .icon-grid {
  fill: rgba(62, 64, 90, 0.7) !important;
}

.header .sidemenu-trigger:hover .icon-grid {
  fill: #1b1d2e !important;
}

/* MagicAI-Style Spinning Gradient Border on Search Input */
.header .interactive-input {
  position: relative !important;
  z-index: 1 !important;
}

/* Spinning conic-gradient disc behind the input */
.header .interactive-input::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  /* Make it big enough to cover a pill-shaped input when spinning */
  width: calc(100% + 80px);
  height: calc(100% + 80px);
  transform: translate(-50%, -50%) rotate(0deg);
  border-radius: 0;
  background: conic-gradient(from 0deg,
      transparent 0%,
      #22c55e 6%,
      #06b6d4 12%,
      #3b82f6 18%,
      #a855f7 24%,
      #ec4899 30%,
      #f59e0b 36%,
      transparent 42%,
      transparent 100%);
  opacity: 0;
  pointer-events: none;
  z-index: 0;
  transition: opacity 0.35s ease;
}

/* Mask: clip the spinning disc to the pill shape */
.header .interactive-input::after {
  content: "" !important;
  position: absolute !important;
  border-radius: 9999px !important;
  background: #ffffff !important;
  pointer-events: none !important;
  z-index: 1 !important;
  /* Slightly smaller than the border glow area, creating ~2px border */
  inset: 2px !important;
}

@keyframes magicai-spin {
  0% {
    transform: translate(-50%, -50%) rotate(0deg);
  }

  100% {
    transform: translate(-50%, -50%) rotate(360deg);
  }
}

/* On focus: reveal and spin */
.header .interactive-input:focus-within::before {
  opacity: 1;
  animation: magicai-spin 3s linear infinite;
}

/* Clip the spinning gradient to the pill border outline */
.header .interactive-input {
  overflow: hidden !important;
  border-radius: 9999px !important;
  height: 46px !important;
}

.header .interactive-input input {
  position: relative !important;
  z-index: 2 !important;
  outline: none !important;
  border: none !important;
  background-color: #f1f5f9 !important;
  background-image: none !important;
  color: #3e405a !important;
  border-radius: 9999px !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
  padding-left: 20px !important;
  padding-right: 48px !important;
  height: 42px !important;
  /* Margin creates the visible border gap */
  margin: 2px !important;
  width: calc(100% - 4px) !important;
  transition: background-color 0.25s ease, box-shadow 0.25s ease !important;
}

.header .interactive-input input:focus {
  background-color: #e2e8f0 !important;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05) !important;
}

.header .interactive-input input::placeholder {
  color: #8b90b0 !important;
  opacity: 1 !important;
}

.header .interactive-input input::-webkit-input-placeholder {
  color: #8b90b0 !important;
}

.header .interactive-input .interactive-input-icon-wrap {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  right: 18px !important;
  width: 20px !important;
  height: 20px !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

.header .interactive-input .interactive-input-icon {
  width: 18px !important;
  height: 18px !important;
  fill: #8b90b0 !important;
  opacity: 1 !important;
  transition: fill 0.2s ease-in-out !important;
}

/* ===== Search Dropdown — Popular & Recent (injected into .dropdown-box) ===== */

/* Hide the source template (only used as data source by JS) */
#rkt-search-dropdown {
  display: none !important;
}

/* Injected content wrapper inside existing dropdown-box */
#rkt-sd-injected {
  padding: 4px 0 !important;
}

/* Section */
.rkt-sd-section {
  padding: 0 !important;
}

.rkt-sd-section+.rkt-sd-section {
  border-top: 1px solid rgba(226, 232, 240, 0.5) !important;
}

/* Section Header */
.rkt-sd-section-header {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 10px 16px 6px !important;
  font-size: 0.7rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: #94a3b8 !important;
}

.rkt-sd-section-icon {
  display: flex !important;
  align-items: center !important;
  color: #94a3b8 !important;
}

.rkt-sd-section-title {
  flex: 1 !important;
}

.rkt-sd-clear-btn {
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  background: none !important;
  border: none !important;
  color: #94a3b8 !important;
  font-size: 0.7rem !important;
  font-weight: 500 !important;
  cursor: pointer !important;
  padding: 2px 6px !important;
  border-radius: 6px !important;
  transition: all 0.15s ease !important;
}

.rkt-sd-clear-btn:hover {
  background: rgba(239, 68, 68, 0.08) !important;
  color: #ef4444 !important;
}

/* Items container */
.rkt-sd-items {
  padding: 4px 8px 8px !important;
}

/* Individual item */
.rkt-sd-item {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  text-decoration: none !important;
  color: #1e293b !important;
  font-size: 0.85rem !important;
  font-weight: 500 !important;
  transition: background 0.15s ease !important;
  position: relative !important;
  cursor: pointer !important;
}

.rkt-sd-item:hover {
  background: rgba(241, 245, 249, 0.8) !important;
}

/* Item icon */
.rkt-sd-item-icon {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 8px !important;
  background: rgba(99, 102, 241, 0.08) !important;
  font-size: 16px !important;
  flex-shrink: 0 !important;
  overflow: hidden !important;
}

.rkt-sd-item-icon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 8px !important;
}

/* Item title */
.rkt-sd-item-title {
  flex: 1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

/* Type badge */
.rkt-sd-item-badge {
  font-size: 0.65rem !important;
  font-weight: 600 !important;
  padding: 2px 8px !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  flex-shrink: 0 !important;
}

.rkt-sd-badge-tool {
  background: rgba(99, 102, 241, 0.1) !important;
  color: #6366f1 !important;
}

.rkt-sd-badge-blog {
  background: rgba(16, 185, 129, 0.1) !important;
  color: #10b981 !important;
}

.rkt-sd-badge-page {
  background: rgba(245, 158, 11, 0.1) !important;
  color: #f59e0b !important;
}

/* Remove recent button */
.rkt-sd-remove-recent {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 22px !important;
  height: 22px !important;
  border-radius: 6px !important;
  border: none !important;
  background: transparent !important;
  color: #cbd5e1 !important;
  cursor: pointer !important;
  padding: 0 !important;
  flex-shrink: 0 !important;
  transition: all 0.15s ease !important;
}

.rkt-sd-remove-recent:hover {
  background: rgba(239, 68, 68, 0.1) !important;
  color: #ef4444 !important;
}

/* Footer with Esc hint */
.rkt-sd-footer {
  display: flex !important;
  justify-content: flex-end !important;
  padding: 6px 14px 8px !important;
  border-top: 1px solid rgba(226, 232, 240, 0.4) !important;
}

.rkt-sd-esc-hint {
  font-size: 0.68rem !important;
  color: #94a3b8 !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
}

.rkt-sd-esc-hint kbd {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 1px 6px !important;
  font-size: 0.65rem !important;
  font-family: inherit !important;
  font-weight: 600 !important;
  background: #f1f5f9 !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: 4px !important;
  color: #64748b !important;
  line-height: 1.4 !important;
}

/* ===== Dark Mode — Search Dropdown ===== */
body.active-dark-mode .rkt-sd-section+.rkt-sd-section {
  border-top-color: rgba(255, 255, 255, 0.06) !important;
}

body.active-dark-mode .rkt-sd-section-header,
body.active-dark-mode .rkt-sd-section-icon {
  color: rgba(255, 255, 255, 0.4) !important;
}

body.active-dark-mode .rkt-sd-clear-btn {
  color: rgba(255, 255, 255, 0.35) !important;
}

body.active-dark-mode .rkt-sd-clear-btn:hover {
  background: rgba(239, 68, 68, 0.15) !important;
  color: #ef4444 !important;
}

body.active-dark-mode .rkt-sd-item {
  color: #e2e8f0 !important;
}

body.active-dark-mode .rkt-sd-item:hover {
  background: rgba(255, 255, 255, 0.06) !important;
}

body.active-dark-mode .rkt-sd-item-icon {
  background: rgba(99, 102, 241, 0.15) !important;
}

body.active-dark-mode .rkt-sd-badge-tool {
  background: rgba(99, 102, 241, 0.2) !important;
  color: #818cf8 !important;
}

body.active-dark-mode .rkt-sd-badge-blog {
  background: rgba(16, 185, 129, 0.2) !important;
  color: #34d399 !important;
}

body.active-dark-mode .rkt-sd-badge-page {
  background: rgba(245, 158, 11, 0.2) !important;
  color: #fbbf24 !important;
}

body.active-dark-mode .rkt-sd-remove-recent {
  color: rgba(255, 255, 255, 0.2) !important;
}

body.active-dark-mode .rkt-sd-remove-recent:hover {
  background: rgba(239, 68, 68, 0.2) !important;
  color: #ef4444 !important;
}

body.active-dark-mode .rkt-sd-footer {
  border-top-color: rgba(255, 255, 255, 0.05) !important;
}

body.active-dark-mode .rkt-sd-esc-hint {
  color: rgba(255, 255, 255, 0.3) !important;
}

body.active-dark-mode .rkt-sd-esc-hint kbd {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.4) !important;
}

/* 9. Responsiveness for smaller screens */
@media screen and (max-width: 1365px) {

  html,
  body {
    overflow: auto !important;
    height: auto !important;
    max-height: none !important;
  }

  .main-layout-wrapper {
    padding: 16px !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #navigation-widget-small:not(.navigation-widget-hidden)~.main-layout-wrapper,
  #navigation-widget:not(.navigation-widget-hidden)~.main-layout-wrapper {
    padding-left: 16px !important;
  }

  .main-layout-container {
    border-radius: 16px !important;
    border-top: 1px solid rgba(226, 232, 240, 0.8) !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }

  .header {
    border-radius: 16px 16px 0 0 !important;
    padding: 0 20px !important;
    position: relative !important;
  }

  .content-grid {
    padding: 24px 20px 80px !important;
    overflow: visible !important;
    height: auto !important;
  }

  .footer-wrap {
    padding: 24px 20px !important;
    border-radius: 0 0 16px 16px !important;
  }
}

@media screen and (max-width: 768px) {
  .main-layout-wrapper {
    padding: 10px !important;
  }

  #navigation-widget-small:not(.navigation-widget-hidden)~.main-layout-wrapper,
  #navigation-widget:not(.navigation-widget-hidden)~.main-layout-wrapper {
    padding-left: 10px !important;
  }

  body.active-dark-mode .main-layout-container,
  .main-layout-container {
    border-radius: 16px !important;
    border-top: 1px solid rgba(226, 232, 240, 0.8) !important;
  }

  body.active-dark-mode .header,
  .header {
    border-radius: 16px 16px 0 0 !important;
    padding: 0 12px !important;
  }

  .content-grid {
    padding: 16px 12px 60px !important;
  }

  .footer-wrap {
    padding: 16px 12px !important;
    border-radius: 0 0 12px 12px !important;
  }
}

/* 10. Sidebar Logo & Collapse Trigger Integration */

/* Offset sidebar position if WordPress admin bar is present */
body.admin-bar .sidebar.navigation-widget {
  top: 32px !important;
  height: calc(100vh - 32px) !important;
}



@media screen and (max-width: 782px) {
  body.admin-bar .sidebar.navigation-widget {
    top: 46px !important;
    height: calc(100vh - 46px) !important;
  }
}

/* Sidebar logo container alignment */
.sidebar-logo-container {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: 80px !important;
  padding: 0 24px !important;
  box-sizing: border-box !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

.sidebar-logo-container.small {
  justify-content: center !important;
  padding: 0 !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08) !important;
}

/* Sidebar logo display and crop */
.sidebar-logo {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  max-height: 40px !important;
}

.sidebar-logo.small-crop {
  width: 36px !important;
  height: 36px !important;
  overflow: hidden !important;
  border-radius: 8px !important;
  display: block !important;
}



.sidebar-logo-text {
  color: #1e293b !important;
  font-family: var(--font-secondary) !important;
  font-size: 1.25rem !important;
  font-weight: 900 !important;
  text-transform: uppercase !important;
  letter-spacing: normal !important;
}

/* Sidebar custom trigger button next to logo */
.custom-sidebar-trigger {
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 8px !important;
  transition: background-color 0.2s ease-in-out !important;
}

.custom-sidebar-trigger:hover {
  background-color: rgba(100, 116, 139, 0.08) !important;
}

.custom-sidebar-trigger .custom-sidebar-trigger-icon {
  fill: #64748b !important;
  width: 20px !important;
  height: 20px !important;
  transition: fill 0.2s ease-in-out !important;
}

.custom-sidebar-trigger:hover .custom-sidebar-trigger-icon {
  fill: #1e293b !important;
}

/* Restored Sidebar User Profile Card Overrides - Fix Overlap */
.sidebar.navigation-widget .user-short-description {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  padding: 16px 20px !important;
  border-bottom: 1px solid rgba(226, 232, 240, 0.5) !important;
  margin-top: 0 !important;
  position: relative !important;
}

/* Undo absolute positioning from default theme styles to prevent overlap with logo */
.sidebar.navigation-widget .user-short-description .user-short-description-avatar {
  position: relative !important;
  display: block !important;
  top: 0 !important;
  left: 0 !important;
  margin: 0 auto 12px !important;
  border: none !important;
  box-shadow: none !important;
}

.sidebar.navigation-widget .user-short-description-title {
  color: #1e293b !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  margin-bottom: 2px !important;
}

.sidebar.navigation-widget .user-short-description-text {
  color: #64748b !important;
  font-size: 0.75rem !important;
  margin-bottom: 8px !important;
}

/* Hide header's default trigger, logo, and brand title on desktop */
@media screen and (min-width: 960px) {

  .header .sidemenu-trigger,
  .header .header-brand,
  .header .logo {
    display: none !important;
  }
}

/* 11. Dark Mode Liquid Glass Integration */

/* Hide background video in light mode */
.dark-mode-bg-video,
.dark-mode-bg-video-wrapper {
  display: none;
}

/* Apply styles when active-dark-mode body class is present */
body.active-dark-mode {
  background-color: #1A1A1A !important;
  background-image: none !important;
}

/* Sidebar in Dark Mode - Solid Dark Grey #1A1A1A */
body.active-dark-mode #navigation-widget,
body.active-dark-mode #navigation-widget-small {
  background-color: #1A1A1A !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-right: 1px solid rgba(255, 255, 255, 0.05) !important;
}

/* Position and size the video background EXACTLY inside the main layout wrapper behind the content card */
body.active-dark-mode .main-layout-wrapper {
  background-color: #1A1A1A !important;
  position: relative !important;
}

body.active-dark-mode .dark-mode-bg-video-wrapper {
  display: block !important;
  position: absolute !important;
  top: 12px !important;
  bottom: 12px !important;
  height: calc(100% - 24px) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  z-index: 1 !important;
  /* Stacked above solid body bg but below content container */
  pointer-events: none !important;
  transform: translateZ(0) !important;
  /* WebKit/Blink border-radius clipping bugfix */
  isolation: isolate !important;
}

body.active-dark-mode .dark-mode-bg-video {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 24px !important;
  /* Direct corner rounding on video element */
}

/* Desktop Viewport Alignment Adjustments based on Sidebar states */
@media screen and (min-width: 1366px) {

  /* Expanded Sidebar layout */
  #navigation-widget:not(.navigation-widget-hidden)~.main-layout-wrapper .dark-mode-bg-video-wrapper {
    left: calc(260px + 12px) !important;
    right: 12px !important;
    width: calc(100% - 260px - 12px - 12px) !important;
  }

  /* Collapsed Sidebar layout */
  #navigation-widget-small:not(.navigation-widget-hidden)~.main-layout-wrapper .dark-mode-bg-video-wrapper {
    left: calc(80px + 12px) !important;
    right: 12px !important;
    width: calc(100% - 80px - 12px - 12px) !important;
  }
}

/* Enable video background on medium viewports, hide only on mobile */
@media screen and (max-width: 1365px) {
  body.active-dark-mode .dark-mode-bg-video-wrapper {
    display: block !important;
    position: fixed !important;
  }
}

@media screen and (max-width: 1365px) and (min-width: 769px) {
  body.active-dark-mode .dark-mode-bg-video-wrapper {
    left: 16px !important;
    right: 16px !important;
    width: calc(100% - 32px) !important;
    top: 16px !important;
    bottom: 16px !important;
    height: calc(100vh - 32px) !important;
  }

  body.active-dark-mode .dark-mode-bg-video-wrapper,
  body.active-dark-mode .dark-mode-bg-video {
    border-radius: 16px !important;
  }
}

@media screen and (max-width: 768px) {
  body.active-dark-mode .dark-mode-bg-video-wrapper {
    left: 10px !important;
    right: 10px !important;
    width: calc(100% - 20px) !important;
    top: 10px !important;
    bottom: 10px !important;
    height: calc(100vh - 20px) !important;
  }

  body.active-dark-mode .dark-mode-bg-video-wrapper,
  body.active-dark-mode .dark-mode-bg-video {
    border-radius: 24px !important;
  }

  /* Custom Floating Header Layout on Mobile */
  .header {
    border-bottom: none !important;
    border-radius: 11px 11px 0 0 !important;
    box-shadow: none !important;
    height: 70px !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
  }

  .header .header-actions.header-actions-full {
    height: auto !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Logo - Floating Card Box */
  .header .logo,
  .header .logo.logo-encased {
    border-radius: 12px !important;
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 10px !important;
    padding: 0 !important;
  }

  .header .logo img,
  .header .logo.logo-encased img {
    max-height: 24px !important;
    width: auto !important;
  }

  /* Mobile menu trigger - Floating Card Box */
  .header .mobilemenu-trigger {
    border-radius: 12px !important;
    width: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Action list wrapper on the right - Floating Pill Box */
  .header .action-list-mobile {
    border-radius: 24px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 12px !important;
    gap: 12px !important;
  }

  /* Hide the ::before and ::after divider lines on mobile pill */
  .header .action-list-mobile::before,
  .header .action-list-mobile::after {
    display: none !important;
  }

  /* Search icon intermediate wrapper - make it visible and sized */
  .header .action-list-mobile .action-list-item-wrap {
    display: flex !important;
    align-items: center !important;
    height: 24px !important;
    width: 24px !important;
    position: relative !important;
    overflow: visible !important;
  }

  /* All action-list-items inside mobile pill */
  .header .action-list-mobile .action-list-item {
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 24px !important;
    height: 24px !important;
  }

  /* Keep the search close icon hidden */
  .header .action-list-mobile .action-list-item.action-list-item-hidden {
    display: none !important;
  }

  /* SVG sizing inside mobile pill */
  .header .action-list-mobile .action-list-item svg,
  .header .action-list-mobile .action-list-item-icon {
    width: 20px !important;
    height: 20px !important;
  }

  /* Mobile theme toggle - inherit same sizing as other action items */
  .header .action-list-mobile .mobile-theme-toggle {
    cursor: pointer !important;
  }

  /* Reposition search overlay for the new header height */
  .header .header-actions.search-bar {
    top: 70px !important;
    height: 50px !important;
    background: transparent !important;
    border: none !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .header .header-actions.search-bar .interactive-input {
    width: 100% !important;
    height: 40px !important;
    border-radius: 12px !important;
    overflow: hidden !important;
  }

  .header .header-actions.search-bar .interactive-input input {
    border-radius: 12px !important;
    height: 100% !important;
    font-size: 14px !important;
  }

  /* Dark Mode Color Themes */
  body.active-dark-mode .header {
    background: #1A1A1A !important;
  }

  body.active-dark-mode .header .logo,
  body.active-dark-mode .header .logo.logo-encased,
  body.active-dark-mode .header .mobilemenu-trigger {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  }

  body.active-dark-mode .header .mobilemenu-trigger .burger-icon .burger-icon-bar {
    background-color: #ffffff !important;
  }

  body.active-dark-mode .header .action-list-mobile {
    background: rgba(255, 255, 255, 0.05) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  }

  body.active-dark-mode .header .action-list-mobile svg,
  body.active-dark-mode .header .action-list-mobile svg use,
  body.active-dark-mode .header .action-list-mobile svg *,
  body.active-dark-mode .header .action-list-mobile .action-list-item-icon {
    fill: #ffffff !important;
    color: #ffffff !important;
  }

  body.active-dark-mode .header .header-actions.search-bar {
    background: transparent !important;
    border: none !important;
  }

  body.active-dark-mode .header .header-actions.search-bar .interactive-input input {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
  }

  body.active-dark-mode .header .header-actions.search-bar .interactive-input input::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
  }

  /* Light Mode Color Themes */
  body:not(.active-dark-mode) .header {
    background: #f7f9fc !important;
  }

  body:not(.active-dark-mode) .header .logo,
  body:not(.active-dark-mode) .header .logo.logo-encased,
  body:not(.active-dark-mode) .header .mobilemenu-trigger {
    background: #ffffff !important;
    border: 1px solid #e7ebf2 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
  }

  body:not(.active-dark-mode) .header .mobilemenu-trigger .burger-icon .burger-icon-bar {
    background-color: #3e3f5e !important;
  }

  body:not(.active-dark-mode) .header .action-list-mobile {
    background: #ffffff !important;
    border: 1px solid #e7ebf2 !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05) !important;
  }

  body:not(.active-dark-mode) .header .action-list-mobile svg,
  body:not(.active-dark-mode) .header .action-list-mobile svg use,
  body:not(.active-dark-mode) .header .action-list-mobile svg *,
  body:not(.active-dark-mode) .header .action-list-mobile .action-list-item-icon {
    fill: #3e3f5e !important;
    color: #3e3f5e !important;
  }

  body:not(.active-dark-mode) .header .header-actions.search-bar {
    background: transparent !important;
    border: none !important;
  }

  body:not(.active-dark-mode) .header .header-actions.search-bar .interactive-input input {
    background: #ffffff !important;
    border: 1px solid #e7ebf2 !important;
    color: #3e3f5e !important;
  }

  body:not(.active-dark-mode) .header .header-actions.search-bar .interactive-input input::placeholder {
    color: #adafca !important;
  }
}

/* Mobile Sidebar Menu — solid opaque background, no glass effect, fully clickable */
body.active-dark-mode #navigation-widget-mobile {
  background: #1A1A1A !important;
  background-color: #1A1A1A !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 4px 0 20px rgba(0, 0, 0, 0.5) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.06) !important;
  z-index: 100001 !important;
  pointer-events: auto !important;
}

body:not(.active-dark-mode) #navigation-widget-mobile {
  background: #ffffff !important;
  background-color: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: 4px 0 20px rgba(0, 0, 0, 0.1) !important;
  border-right: 1px solid #e7ebf2 !important;
  z-index: 100001 !important;
  pointer-events: auto !important;
}

/* Ensure all text and icons inside mobile sidebar are visible */
body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-title,
body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-menu-item-link,
body.active-dark-mode #navigation-widget-mobile .navigation-widget-info-title,
body.active-dark-mode #navigation-widget-mobile .navigation-widget-info-text,
body.active-dark-mode #navigation-widget-mobile .action-item-text,
body.active-dark-mode #navigation-widget-mobile .user-short-description-title,
body.active-dark-mode #navigation-widget-mobile .user-short-description-text {
  color: rgba(255, 255, 255, 0.9) !important;
}

body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-menu-item-link svg,
body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-menu-item-link .menu-item-link-icon,
body.active-dark-mode #navigation-widget-mobile .action-item-icon {
  fill: rgba(255, 255, 255, 0.6) !important;
}

body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-menu-item-link:hover svg,
body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-menu-item-link:hover .menu-item-link-icon,
body.active-dark-mode #navigation-widget-mobile .navigation-widget-section-menu-item-link:hover {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Transparent Rounded Content Card Container in Dark Mode (No Glass Filter to preserve video quality) */
body.active-dark-mode .main-layout-container {
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border-left: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-right: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
  border-radius: 24px !important;
  z-index: 2 !important;
  /* Keep above the background video */
  position: relative !important;
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
}

/* Glassmorphic Header (Direct child of wrapper, floating above content container) */
body.active-dark-mode .header {
  background: rgba(21, 26, 48, 0.3) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-top: none !important;
  border-left: none !important;
  border-right: none !important;
  border-radius: 24px 24px 0 0 !important;
  box-shadow: none !important;
  margin-left: 0 !important;
  margin-top: 0 !important;
  margin-right: 0 !important;
  margin-bottom: 0 !important;
  width: 100% !important;
}

body.active-dark-mode .header .header-brand-text {
  color: #ffffff !important;
}

/* Header Search Form & Input styling (Dark Mode) */
body.active-dark-mode .header .interactive-input::after {
  background: rgba(14, 18, 39, 1) !important;
}

body.active-dark-mode .header .interactive-input input {
  background-color: rgba(14, 18, 39, 0.95) !important;
  background-image: none !important;
  border: none !important;
  color: #ffffff !important;
}

body.active-dark-mode .header .interactive-input input:focus {
  background-color: #0e1227 !important;
  box-shadow: 0 0 24px rgba(6, 182, 212, 0.3), 0 0 50px rgba(139, 92, 246, 0.15) !important;
}

body.active-dark-mode .header .interactive-input input::placeholder {
  color: rgba(255, 255, 255, 0.4) !important;
}

body.active-dark-mode .header .interactive-input input::-webkit-input-placeholder {
  color: rgba(255, 255, 255, 0.4) !important;
}

body.active-dark-mode .header .interactive-input .interactive-input-icon {
  fill: #ffffff !important;
  opacity: 0.8 !important;
}

/* Header Text & Icon colors in Dark Mode */
body.active-dark-mode .menu-main .menu-main-item .menu-main-item-link {
  color: #ffffff !important;
}

body.active-dark-mode .menu-main .menu-main-item .menu-main-item-link svg {
  fill: #ffffff !important;
}

body.active-dark-mode .header .header-brand .header-brand-text {
  color: #ffffff !important;
}

body.active-dark-mode .menu-main .menu-main-item:hover>.menu-main-item-link {
  color: #ffffff !important;
}

body.active-dark-mode .menu-main-item-link .menu-main-item-link-icon {
  fill: rgba(255, 255, 255, 0.5) !important;
}

body.active-dark-mode .menu-main .menu-main-item:hover>.menu-main-item-link .menu-main-item-link-icon {
  fill: #ffffff !important;
}

body.active-dark-mode .header .action-item .action-item-icon,
body.active-dark-mode .header .action-list-item .action-list-item-icon,
body.active-dark-mode .header .action-list-item-icon-wrap .action-list-item-icon,
body.active-dark-mode .header .action-list-item-icon-wrap svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

body.active-dark-mode .header .action-item:hover .action-item-icon,
body.active-dark-mode .header .action-list-item:hover .action-list-item-icon {
  fill: #ffffff !important;
}

body.active-dark-mode .header .sidemenu-trigger .icon-grid {
  fill: rgba(255, 255, 255, 0.6) !important;
}

body.active-dark-mode .header .sidemenu-trigger:hover .icon-grid {
  fill: #ffffff !important;
}

body.active-dark-mode .header .action-item-wrap .action-item-text {
  color: #ffffff !important;
}

/* Sidebar Text & Dividers in Dark Mode */
body.active-dark-mode .sidebar-logo-text {
  color: #ffffff !important;
}

body.active-dark-mode .sidebar-menu-item-text,
body.active-dark-mode .sidebar-menu-item-link,
body.active-dark-mode .sidebar-menu-item-link-icon,
body.active-dark-mode .sidebar-menu-item-link-icon svg {
  color: #94a3b8 !important;
  fill: #94a3b8 !important;
}

body.active-dark-mode .sidebar.navigation-widget .user-short-description-title {
  color: #ffffff !important;
}

body.active-dark-mode .sidebar.navigation-widget .user-short-description-text {
  color: #94a3b8 !important;
}

body.active-dark-mode .sidebar-logo-container {
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .sidebar.navigation-widget .user-short-description {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* Solid Dark Slate Widgets and Cards in Content Area - No Glassmorphism */
body.active-dark-mode .widget-box,
body.active-dark-mode .post-preview,
body.active-dark-mode .banner-promo,
body.active-dark-mode .slider-panel {
  background-color: #181F30 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid rgba(255, 255, 255, 0.05) !important;
  box-shadow: none !important;
}

body.active-dark-mode .widget-box .widget-box-title,
body.active-dark-mode .widget-box .widget-box-text,
body.active-dark-mode .post-preview .post-preview-title,
body.active-dark-mode .post-preview .post-preview-text {
  color: #ffffff !important;
}

/* Typography elements in Dark Mode Content Card */
body.active-dark-mode .main-layout-container h1,
body.active-dark-mode .main-layout-container h2,
body.active-dark-mode .main-layout-container h3,
body.active-dark-mode .main-layout-container h4,
body.active-dark-mode .main-layout-container h5,
body.active-dark-mode .main-layout-container h6 {
  color: #ffffff !important;
}

body.active-dark-mode .main-layout-container p {
  color: #cbd5e1 !important;
}

/* Footer styling in Dark Mode */
body.active-dark-mode .footer-wrap,
body.active-dark-mode .footer-wrap .footer {
  background-color: transparent !important;
  background: transparent !important;
}

body.active-dark-mode .footer-wrap {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .footer-brand-text,
body.active-dark-mode .footer-copyright-text {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* 12. Creative Animated Gradient Scrollbar — MagicAI Style (SimpleBar) */

/* CSS @property for animating the gradient angle */
@property --scroll-gradient-angle {
  syntax: '<angle>';
  initial-value: 0deg;
  inherits: false;
}

@keyframes scrollbar-gradient-spin {
  0% {
    --scroll-gradient-angle: 0deg;
  }

  100% {
    --scroll-gradient-angle: 360deg;
  }
}

/* Hide native scrollbars — SimpleBar handles scrolling */
#navigation-widget {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  overflow-x: hidden !important;
}

#navigation-widget-small {
  scrollbar-width: none !important;
  -ms-overflow-style: none !important;
  overflow: visible !important;
}

#navigation-widget::-webkit-scrollbar,
#navigation-widget-small::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Hide horizontal SimpleBar track */
#navigation-widget .simplebar-track.simplebar-horizontal,
#navigation-widget-small .simplebar-track.simplebar-horizontal {
  display: none !important;
}

/* SimpleBar Track — narrow & transparent */
#navigation-widget .simplebar-track.simplebar-vertical,
#navigation-widget-small .simplebar-track.simplebar-vertical {
  width: 6px !important;
  right: 2px !important;
  background: transparent !important;
}

/* SimpleBar Scrollbar Thumb — animated gradient */
#navigation-widget .simplebar-scrollbar::before,
#navigation-widget-small .simplebar-scrollbar::before {
  background: linear-gradient(var(--scroll-gradient-angle, 0deg),
      #22c55e,
      #06b6d4,
      #3b82f6,
      #a855f7,
      #ec4899,
      #f59e0b,
      #22c55e) !important;
  border-radius: 10px !important;
  opacity: 1 !important;
  left: 1px !important;
  right: 1px !important;
  animation: scrollbar-gradient-spin 3s linear infinite !important;
  transition: opacity 0.2s ease !important;
}

/* Scrollbar thumb minimum size — keep it grabbable */
#navigation-widget .simplebar-scrollbar,
#navigation-widget-small .simplebar-scrollbar {
  min-height: 30px !important;
}

/* Hover glow effect on thumb */
#navigation-widget .simplebar-scrollbar:hover::before,
#navigation-widget-small .simplebar-scrollbar:hover::before {
  opacity: 1 !important;
  box-shadow: 0 0 10px rgba(99, 102, 241, 0.5), 0 0 4px rgba(168, 85, 247, 0.3) !important;
}

/* Hidden by default — only show on scroll */
#navigation-widget .simplebar-track .simplebar-scrollbar::before,
#navigation-widget-small .simplebar-track .simplebar-scrollbar::before {
  opacity: 0 !important;
  transition: opacity 0.3s ease !important;
}

/* Show on scroll (SimpleBar adds .simplebar-visible when scrolling) */
#navigation-widget .simplebar-scrollbar.simplebar-visible::before,
#navigation-widget-small .simplebar-scrollbar.simplebar-visible::before {
  opacity: 1 !important;
}

/* Sidebar logo text — light mode: dark, dark mode: white */
.sidebar-logo-text {
  color: #1e293b !important;
}

body.active-dark-mode .sidebar-logo-text {
  color: #ffffff !important;
}

/* Loading screen — dark grey background */
body:not(.active-dark-mode) .page-loader {
  background-color: #ffffff !important;
}

body:not(.active-dark-mode) .page-loader .page-loader-info .page-loader-info-title,
body:not(.active-dark-mode) .page-loader .page-loader-info .page-loader-info-text {
  color: #1e293b !important;
}

body.active-dark-mode .page-loader {
  background-color: #0e101f !important;
}

body.active-dark-mode .page-loader .page-loader-info .page-loader-info-title,
body.active-dark-mode .page-loader .page-loader-info .page-loader-info-text {
  color: #ffffff !important;
}

/* Dark Mode logo overrides for Sidebar and Page Loader */
body.active-dark-mode .sidebar-logo img,
body.active-dark-mode .page-loader-logo,
body.active-dark-mode .logo img,
body.active-dark-mode .header .logo img,
body.active-dark-mode .vk-el-navigation-mobile-logo img {
  content: url("https://dash.rocketoolz.com/wp-content/uploads/2026/07/white-icon.png") !important;
}

/* 13. Neutral Professional Active Menu Items & Hover Styling in Dark Mode (SaaS Style) */
body.active-dark-mode .menu .menu-item.active>.menu-item-link,
body.active-dark-mode .menu .menu-item.active>.menu-item-link:hover,
body.active-dark-mode .navigation-widget .navigation-widget-section-menu .navigation-widget-section-menu-item .navigation-widget-section-menu-item-link.highlighted,
body.active-dark-mode .menu .menu-item .menu-item-link:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

body.active-dark-mode .menu .menu-item.active>.menu-item-link,
body.active-dark-mode .menu .menu-item.active>.menu-item-link:hover,
body.active-dark-mode .menu .menu-item.active>.menu-item-link .menu-item-link-icon svg,
body.active-dark-mode .navigation-widget .navigation-widget-section-menu .navigation-widget-section-menu-item .navigation-widget-section-menu-item-link.highlighted .menu-item-link-icon svg {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* 14. Liquid Glass Avatar Hexagon and PMPro Badge in Dark Mode (No distortion on text badge) */
body.active-dark-mode .user-short-description-avatar {
  filter: url(#liquidGlass) drop-shadow(0 4px 12px rgba(0, 0, 0, 0.35)) !important;
}

/* Neutral Professional PMPro Badge (SaaS Style - Centered without purple color) */
body.active-dark-mode .vikinger-pmpro-level-tag {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  filter: none !important;
  margin-top: 10px !important;
  padding: 0 !important;
}

body.active-dark-mode .vikinger-pmpro-level-tag .vikinger-pmpro-level-tag-text {
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  color: rgba(255, 255, 255, 0.85) !important;
  padding: 6px 16px !important;
  border-radius: 20px !important;
  font-size: 0.75rem !important;
  font-weight: 600 !important;
  text-shadow: none !important;
  display: inline-block !important;
}

/* 15. Make All SVG/UI Icons White in Dark Mode */
body.active-dark-mode svg,
body.active-dark-mode .menu-item-link-icon,
body.active-dark-mode .menu-item-link-icon svg,
body.active-dark-mode .action-item-icon,
body.active-dark-mode .action-item-icon svg,
body.active-dark-mode .custom-sidebar-trigger-icon,
body.active-dark-mode .custom-sidebar-trigger-icon svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* Sidebar Site Name & Expand Grid Icon (White in Dark Mode) */
body.active-dark-mode .sidebar-logo .sidebar-logo-text {
  color: #ffffff !important;
}

body.active-dark-mode .sidebar-logo-container .custom-sidebar-trigger-icon svg,
body.active-dark-mode .sidebar-logo-container .custom-sidebar-trigger svg {
  fill: #ffffff !important;
  color: #ffffff !important;
}

/* 16. Hide Section Banner Globally */
.section-banner {
  display: none !important;
}

/* 17. Forcefully Hide WP Admin Toolbar & Reset HTML Top Margins */
#wpadminbar {
  display: none !important;
}

html,
html[lang] {
  margin-top: 0 !important;
}

* html body {
  margin-top: 0 !important;
}

@media screen and (max-width: 600px) {
  html {
    margin-top: 0 !important;
  }
}

/* ================================================================
   GLASSMORPHISM — Pure Transparent Glass Effect (Matching Rocketoolz Dashboard)
   ================================================================ */

/* All cards, containers, boxes — Pure Glass with dark theme fallback */
body.active-dark-mode .widget-box,
body.active-dark-mode .sidebar-box,
body.active-dark-mode .post-preview,
body.active-dark-mode .popup-box,
body.active-dark-mode .form-box,
body.active-dark-mode .achievement-box,
body.active-dark-mode .notification-box,
body.active-dark-mode .profile-header,
body.active-dark-mode .user-preview,
body.active-dark-mode .product-preview,
body.active-dark-mode .forum-category,
body.active-dark-mode .table-wrap,
body.active-dark-mode .quick-post,
body.active-dark-mode .calendar-widget,
body.active-dark-mode .post-comment,
body.active-dark-mode .account-hub-content,
body.active-dark-mode .upload-box,
body.active-dark-mode .banner-promo {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow:
    0 40px 100px -20px rgba(0, 0, 0, 0.2),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.1),
    inset 0 20px 40px rgba(255, 255, 255, 0.03) !important;
}

/* User status — NO glass effect */
body.active-dark-mode .user-status {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Section header and info area — NO glass effect */
body.active-dark-mode .section-header,
body.active-dark-mode .section-header-info {
  background: transparent !important;
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Inner child elements — NO glass/border to prevent double glass */
body.active-dark-mode .content-actions,
body.active-dark-mode .section-filters-bar {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Sidebar User Hexagon Avatar Area — liquid glass */
body.active-dark-mode .user-short-description {
  background: rgba(21, 23, 40, 0.6) !important;
  backdrop-filter: blur(30px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  box-shadow:
    0 15px 40px rgba(0, 0, 0, 0.15),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.06),
    inset 0 10px 20px rgba(255, 255, 255, 0.02) !important;
  padding: 20px 12px !important;
  margin: 0 12px 8px !important;
}

/* WooCommerce Shop — Product cards liquid glass */
body.active-dark-mode .woocommerce ul.products li.product,
body.active-dark-mode .woocommerce-page ul.products li.product,
body.active-dark-mode .product-preview {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow:
    0 30px 80px -20px rgba(0, 0, 0, 0.2),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.08),
    inset 0 15px 30px rgba(255, 255, 255, 0.02) !important;
  transition: all 0.3s ease !important;
}

body.active-dark-mode .woocommerce ul.products li.product:hover,
body.active-dark-mode .woocommerce-page ul.products li.product:hover {
  transform: translateY(-4px) !important;
  box-shadow:
    0 40px 100px -20px rgba(0, 0, 0, 0.3),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.12) !important;
}

/* WooCommerce Product Detail — Summary section liquid glass */
body.active-dark-mode .woocommerce div.product .summary,
body.active-dark-mode .woocommerce div.product .woocommerce-product-gallery {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  box-shadow:
    0 30px 80px -20px rgba(0, 0, 0, 0.2),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.08) !important;
}

/* WooCommerce Product Tabs — liquid glass */
body.active-dark-mode .woocommerce div.product .woocommerce-tabs,
body.active-dark-mode .woocommerce div.product .woocommerce-tabs .panel {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px !important;
  box-shadow:
    0 30px 80px -20px rgba(0, 0, 0, 0.2),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.08) !important;
}

/* WooCommerce Tab Navigation */
body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs {
  background: transparent !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 0 !important;
  margin: 0 !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: rgba(255, 255, 255, 0.6) !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: #ffffff !important;
  border-bottom: 2px solid #6366f1 !important;
}

/* WooCommerce Related Products section — liquid glass */
body.active-dark-mode .woocommerce div.product .related.products,
body.active-dark-mode .woocommerce div.product .upsells.products {
  background: rgba(21, 23, 40, 0.7) !important;
  backdrop-filter: blur(30px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(30px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  box-shadow: 0 20px 60px -10px rgba(0, 0, 0, 0.15) !important;
}

/* WooCommerce Dark Mode — Text color fixes */
body.active-dark-mode .woocommerce div.product .product_title,
body.active-dark-mode .woocommerce div.product .price,
body.active-dark-mode .woocommerce div.product .price ins,
body.active-dark-mode .woocommerce .woocommerce-result-count,
body.active-dark-mode .woocommerce h2,
body.active-dark-mode .woocommerce h3 {
  color: #ffffff !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-product-details__short-description,
body.active-dark-mode .woocommerce div.product .woocommerce-product-details__short-description p,
body.active-dark-mode .woocommerce div.product .woocommerce-tabs .panel p,
body.active-dark-mode .woocommerce div.product .woocommerce-tabs .panel li,
body.active-dark-mode .woocommerce .vikinger-wc-categories a {
  color: rgba(255, 255, 255, 0.8) !important;
}

body.active-dark-mode .woocommerce div.product .price del {
  color: rgba(255, 255, 255, 0.4) !important;
}

body.active-dark-mode .woocommerce .woocommerce-breadcrumb,
body.active-dark-mode .woocommerce .woocommerce-breadcrumb a {
  color: rgba(255, 255, 255, 0.5) !important;
}

body.active-dark-mode .woocommerce .woocommerce-breadcrumb a:hover {
  color: #ffffff !important;
}

/* Navigation widget / Sidebar — deep glass */
body.active-dark-mode .navigation-widget {
  background: rgba(16, 18, 30, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  box-shadow:
    inset 0 0 1px 1px rgba(255, 255, 255, 0.08),
    0 20px 60px rgba(0, 0, 0, 0.15) !important;
}

/* Header — glass bar */
body.active-dark-mode .header {
  background: rgba(16, 18, 30, 0.8) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 0.06) !important;
}

/* Dropdown menus — liquid glass */
body.active-dark-mode .dropdown-box,
body.active-dark-mode .dropdown-navigation,
body.active-dark-mode .simple-dropdown {
  background: rgba(16, 18, 30, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    0 30px 80px rgba(0, 0, 0, 0.25),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.1) !important;
}

/* Post content area / inner cards — transparent */
body.active-dark-mode .post-preview .post-preview-info {
  background: rgba(21, 23, 40, 0.65) !important;
}

/* Tooltip / popover — liquid glass */
body.active-dark-mode .tooltip-wrap .tooltip-content,
body.active-dark-mode .xm-tooltip {
  background: rgba(16, 18, 30, 0.85) !important;
  backdrop-filter: blur(40px) saturate(200%) !important;
  -webkit-backdrop-filter: blur(40px) saturate(200%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
}

/* Modal / popup glass */
body.active-dark-mode .popup-box .popup-box-body {
  background: rgba(16, 18, 30, 0.9) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    0 40px 100px rgba(0, 0, 0, 0.3),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.1),
    inset 0 20px 40px rgba(255, 255, 255, 0.03) !important;
}

/* Form inputs — liquid glass */
body.active-dark-mode .form-input,
body.active-dark-mode .form-textarea,
body.active-dark-mode .form-select {
  background: rgba(21, 23, 40, 0.8) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(15px) !important;
  -webkit-backdrop-filter: blur(15px) !important;
}

body.active-dark-mode .form-input:focus,
body.active-dark-mode .form-textarea:focus {
  background: rgba(21, 23, 40, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.2) !important;
  box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 0.06) !important;
}

/* Content grid body — transparent background */
body.active-dark-mode .content-grid {
  background: transparent !important;
}

/* Page body — ensure dark base so glass shows properly */
body.active-dark-mode {
  background-color: #0f1120 !important;
}

/* ================================================================
   LIQUID GLASS — SVG Displacement + Blur + Inset Shine
   ================================================================ */

/* Core liquid glass class — reusable */
.liquid-glass {
  backdrop-filter: url(#liquidGlass) blur(50px) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(50px) !important;
  box-shadow:
    0 30px 30px rgba(0, 0, 0, 0.1),
    inset 0 0 20px rgba(0, 0, 0, 0.1),
    inset 3px 3px 2px -2px rgba(255, 255, 255, 0.8),
    inset -3px -3px 2px -2px rgba(255, 255, 255, 0.8) !important;
}

/* Apply liquid glass to key elements in dark mode */
body.active-dark-mode .post-preview {
  backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  box-shadow:
    0 30px 50px rgba(0, 0, 0, 0.15),
    inset 0 0 20px rgba(0, 0, 0, 0.08),
    inset 3px 3px 2px -2px rgba(255, 255, 255, 0.5),
    inset -3px -3px 2px -2px rgba(255, 255, 255, 0.3) !important;
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
}

body.active-dark-mode .post-preview:hover {
  transform: translateY(-4px);
  box-shadow:
    0 40px 60px rgba(0, 0, 0, 0.2),
    inset 0 0 25px rgba(0, 0, 0, 0.1),
    inset 4px 4px 3px -2px rgba(255, 255, 255, 0.6),
    inset -4px -4px 3px -2px rgba(255, 255, 255, 0.4) !important;
}

/* Post preview info card — liquid glass */
body.active-dark-mode .post-preview-info.fixed-height,
body.active-dark-mode .post-preview .post-preview-info {
  background: rgba(21, 23, 40, 0.75) !important;
  backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-bottom-left-radius: 12px !important;
  border-bottom-right-radius: 12px !important;
  box-shadow:
    0 20px 40px rgba(0, 0, 0, 0.1),
    inset 0 0 15px rgba(0, 0, 0, 0.06),
    inset 3px 3px 2px -2px rgba(255, 255, 255, 0.5),
    inset -3px -3px 2px -2px rgba(255, 255, 255, 0.3) !important;
}

/* Sidebar — liquid glass */
body.active-dark-mode .navigation-widget {
  backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  box-shadow:
    0 20px 60px rgba(0, 0, 0, 0.15),
    inset 0 0 15px rgba(0, 0, 0, 0.08),
    inset 2px 2px 2px -1px rgba(255, 255, 255, 0.4),
    inset -2px -2px 2px -1px rgba(255, 255, 255, 0.2) !important;
}

/* Header — liquid glass */
body.active-dark-mode .header {
  backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  box-shadow:
    0 10px 30px rgba(0, 0, 0, 0.1),
    inset 0 0 10px rgba(0, 0, 0, 0.05),
    inset 2px 2px 2px -1px rgba(255, 255, 255, 0.3),
    inset -2px -2px 2px -1px rgba(255, 255, 255, 0.15) !important;
}

/* Widget boxes — liquid glass */
body.active-dark-mode .widget-box {
  backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: url(#liquidGlass) blur(50px) saturate(210%) !important;
  box-shadow:
    0 25px 50px rgba(0, 0, 0, 0.12),
    inset 0 0 15px rgba(0, 0, 0, 0.06),
    inset 3px 3px 2px -2px rgba(255, 255, 255, 0.4),
    inset -3px -3px 2px -2px rgba(255, 255, 255, 0.25) !important;
}

/* Dropdowns — liquid glass (outer containers) */
body.active-dark-mode .dropdown-box,
body.active-dark-mode .simple-dropdown,
body.active-dark-mode .dropdown-navigation,
body.active-dark-mode .action-list-box {
  background: rgba(16, 18, 30, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    0 30px 60px rgba(0, 0, 0, 0.25),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.1) !important;
}

/* Action lists & sub-menus — NO glass/border (they sit inside header which has glass) */
body.active-dark-mode .action-list,
body.active-dark-mode .menu .sub-menu,
body.active-dark-mode .header-dropdown-trigger+.dropdown,
body.active-dark-mode .notification-dropdown,
body.active-dark-mode .settings-dropdown {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Make inner dropdown elements transparent so they don't block the blur */
body.active-dark-mode .dropdown-box .dropdown-box-header,
body.active-dark-mode .dropdown-box .dropdown-box-list,
body.active-dark-mode .dropdown-box .dropdown-box-actions,
body.active-dark-mode .dropdown-box .dropdown-box-category,
body.active-dark-mode .dropdown-box-list-item,
body.active-dark-mode .dropdown-navigation .dropdown-navigation-link {
  background-color: transparent !important;
  background: transparent !important;
}

/* Dropdown footer actions / button subtle transparency */
body.active-dark-mode .dropdown-box .dropdown-box-actions {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .dropdown-box-button {
  background-color: rgba(255, 255, 255, 0.08) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.active-dark-mode .dropdown-box-button:hover {
  background-color: rgba(255, 255, 255, 0.15) !important;
}

body.active-dark-mode .dropdown-box-list-item:hover {
  background-color: rgba(255, 255, 255, 0.06) !important;
}

body.active-dark-mode .dropdown-navigation .dropdown-navigation-link:hover {
  background-color: transparent !important;
}

/* Native select elements — glass style */
body.active-dark-mode select {
  color: rgba(255, 255, 255, 0.85) !important;
  border-radius: 10px !important;
  background: rgba(21, 23, 40, 0.8) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    inset 0 0 10px rgba(0, 0, 0, 0.05),
    inset 2px 2px 2px -1px rgba(255, 255, 255, 0.35),
    inset -2px -2px 2px -1px rgba(255, 255, 255, 0.2) !important;
}

/* Form row split (Category / Filter / Order bar) — transparent in dark mode */
body.active-dark-mode .form-row.split {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Form select dropdown wrapper — transparent to prevent clipping absolute labels */
body.active-dark-mode .form-select {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

/* Form select label — floating with solid background to hide the border behind it */
body.active-dark-mode .form-select label {
  background-color: #0f1120 !important;
  /* matches page background */
  color: rgba(255, 255, 255, 0.6) !important;
  z-index: 5 !important;
  position: absolute !important;
  top: -8px !important;
  left: 12px !important;
  padding: 0 6px !important;
}

/* Section filters bar — pure glass */
body.active-dark-mode .section-filters-bar {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  box-shadow:
    0 15px 40px rgba(0, 0, 0, 0.1),
    inset 0 0 12px rgba(0, 0, 0, 0.05),
    inset 2px 2px 2px -1px rgba(255, 255, 255, 0.35),
    inset -2px -2px 2px -1px rgba(255, 255, 255, 0.2) !important;
}

/* Post preview buttons container inside content action */
.content-action .post-buttons-container {
  margin-top: 0 !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

/* Dark mode favorite button & status custom styles */
body.active-dark-mode .vikinger-favorite-button {
  background: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.85) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

body.active-dark-mode .vikinger-favorite-button:hover {
  background: rgba(255, 255, 255, 0.15) !important;
}

body.active-dark-mode .vikinger-favorite-button.favorited {
  background: #23d2e2 !important;
  color: #fff !important;
  border-color: #23d2e2 !important;
}

body.active-dark-mode .vikinger-favorite-button.favorited:hover {
  background: #1eb9c8 !important;
}

body.active-dark-mode .vikinger-post-status.active {
  background: rgba(40, 167, 69, 0.15) !important;
  color: #28a745 !important;
  border: 1px solid rgba(40, 167, 69, 0.3) !important;
}

body.active-dark-mode .vikinger-post-status.inactive {
  background: rgba(220, 53, 69, 0.15) !important;
  color: #dc3545 !important;
  border: 1px solid rgba(220, 53, 69, 0.3) !important;
}

/* ================================================================
   REDESIGNED GLASS FILTER BAR (Pill Shape Horizontal Layout)
   ================================================================ */

.section-filters-bar {
  border-radius: 50px !important;
  padding: 8px 16px !important;
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.15) !important;
  height: auto !important;
  min-height: 56px !important;
  display: flex !important;
  align-items: center !important;
}

.custom-filter-bar {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  justify-content: space-between !important;
}

.cfb-left,
.cfb-right {
  display: flex !important;
  align-items: center !important;
}

.cfb-middle {
  flex: 1 !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  padding: 0 10px !important;
}

/* Divider vertical lines */
.cfb-divider {
  width: 1px !important;
  height: 24px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  margin: 0 16px !important;
}

/* Favorites heart button */
.cfb-fav-btn {
  background: transparent !important;
  border: none !important;
  color: rgba(255, 255, 255, 0.6) !important;
  font-size: 1.1rem !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  padding: 6px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.cfb-fav-btn:hover,
.cfb-fav-btn.active {
  color: #ff3e6c !important;
  transform: scale(1.15) !important;
}

/* Scrollable tabs container */
.cfb-tabs-container {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  position: relative !important;
  overflow: hidden !important;
}

.cfb-tabs-wrapper {
  display: flex !important;
  gap: 8px !important;
  overflow-x: auto !important;
  scroll-behavior: smooth !important;
  white-space: nowrap !important;
  width: 100% !important;
  scrollbar-width: none !important;
  /* Hide standard firefox scrollbar */
}

.cfb-tabs-wrapper::-webkit-scrollbar {
  display: none !important;
  /* Hide webkit scrollbar */
}

/* Tab button styling */
.cfb-tab-btn {
  background: transparent !important;
  border: none !important;
  padding: 8px 16px !important;
  border-radius: 30px !important;
  color: rgba(255, 255, 255, 0.7) !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1) !important;
  white-space: nowrap !important;
}

.cfb-tab-btn:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.05) !important;
}

.cfb-tab-btn.active {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
  box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, 0.15) !important;
}

/* Dragging mouse state */
.cfb-tabs-wrapper.active-dragging {
  cursor: grabbing !important;
  scroll-behavior: auto !important;
}

.cfb-tabs-wrapper.active-dragging .cfb-tab-btn {
  pointer-events: none !important;
}

/* Scroll buttons */
.cfb-scroll-btn {
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  color: rgba(255, 255, 255, 0.8) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  flex-shrink: 0 !important;
  margin-left: 6px !important;
}

.cfb-scroll-btn:hover {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #ffffff !important;
}

.cfb-scroll-left {
  margin-left: 0 !important;
  margin-right: 6px !important;
}

/* Group button & dropdown */
.cfb-group-wrapper {
  position: relative !important;
}

.cfb-group-btn {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  padding: 8px 16px !important;
  border-radius: 30px !important;
  color: rgba(255, 255, 255, 0.85) !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  transition: all 0.2s ease !important;
}

.cfb-group-btn:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

.cfb-group-dropdown {
  position: absolute !important;
  top: 120% !important;
  right: 0 !important;
  width: 240px !important;
  background: rgba(16, 18, 30, 0.95) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px !important;
  padding: 16px !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.3) !important;
  z-index: 100 !important;
  display: none !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.cfb-group-dropdown.open {
  display: flex !important;
}

.cfb-group-dropdown .form-item {
  width: 100% !important;
  margin: 0 !important;
}

.cfb-group-dropdown select {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 8px !important;
  padding: 8px 12px !important;
  color: #ffffff !important;
  font-size: 0.8rem !important;
  width: 100% !important;
  cursor: pointer !important;
}

.cfb-group-dropdown label {
  font-size: 0.7rem !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.5) !important;
  margin-bottom: 4px !important;
  display: block !important;
}

/* Position the native React GridOptions within our custom bar layout */
.section-filters-bar.v2 {
  position: relative !important;
  z-index: 9999 !important;
}

.section-filters-bar.v2>.section-filters-bar-actions:not(.full) {
  position: absolute !important;
  right: 16px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 5 !important;
}

.section-filters-bar.v2>.section-filters-bar-actions:not(.full) .grid-options {
  display: flex !important;
  gap: 6px !important;
}

/* Add right padding to cfb-right so it doesn't overlap grid options */
.cfb-right {
  padding-right: 100px !important;
}

/* Real-time client-side Favorites filtering */
body.cfb-favorites-only .post-preview:not(:has(.vikinger-favorite-button.favorited)) {
  display: none !important;
}

/*===========================================================
    LIGHT MODE — Custom Filter Bar (.cfb-*) Overrides
===========================================================*/

/* Section filter bar — light background with subtle shadow */
body:not(.active-dark-mode) .section-filters-bar.v2 {
  background-color: var(--color-box-background) !important;
  box-shadow: 0 0 40px 0 rgba(94, 92, 154, 0.06) !important;
}

/* Divider lines — dark subtle */
body:not(.active-dark-mode) .cfb-divider {
  background: rgba(0, 0, 0, 0.1) !important;
}

/* Favorites heart button — dark icon */
body:not(.active-dark-mode) .cfb-fav-btn {
  color: var(--color-text-alt-2) !important;
}

body:not(.active-dark-mode) .cfb-fav-btn:hover,
body:not(.active-dark-mode) .cfb-fav-btn.active {
  color: #ff3e6c !important;
}

/* Tab buttons — dark text on light bg */
body:not(.active-dark-mode) .cfb-tab-btn {
  color: var(--color-text-alt) !important;
}

body:not(.active-dark-mode) .cfb-tab-btn:hover {
  color: var(--color-text) !important;
  background: rgba(0, 0, 0, 0.04) !important;
}

body:not(.active-dark-mode) .cfb-tab-btn.active {
  background: var(--color-primary) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(35, 210, 226, 0.25) !important;
}

/* Scroll arrow buttons — light theme */
body:not(.active-dark-mode) .cfb-scroll-btn {
  background: rgba(0, 0, 0, 0.04) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: var(--color-text-alt) !important;
}

body:not(.active-dark-mode) .cfb-scroll-btn:hover {
  background: rgba(0, 0, 0, 0.08) !important;
  color: var(--color-text) !important;
}

/* Group button — light theme */
body:not(.active-dark-mode) .cfb-group-btn {
  background: rgba(0, 0, 0, 0.04) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: var(--color-text-alt) !important;
}

body:not(.active-dark-mode) .cfb-group-btn:hover {
  background: rgba(0, 0, 0, 0.08) !important;
  color: var(--color-text) !important;
}

/* Group dropdown — light glass */
body:not(.active-dark-mode) .cfb-group-dropdown {
  background: rgba(255, 255, 255, 0.97) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 10px 40px rgba(94, 92, 154, 0.15) !important;
}

body:not(.active-dark-mode) .cfb-group-dropdown select {
  background: var(--color-box-highlight-background) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text) !important;
}

body:not(.active-dark-mode) .cfb-group-dropdown label {
  color: var(--color-text-alt-2) !important;
}

/* Grid options icons — light theme */
body:not(.active-dark-mode) .section-filters-bar.v2>.section-filters-bar-actions:not(.full) .view-action .view-action-icon {
  fill: var(--color-icon) !important;
}

body:not(.active-dark-mode) .section-filters-bar.v2>.section-filters-bar-actions:not(.full) .view-action.active .view-action-icon {
  fill: var(--color-icon-highlighted) !important;
}

/* ——— Account & Membership Page — dark mode sidebar (dark mode only) ——— */

/* Account sidebar container — glass style */
body.active-dark-mode .account-hub-sidebar .sidebar-box {
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15) !important;
  overflow: hidden !important;
}

/* Sidebar inner elements — NO glass, NO opaque background (global dark mode) */
body.active-dark-mode .sidebar-menu-header,
body.active-dark-mode .sidebar-menu-body,
body.active-dark-mode .sidebar-menu-link {
  background: transparent !important;
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
}

/* Sidebar menu header hover — subtle highlight only, NO glass */
body.active-dark-mode .sidebar-menu-header:hover {
  background-color: rgba(255, 255, 255, 0.04) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.active-dark-mode .sidebar-menu-link:hover,
body.active-dark-mode .sidebar-menu-link.active {
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.active-dark-mode .sidebar-menu-item.selected .sidebar-menu-header {
  background-color: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Sidebar menu divider — subtle in dark mode */
body.active-dark-mode .sidebar-menu-body {
  border-top-color: rgba(255, 255, 255, 0.06) !important;
}

body.active-dark-mode .sidebar-menu-item {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

/* Main content area container — glass style */
body.active-dark-mode .vikinger-pmpro-page-wrap {
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15) !important;
  padding: 24px !important;
}

/*===========================================================
    DARK MODE — Vikinger Favorites Plugin
===========================================================*/

/* Favorites container — transparent glass */

body.active-dark-mode .vikinger-favorites-container {
  background: transparent !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: none !important;
  border-radius: 16px !important;
  padding: 28px !important;
}

body.active-dark-mode .vikinger-favorites-header {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .vikinger-favorites-container .section-title {
  color: #ffffff !important;
}

/* Favorite tool cards — glass cards inside */
body.active-dark-mode .vikinger-favorites-grid .post-preview {
  background: rgba(255, 255, 255, 0.05) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    0 8px 32px rgba(0, 0, 0, 0.15),
    inset 0 0 1px rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .vikinger-favorites-grid .post-preview:hover {
  box-shadow:
    0 12px 40px rgba(0, 0, 0, 0.25),
    inset 0 0 1px rgba(255, 255, 255, 0.12) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Card text */
body.active-dark-mode .vikinger-favorites-grid .post-preview-timestamp {
  color: rgba(255, 255, 255, 0.5) !important;
}

body.active-dark-mode .vikinger-favorites-grid .post-preview-title a {
  color: #ffffff !important;
}

body.active-dark-mode .vikinger-favorites-grid .post-preview-title a:hover {
  color: #23d2e2 !important;
}

body.active-dark-mode .vikinger-favorites-grid .post-preview-text {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* Favorite button in dark mode */
body.active-dark-mode .vikinger-favorite-button {
  background: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.8) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

body.active-dark-mode .vikinger-favorite-button:hover {
  background: rgba(255, 255, 255, 0.14) !important;
}

body.active-dark-mode .vikinger-favorite-button.favorited {
  background: #23d2e2 !important;
  color: #fff !important;
  border-color: #23d2e2 !important;
}

body.active-dark-mode .vikinger-favorite-button .far.fa-star {
  color: rgba(255, 255, 255, 0.5) !important;
}

/* Post status badges in dark mode */
body.active-dark-mode .vikinger-post-status.active {
  background: rgba(40, 167, 69, 0.15) !important;
  color: #6ee7a0 !important;
  border-color: rgba(40, 167, 69, 0.25) !important;
}

body.active-dark-mode .vikinger-post-status.inactive {
  background: rgba(220, 53, 69, 0.15) !important;
  color: #f87171 !important;
  border-color: rgba(220, 53, 69, 0.25) !important;
}

body.active-dark-mode .vikinger-post-status.active .fa-circle {
  color: #6ee7a0 !important;
}

body.active-dark-mode .vikinger-post-status.inactive .fa-circle {
  color: #f87171 !important;
}

/* Empty message */
body.active-dark-mode .favorites-empty-message,
body.active-dark-mode .vikinger-favorites-container>p {
  color: rgba(255, 255, 255, 0.5) !important;
  background-color: rgba(255, 255, 255, 0.03) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/*===========================================================
    DARK MODE — Ajax Post Search Plugin
===========================================================*/

/* Search container — transparent glass with blur + border */

body.active-dark-mode #aps-search-container {
  background: transparent !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow:
    inset 0 0 1px 1px rgba(255, 255, 255, 0.06),
    0 8px 32px rgba(0, 0, 0, 0.1) !important;
  border-radius: 16px !important;
  padding: 24px !important;
  overflow: hidden !important;
}

body.active-dark-mode .aps-vikinger-search {
  background: transparent !important;
  border-radius: 16px !important;
}

/* Search input — clean, simple, rounded corners */
body.active-dark-mode #aps-search-input,
body.active-dark-mode .aps-vikinger-search #aps-search-input,
body.active-dark-mode .aps-minimal.aps-vikinger-search #aps-search-input,
body.active-dark-mode .aps-rounded.aps-vikinger-search #aps-search-input,
body.active-dark-mode .aps-modern.aps-vikinger-search #aps-search-input,
body.active-dark-mode #aps-search-container .form-item .form-input #aps-search-input,
body.active-dark-mode .aps-vikinger-search .form-item .form-input input[type="text"],
body.active-dark-mode #aps-search-container .form-item .form-input input[name="search"] {
  background-color: rgba(255, 255, 255, 0.06) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: none !important;
  border-radius: 12px !important;
  -webkit-border-radius: 12px !important;
}

/* Extra specificity for rounded corners */
body.active-dark-mode input#aps-search-input,
body.active-dark-mode input[id="aps-search-input"] {
  border-radius: 12px !important;
  -webkit-border-radius: 12px !important;
}

/* .form-input wrapper — ensure it doesn't clip corners */
body.active-dark-mode #aps-search-container .form-input,
body.active-dark-mode .aps-vikinger-search .form-input {
  border-radius: 12px !important;
  overflow: visible !important;
}

body.active-dark-mode #aps-search-container .form-item {
  border-radius: 12px !important;
  overflow: visible !important;
}

body.active-dark-mode #aps-search-input:focus,
body.active-dark-mode .aps-vikinger-search #aps-search-input:focus {
  border-color: rgba(97, 93, 250, 0.5) !important;
  box-shadow: 0 0 0 4px rgba(97, 93, 250, 0.15) !important;
}

body.active-dark-mode #aps-search-input::placeholder,
body.active-dark-mode .aps-vikinger-search #aps-search-input::placeholder {
  color: rgba(255, 255, 255, 0.35) !important;
}

/* Floating label in dark mode */
body.active-dark-mode .aps-vikinger-search .form-input label {
  color: rgba(255, 255, 255, 0.4) !important;
}

body.active-dark-mode .aps-vikinger-search .form-input.active label {
  background-color: transparent !important;
  color: rgba(255, 255, 255, 0.6) !important;
}

/* Category filter tabs */
body.active-dark-mode .aps-category-filter,
body.active-dark-mode .ajax-category-filter {
  background: transparent !important;
}

body.active-dark-mode .aps-category-filter a,
body.active-dark-mode .aps-category-filter button,
body.active-dark-mode .ajax-category-filter a,
body.active-dark-mode .ajax-category-filter button,
body.active-dark-mode .aps-category-filter .category-tab,
body.active-dark-mode .ajax-category-filter .category-tab {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.7) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .aps-category-filter a:hover,
body.active-dark-mode .aps-category-filter button:hover,
body.active-dark-mode .ajax-category-filter a:hover,
body.active-dark-mode .ajax-category-filter button:hover,
body.active-dark-mode .aps-category-filter .category-tab:hover,
body.active-dark-mode .ajax-category-filter .category-tab:hover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
}

body.active-dark-mode .aps-category-filter a.active,
body.active-dark-mode .aps-category-filter button.active,
body.active-dark-mode .ajax-category-filter a.active,
body.active-dark-mode .ajax-category-filter button.active,
body.active-dark-mode .aps-category-filter .category-tab.active,
body.active-dark-mode .ajax-category-filter .category-tab.active {
  background: rgba(97, 93, 250, 0.2) !important;
  color: #ffffff !important;
  border-color: rgba(97, 93, 250, 0.4) !important;
}

/* Group/Grid/List toggle buttons */
body.active-dark-mode .aps-view-toggle button,
body.active-dark-mode .ajax-view-toggle button {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.6) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .aps-view-toggle button:hover,
body.active-dark-mode .ajax-view-toggle button:hover,
body.active-dark-mode .aps-view-toggle button.active,
body.active-dark-mode .ajax-view-toggle button.active {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

/* Heart/favorite icon in category bar */
body.active-dark-mode .aps-favorite-toggle,
body.active-dark-mode .ajax-favorite-toggle {
  color: rgba(255, 255, 255, 0.6) !important;
}

/* Navigation arrows */
body.active-dark-mode .aps-category-nav-arrow,
body.active-dark-mode .ajax-category-nav-arrow {
  background: rgba(255, 255, 255, 0.06) !important;
  color: rgba(255, 255, 255, 0.6) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

body.active-dark-mode .aps-category-nav-arrow:hover,
body.active-dark-mode .ajax-category-nav-arrow:hover {
  background: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

/* Post preview cards in search results — dark mode */
body.active-dark-mode .post-preview.aps-highlighted {
  box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3) !important;
}

/* Loading state in dark mode */
body.active-dark-mode .aps-loading #aps-search-input {
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.04) 25%, rgba(255, 255, 255, 0.08) 50%, rgba(255, 255, 255, 0.04) 75%) !important;
  background-size: 200% 100% !important;
}

/*===========================================================
    WOOCOMMERCE SINGLE PRODUCT PAGE - MODERN & CLEAN OVERRIDES
===========================================================*/

/* Breadcrumbs styling */
.woocommerce .woocommerce-breadcrumb {
  font-size: 0.8rem !important;
  color: rgba(255, 255, 255, 0.6) !important;
  margin-bottom: 24px !important;
  font-weight: 500 !important;
}

.woocommerce .woocommerce-breadcrumb a {
  color: #23d2e2 !important;
  transition: color 0.2s ease !important;
}

.woocommerce .woocommerce-breadcrumb a:hover {
  color: #16b3c2 !important;
}

.woocommerce .woocommerce-breadcrumb .woocommerce-breadcrumb-separator {
  margin: 0 10px !important;
  color: rgba(255, 255, 255, 0.3) !important;
}

/* Single product display layout */
body.active-dark-mode .woocommerce div.product {
  display: flex !important;
  flex-direction: row !important;
  gap: 40px !important;
  align-items: flex-start !important;
  margin-top: 40px !important;
}

body.active-dark-mode .woocommerce div.product div.images {
  width: 45% !important;
  flex: 0 0 45% !important;
}

body.active-dark-mode .woocommerce div.product div.summary {
  width: 55% !important;
  flex: 0 0 55% !important;
}

@media (max-width: 991px) {
  body.active-dark-mode .woocommerce div.product {
    flex-direction: column !important;
  }

  body.active-dark-mode .woocommerce div.product div.images,
  body.active-dark-mode .woocommerce div.product div.summary {
    width: 100% !important;
    flex: 1 1 auto !important;
  }
}

/* Product Main Title */
body.active-dark-mode .woocommerce div.product div.summary .product_title {
  font-size: 2.5rem !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: #ffffff !important;
  margin-bottom: 12px !important;
  letter-spacing: -0.5px !important;
}

/* Categories */
body.active-dark-mode .woocommerce div.product div.summary .vikinger-wc-categories {
  margin-bottom: 20px !important;
}

body.active-dark-mode .woocommerce div.product div.summary .vikinger-wc-categories a {
  color: #23d2e2 !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Price block */
body.active-dark-mode .woocommerce div.product div.summary .price {
  font-size: 2.2rem !important;
  color: #ffffff !important;
  font-weight: 800 !important;
  margin-bottom: 20px !important;
}

body.active-dark-mode .woocommerce div.product div.summary .price del {
  color: rgba(255, 255, 255, 0.4) !important;
  font-size: 1.4rem !important;
  margin-right: 10px !important;
}

body.active-dark-mode .woocommerce div.product div.summary .price ins {
  text-decoration: none !important;
  color: #23d2e2 !important;
}

/* Short description bullet list spacing and alignment */
body.active-dark-mode .woocommerce-product-details__short-description {
  margin-bottom: 28px !important;
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 20px 0 !important;
}

body.active-dark-mode .woocommerce-product-details__short-description p {
  line-height: 1.8 !important;
  font-size: 0.95rem !important;
  color: rgba(255, 255, 255, 0.8) !important;
  margin-bottom: 10px !important;
}

body.active-dark-mode .woocommerce-product-details__short-description p:last-child {
  margin-bottom: 0 !important;
}

/* Multicurrency Switcher Styling */
body.active-dark-mode .woocommerce-multi-currency.wmc-price-switcher {
  background: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 12px !important;
  padding: 8px 12px !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  margin-bottom: 24px !important;
  position: relative !important;
  order: 6 !important;
}

body.active-dark-mode .wmc-currency-wrapper {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
}

body.active-dark-mode .wmc-current-currency {
  display: flex !important;
  align-items: center !important;
}

body.active-dark-mode .wmc-sub-currency {
  background: #1d2333 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.3) !important;
  padding: 8px !important;
}

body.active-dark-mode .wmc-sub-currency .wmc-currency {
  padding: 4px 8px !important;
}

body.active-dark-mode .wmc-sub-currency .wmc-currency a {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  color: #ffffff !important;
  font-size: 0.85rem !important;
  font-weight: 600 !important;
}

/* YITH Points Rewards Box Override */
body.active-dark-mode .yith-par-message,
body.active-dark-mode .yith-par-message-variation {
  background-color: rgba(35, 210, 226, 0.1) !important;
  background: rgba(35, 210, 226, 0.1) !important;
  color: #ffffff !important;
  border: 1px solid rgba(35, 210, 226, 0.25) !important;
  border-radius: 12px !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 0.9rem !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
  order: 7 !important;
}

body.active-dark-mode .yith-par-message strong,
body.active-dark-mode .yith-par-message-variation strong {
  color: #23d2e2 !important;
}

body.active-dark-mode .yith-par-message img,
body.active-dark-mode .yith-par-message-variation img {
  border-radius: 50% !important;
  margin: 0 !important;
}

/* Variations Selector Form */
body.active-dark-mode .woocommerce div.product form.cart.variations_form,
body.active-dark-mode .woocommerce div.product form.cart {
  margin-bottom: 28px !important;
  order: 5 !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations {
  width: 100% !important;
  margin-bottom: 20px !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations td {
  margin: 0 0 15px 0 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations td.label {
  display: block !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations label {
  color: rgba(255, 255, 255, 0.6) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations .form-select {
  width: 100% !important;
  position: relative !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations select {
  width: 100% !important;
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 12px !important;
  padding: 12px 18px !important;
  color: #ffffff !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  cursor: pointer !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations select:focus {
  border-color: rgba(35, 210, 226, 0.5) !important;
  box-shadow: 0 0 0 3px rgba(35, 210, 226, 0.15) !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations .reset_variations {
  color: rgba(255, 255, 255, 0.5) !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  text-decoration: underline !important;
  margin-top: 6px !important;
  transition: color 0.2s ease !important;
}

body.active-dark-mode .woocommerce div.product form.cart .variations .reset_variations:hover {
  color: #23d2e2 !important;
}

/* Selected Variation Block */
body.active-dark-mode .single_variation_wrap {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 16px !important;
  padding: 20px !important;
  margin-top: 24px !important;
}

body.active-dark-mode .woocommerce-variation.single_variation {
  margin-bottom: 20px !important;
}

body.active-dark-mode .woocommerce-variation-price .price {
  font-size: 2rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
}

/* Add to Cart Button */
body.active-dark-mode .woocommerce-variation-add-to-cart {
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
}

body.active-dark-mode button.single_add_to_cart_button {
  background: linear-gradient(180deg, #5ecfff 0%, #0076ff 100%) !important;
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  height: 54px !important;
  padding: 0 40px !important;
  border-radius: 27px !important;
  border: none !important;
  box-shadow: 0 10px 25px rgba(0, 118, 255, 0.3) !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  margin-top: 0 !important;
}

body.active-dark-mode button.single_add_to_cart_button:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 15px 35px rgba(0, 118, 255, 0.5) !important;
  filter: brightness(1.1) !important;
}

/* Meta Data section */
body.active-dark-mode .product_meta {
  border-top: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding-top: 20px !important;
  margin-top: 24px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  font-size: 0.85rem !important;
  color: rgba(255, 255, 255, 0.5) !important;
}

body.active-dark-mode .product_meta span {
  font-weight: 600 !important;
}

body.active-dark-mode .product_meta a {
  color: #23d2e2 !important;
  font-weight: 700 !important;
  transition: color 0.2s ease !important;
}

body.active-dark-mode .product_meta a:hover {
  color: #16b3c2 !important;
}

/* Gallery image zoom adjustment for consistency */
body.active-dark-mode .woocommerce div.product div.images .woocommerce-product-gallery__image {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* WooCommerce Product Tabs styling */
body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs {
  background: rgba(255, 255, 255, 0.03) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  padding: 0 20px !important;
  display: flex !important;
  gap: 10px !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li {
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  margin: 0 !important;
  height: auto !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li a {
  color: rgba(255, 255, 255, 0.6) !important;
  font-size: 0.9rem !important;
  font-weight: 700 !important;
  padding: 16px 20px !important;
  display: block !important;
  border-bottom: 2px solid transparent !important;
  transition: all 0.2s ease !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
  color: #23d2e2 !important;
  border-bottom-color: #23d2e2 !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
  color: #ffffff !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs .panel {
  border: none !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 30px !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs .panel h2 {
  font-size: 1.3rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-bottom: 20px !important;
}

body.active-dark-mode .woocommerce div.product .woocommerce-tabs .panel p {
  color: rgba(255, 255, 255, 0.8) !important;
  line-height: 1.8 !important;
}

/* Reorder elements inside single product summary */
body.active-dark-mode .woocommerce div.product div.summary .product_title {
  order: 1 !important;
}

body.active-dark-mode .woocommerce div.product div.summary .vikinger-wc-categories {
  order: 2 !important;
}

body.active-dark-mode .woocommerce div.product div.summary>.price {
  order: 3 !important;
}

body.active-dark-mode .woocommerce div.product div.summary .woocommerce-product-details__short-description {
  order: 4 !important;
}

body.active-dark-mode .woocommerce div.product div.summary form.cart {
  order: 5 !important;
}

body.active-dark-mode .woocommerce div.product div.summary .woocommerce-multi-currency {
  order: 6 !important;
}

body.active-dark-mode .woocommerce div.product div.summary .yith-par-message,
body.active-dark-mode .woocommerce div.product div.summary .yith-par-message-variation {
  order: 7 !important;
}

body.active-dark-mode .woocommerce div.product div.summary .product_meta {
  order: 8 !important;
}

/* Hide helper for hidden items */
.hide,
.yith-par-message.hide,
.yith-par-message-variation.hide,
body.active-dark-mode .yith-par-message.hide,
body.active-dark-mode .yith-par-message-variation.hide {
  display: none !important;
}

/* Related products h2 */
body.active-dark-mode .related.products h2 {
  font-size: 1.5rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-top: 40px !important;
  margin-bottom: 24px !important;
}

/*===========================================================
    WOOCOMMERCE CHECKOUT PAGE - GLASSMORPHISM OVERRIDES
===========================================================*/

/* Billing Details & Additional Fields Cards */
body.active-dark-mode .woocommerce .woocommerce-checkout #customer_details .col-1,
body.active-dark-mode .woocommerce .woocommerce-checkout #customer_details .col-2,
body.active-dark-mode .woocommerce-checkout-review-order {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px !important;
  padding: 32px 28px !important;
  box-shadow:
    0 30px 80px -20px rgba(0, 0, 0, 0.2),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.08) !important;
  margin-bottom: 30px !important;
}

/* Coupon section glass card */
body.active-dark-mode .woocommerce-form-coupon-toggle .woocommerce-info,
body.active-dark-mode form.checkout_coupon.woocommerce-form-coupon {
  background: rgba(21, 23, 40, 0.85) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  border-radius: 16px !important;
  padding: 20px 24px !important;
  box-shadow:
    0 30px 80px -20px rgba(0, 0, 0, 0.2),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.08) !important;
  margin-bottom: 24px !important;
}

/* Hide default backgrounds/shadows from base theme */
body.active-dark-mode .woocommerce .woocommerce-checkout #customer_details>* {
  background-color: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Form controls (Inputs/Selects/Textareas) on Checkout page */
body.active-dark-mode .woocommerce-checkout input.input-text,
body.active-dark-mode .woocommerce-checkout textarea,
body.active-dark-mode .woocommerce-checkout select,
body.active-dark-mode .woocommerce-checkout .select2-container--default .select2-selection--single {
  background-color: rgba(255, 255, 255, 0.05) !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 12px !important;
  color: #ffffff !important;
  padding: 12px 18px !important;
  font-size: 0.9rem !important;
  font-weight: 500 !important;
}

body.active-dark-mode .woocommerce-checkout .select2-container--default .select2-selection--single {
  height: auto !important;
  display: flex !important;
  align-items: center !important;
  padding: 8px 14px !important;
}

body.active-dark-mode .woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #ffffff !important;
  padding: 0 !important;
}

body.active-dark-mode .woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 50% !important;
  transform: translateY(-50%) !important;
  right: 12px !important;
}

/* Headings in Checkout page */
body.active-dark-mode .woocommerce-checkout h3,
body.active-dark-mode #order_review_heading {
  font-size: 1.4rem !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  margin-top: 0 !important;
  margin-bottom: 24px !important;
}

body.active-dark-mode #order_review_heading {
  margin-top: 40px !important;
}

/* Payment box details description */
body.active-dark-mode .woocommerce .woocommerce-checkout #payment div.payment_box {
  background-color: rgba(255, 255, 255, 0.04) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  border-radius: 12px !important;
  color: rgba(255, 255, 255, 0.8) !important;
  box-shadow: none !important;
  padding: 20px !important;
  margin-top: 15px !important;
}

body.active-dark-mode .woocommerce .woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

/* Payment methods list items */
body.active-dark-mode .woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method {
  background: rgba(255, 255, 255, 0.03) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  border-radius: 12px !important;
  padding: 14px 18px !important;
  margin-bottom: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
}

body.active-dark-mode .woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method label {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 0 !important;
}

body.active-dark-mode .woocommerce .woocommerce-checkout #payment ul.payment_methods li.wc_payment_method label img {
  max-height: 24px !important;
  object-fit: contain !important;
  border-radius: 4px !important;
}

/* Review Order Table */
body.active-dark-mode .woocommerce-checkout-review-order-table th,
body.active-dark-mode .woocommerce-checkout-review-order-table td {
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: rgba(255, 255, 255, 0.8) !important;
  font-size: 0.9rem !important;
  padding: 16px 12px !important;
}

body.active-dark-mode .woocommerce-checkout-review-order-table th {
  color: #ffffff !important;
  font-weight: 700 !important;
}

body.active-dark-mode .woocommerce-checkout-review-order-table .order-total th,
body.active-dark-mode .woocommerce-checkout-review-order-table .order-total td {
  color: #23d2e2 !important;
  font-weight: 800 !important;
  font-size: 1.1rem !important;
}

body.active-dark-mode .woocommerce-checkout-review-order-table .order-total td strong {
  font-weight: 800 !important;
}

/* Coupon forms text link */
body.active-dark-mode .woocommerce-form-coupon-toggle a.showcoupon {
  color: #23d2e2 !important;
  font-weight: 700 !important;
  transition: color 0.2s ease !important;
}

body.active-dark-mode .woocommerce-form-coupon-toggle a.showcoupon:hover {
  color: #16b3c2 !important;
}

/* Place Order Button styling */
body.active-dark-mode button#place_order {
  background: linear-gradient(180deg, #5ecfff 0%, #0076ff 100%) !important;
  color: #ffffff !important;
  font-size: 1rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  height: 54px !important;
  width: 100% !important;
  border-radius: 27px !important;
  border: none !important;
  box-shadow: 0 10px 25px rgba(0, 118, 255, 0.3) !important;
  cursor: pointer !important;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  margin-top: 20px !important;
}

body.active-dark-mode button#place_order:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 15px 35px rgba(0, 118, 255, 0.5) !important;
  filter: brightness(1.1) !important;
}

/* YITH checkout cart points rewards banner */
body.active-dark-mode #yith-par-message-cart {
  background-color: rgba(35, 210, 226, 0.1) !important;
  background: rgba(35, 210, 226, 0.1) !important;
  color: #ffffff !important;
  border: 1px solid rgba(35, 210, 226, 0.25) !important;
  border-radius: 12px !important;
  padding: 14px 20px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: 0.9rem !important;
  margin-bottom: 24px !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1) !important;
}

body.active-dark-mode #yith-par-message-cart img {
  border-radius: 50% !important;
  margin: 0 !important;
}

body.active-dark-mode #yith-par-message-cart strong {
  color: #23d2e2 !important;
}

/* Coupon button styling */
body.active-dark-mode form.checkout_coupon button.button {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  border-radius: 10px !important;
  padding: 10px 20px !important;
  font-weight: 700 !important;
  transition: all 0.2s ease !important;
}

body.active-dark-mode form.checkout_coupon button.button:hover {
  background: rgba(255, 255, 255, 0.15) !important;
}

/*===========================================================
    SPACE MODE — AMBIENT MUSIC PLAYER (HEADER DROPDOWN)
===========================================================*/

/* Wrapper positioning */
.rkt-ambient-wrap {
  position: relative !important;
  z-index: 99999;
}

/* Desktop: match action-item-wrap spacing */
.rkt-ambient-desktop.action-item-wrap {
  margin: 0 !important;
  padding: 0 !important;
}

.rkt-ambient-desktop .rkt-ambient-toggle-btn.action-item {
  padding: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
}

/* Toggle button cursor */
.rkt-ambient-toggle-btn {
  cursor: pointer !important;
}

/* Ensure the ambient icon SVG is visible and styled for light/dark mode */
.rkt-ambient-toggle-btn .rkt-ambient-icon {
  color: var(--color-text-alt, #aeafca) !important;
  fill: currentColor !important;
  width: 20px !important;
  height: 20px !important;
  transition: color 0.3s ease-in-out !important;
}

.rkt-ambient-toggle-btn:hover .rkt-ambient-icon {
  color: var(--color-text, #3e3f5e) !important;
}

body.active-dark-mode .rkt-ambient-toggle-btn .rkt-ambient-icon {
  color: rgba(255, 255, 255, 0.6) !important;
}

body.active-dark-mode .rkt-ambient-toggle-btn:hover .rkt-ambient-icon {
  color: #ffffff !important;
}

/* Active glow ring when playing */
.rkt-ambient-toggle-btn.rkt-ambient-active {
  animation: rkt-pulse-glow 2s ease-in-out infinite;
}

@keyframes rkt-pulse-glow {

  0%,
  100% {
    filter: drop-shadow(0 0 3px rgba(35, 210, 226, 0.4));
  }

  50% {
    filter: drop-shadow(0 0 10px rgba(35, 210, 226, 0.8));
  }
}

/* Wave paths default dim */
.rkt-vol-wave1,
.rkt-vol-wave2 {
  opacity: 0.3;
  transition: opacity 0.3s ease;
}

/* Dropdown panel — glassmorphic card */
.rkt-ambient-dropdown {
  position: absolute !important;
  top: calc(100% + 14px) !important;
  right: -40px !important;
  width: 280px !important;
  background: #ffffff !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 16px !important;
  box-shadow: 0 30px 80px -20px rgba(0, 0, 0, 0.15) !important;
  overflow: hidden !important;
  z-index: 999999 !important;
}

body.active-dark-mode .rkt-ambient-dropdown {
  background: rgba(21, 23, 40, 0.92) !important;
  backdrop-filter: blur(50px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(50px) saturate(210%) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow:
    0 30px 80px -20px rgba(0, 0, 0, 0.35),
    inset 0 0 1px 1px rgba(255, 255, 255, 0.06) !important;
}

/* Dropdown arrow pointer */
.rkt-ambient-dropdown::before {
  content: '';
  position: absolute;
  top: -6px;
  right: 50px;
  width: 12px;
  height: 12px;
  background: #ffffff;
  border-top: 1px solid rgba(0, 0, 0, 0.08);
  border-left: 1px solid rgba(0, 0, 0, 0.08);
  transform: rotate(45deg);
}

body.active-dark-mode .rkt-ambient-dropdown::before {
  background: rgba(21, 23, 40, 0.92);
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  border-left: 1px solid rgba(255, 255, 255, 0.12);
}

/* Header row */
.rkt-ambient-dropdown-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 16px 20px 12px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

body.active-dark-mode .rkt-ambient-dropdown-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.rkt-ambient-dropdown-title {
  font-size: 1rem !important;
  font-weight: 800 !important;
  color: #3e3f5e !important;
  letter-spacing: 0.5px !important;
}

body.active-dark-mode .rkt-ambient-dropdown-title {
  color: #ffffff !important;
}

.rkt-ambient-close-btn {
  font-size: 1.4rem !important;
  color: rgba(0, 0, 0, 0.4) !important;
  cursor: pointer !important;
  line-height: 1 !important;
  transition: all 0.2s ease !important;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.rkt-ambient-close-btn:hover {
  color: #3e3f5e !important;
  background: rgba(0, 0, 0, 0.05);
}

body.active-dark-mode .rkt-ambient-close-btn {
  color: rgba(255, 255, 255, 0.5) !important;
}

body.active-dark-mode .rkt-ambient-close-btn:hover {
  color: #ffffff !important;
  background: rgba(255, 255, 255, 0.08);
}

/* Body */
.rkt-ambient-dropdown-body {
  padding: 16px 20px 20px !important;
}

/* Toggle row */
.rkt-ambient-row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  margin-bottom: 18px !important;
}

.rkt-ambient-label {
  flex: 1 !important;
  font-size: 0.9rem !important;
  font-weight: 600 !important;
  color: #3e3f5e !important;
}

body.active-dark-mode .rkt-ambient-label {
  color: rgba(255, 255, 255, 0.9) !important;
}

/* Toggle Switch */
.rkt-ambient-switch {
  position: relative !important;
  display: inline-block !important;
  width: 46px !important;
  height: 24px !important;
  flex-shrink: 0 !important;
}

.rkt-ambient-switch input {
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.rkt-ambient-slider {
  position: absolute !important;
  cursor: pointer !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-color: rgba(0, 0, 0, 0.1) !important;
  transition: 0.3s !important;
  border-radius: 24px !important;
}

body.active-dark-mode .rkt-ambient-slider {
  background-color: rgba(255, 255, 255, 0.15) !important;
}

.rkt-ambient-slider::before {
  content: '' !important;
  position: absolute !important;
  height: 18px !important;
  width: 18px !important;
  left: 3px !important;
  bottom: 3px !important;
  background-color: #ffffff !important;
  transition: 0.3s !important;
  border-radius: 50% !important;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.15) !important;
}

body.active-dark-mode .rkt-ambient-slider::before {
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

.rkt-ambient-switch input:checked+.rkt-ambient-slider {
  background-color: #23d2e2 !important;
}

.rkt-ambient-switch input:checked+.rkt-ambient-slider::before {
  transform: translateX(22px) !important;
}

/* Volume row */
.rkt-ambient-volume-row {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.rkt-ambient-vol-label {
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  color: rgba(0, 0, 0, 0.4) !important;
  min-width: 48px !important;
}

body.active-dark-mode .rkt-ambient-vol-label {
  color: rgba(255, 255, 255, 0.5) !important;
}

.rkt-ambient-vol-value {
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  color: rgba(0, 0, 0, 0.6) !important;
  min-width: 36px !important;
  text-align: right !important;
}

body.active-dark-mode .rkt-ambient-vol-value {
  color: rgba(255, 255, 255, 0.7) !important;
}

/* Range slider styling */
.rkt-ambient-range {
  -webkit-appearance: none !important;
  appearance: none !important;
  flex: 1 !important;
  height: 6px !important;
  border-radius: 3px !important;
  background: rgba(0, 0, 0, 0.08) !important;
  outline: none !important;
  cursor: pointer !important;
}

body.active-dark-mode .rkt-ambient-range {
  background: rgba(255, 255, 255, 0.12) !important;
}

.rkt-ambient-range::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: #23d2e2 !important;
  cursor: pointer !important;
  box-shadow: 0 0 8px rgba(35, 210, 226, 0.3) !important;
  border: 2px solid #ffffff !important;
  transition: transform 0.15s ease !important;
}

body.active-dark-mode .rkt-ambient-range::-webkit-slider-thumb {
  box-shadow: 0 0 8px rgba(35, 210, 226, 0.5) !important;
}

.rkt-ambient-range::-webkit-slider-thumb:hover {
  transform: scale(1.2) !important;
}

.rkt-ambient-range::-moz-range-thumb {
  width: 16px !important;
  height: 16px !important;
  border-radius: 50% !important;
  background: #23d2e2 !important;
  cursor: pointer !important;
  box-shadow: 0 0 8px rgba(35, 210, 226, 0.3) !important;
  border: 2px solid #ffffff !important;
}

body.active-dark-mode .rkt-ambient-range::-moz-range-thumb {
  box-shadow: 0 0 8px rgba(35, 210, 226, 0.5) !important;
}

.rkt-ambient-range::-moz-range-track {
  height: 6px !important;
  border-radius: 3px !important;
  background: rgba(0, 0, 0, 0.08) !important;
}

body.active-dark-mode .rkt-ambient-range::-moz-range-track {
  background: rgba(255, 255, 255, 0.12) !important;
}

/* =================================================================
   VIBE SELECTOR STYLES
   ================================================================= */

.rkt-ambient-vibe-selector {
  margin-bottom: 16px !important;
  padding-bottom: 14px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06) !important;
}

body.active-dark-mode .rkt-ambient-vibe-selector {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06) !important;
}

.rkt-ambient-vibe-title {
  display: block !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 1.2px !important;
  color: rgba(0, 0, 0, 0.35) !important;
  margin-bottom: 10px !important;
}

body.active-dark-mode .rkt-ambient-vibe-title {
  color: rgba(255, 255, 255, 0.35) !important;
}

.rkt-ambient-vibe-options {
  display: flex !important;
  gap: 8px !important;
}

.rkt-ambient-vibe-option {
  flex: 1 !important;
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 8px 10px !important;
  border-radius: 10px !important;
  cursor: pointer !important;
  transition: all 0.25s ease !important;
  background: rgba(0, 0, 0, 0.03) !important;
  border: 1.5px solid transparent !important;
  position: relative !important;
}

body.active-dark-mode .rkt-ambient-vibe-option {
  background: rgba(255, 255, 255, 0.05) !important;
}

.rkt-ambient-vibe-option input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  pointer-events: none !important;
}

.rkt-ambient-vibe-option:hover {
  background: rgba(0, 0, 0, 0.06) !important;
}

body.active-dark-mode .rkt-ambient-vibe-option:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* Space Vibes active */
.rkt-ambient-vibe-option.rkt-vibe-space.active {
  background: rgba(35, 210, 226, 0.08) !important;
  border-color: rgba(35, 210, 226, 0.5) !important;
  box-shadow: 0 0 12px rgba(35, 210, 226, 0.15) !important;
}

body.active-dark-mode .rkt-ambient-vibe-option.rkt-vibe-space.active {
  background: rgba(35, 210, 226, 0.12) !important;
  border-color: rgba(35, 210, 226, 0.5) !important;
  box-shadow: 0 0 16px rgba(35, 210, 226, 0.2) !important;
}

/* Sakura Vibes active */
.rkt-ambient-vibe-option.rkt-vibe-sakura.active {
  background: rgba(255, 143, 171, 0.1) !important;
  border-color: rgba(255, 143, 171, 0.5) !important;
  box-shadow: 0 0 12px rgba(255, 143, 171, 0.15) !important;
}

body.active-dark-mode .rkt-ambient-vibe-option.rkt-vibe-sakura.active {
  background: rgba(255, 143, 171, 0.15) !important;
  border-color: rgba(255, 143, 171, 0.5) !important;
  box-shadow: 0 0 16px rgba(255, 143, 171, 0.25) !important;
}

.rkt-vibe-icon {
  font-size: 1rem !important;
  line-height: 1 !important;
  flex-shrink: 0 !important;
}

.rkt-vibe-name {
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  color: #3e3f5e !important;
  white-space: nowrap !important;
  letter-spacing: 0.2px !important;
}

body.active-dark-mode .rkt-vibe-name {
  color: rgba(255, 255, 255, 0.85) !important;
}

/* Sakura glow on toggle button when sakura vibe is active */
body.rkt-vibe-mode-sakura .rkt-ambient-toggle-btn.rkt-ambient-active {
  animation: rkt-pulse-glow-sakura 2s ease-in-out infinite !important;
}

@keyframes rkt-pulse-glow-sakura {
  0%, 100% {
    filter: drop-shadow(0 0 3px rgba(255, 143, 171, 0.4));
  }
  50% {
    filter: drop-shadow(0 0 10px rgba(255, 143, 171, 0.8));
  }
}

/* Sakura themed slider thumb */
body.rkt-vibe-mode-sakura .rkt-ambient-switch input:checked + .rkt-ambient-slider {
  background-color: #ff8fab !important;
}

body.rkt-vibe-mode-sakura .rkt-ambient-range::-webkit-slider-thumb {
  background: #ff8fab !important;
  box-shadow: 0 0 8px rgba(255, 143, 171, 0.4) !important;
}

body.rkt-vibe-mode-sakura .rkt-ambient-range::-moz-range-thumb {
  background: #ff8fab !important;
  box-shadow: 0 0 8px rgba(255, 143, 171, 0.4) !important;
}

/* =================================================================
   SAKURA BG VIDEO (inside dark-mode-bg-video-wrapper)
   ================================================================= */

/* This class overrides `body.active-dark-mode .dark-mode-bg-video { display: block !important }`
   Specificity: body.active-dark-mode .dark-mode-bg-video = (0,2,0)
   This rule: body.active-dark-mode .dark-mode-bg-video.rkt-bg-video-hidden = (0,3,0) — WINS */
body.active-dark-mode .dark-mode-bg-video.rkt-bg-video-hidden {
  display: none !important;
}

/* =================================================================
   AMBIENT VIBE — ONBOARDING TOOLTIP (inline, one-time)
   ================================================================= */

@keyframes rkt-onboard-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(108, 92, 231, 0.6); }
  50% { box-shadow: 0 0 0 6px rgba(108, 92, 231, 0); }
}

@keyframes rkt-onboard-tooltipIn {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: translateY(0); }
}

/* NEW badge on volume icon */
.rkt-onboard-new-dot {
  position: absolute !important;
  top: -6px !important;
  right: -10px !important;
  font-size: 8px !important;
  font-weight: 800 !important;
  letter-spacing: 0.5px !important;
  color: #fff !important;
  background: linear-gradient(135deg, #6c5ce7, #a855f7) !important;
  padding: 2px 5px !important;
  border-radius: 6px !important;
  line-height: 1.2 !important;
  pointer-events: none !important;
  animation: rkt-onboard-pulse 2s ease-in-out infinite !important;
  z-index: 10 !important;
}

/* Tooltip container */
.rkt-onboard-tooltip {
  position: absolute !important;
  top: calc(100% + 14px) !important;
  right: -10px !important;
  z-index: 99999 !important;
  animation: rkt-onboard-tooltipIn 0.35s cubic-bezier(0.16, 1, 0.3, 1) !important;
}

/* Arrow pointing up at icon */
.rkt-onboard-tooltip-arrow {
  position: absolute !important;
  top: -6px !important;
  right: 18px !important;
  width: 12px !important;
  height: 12px !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  border-bottom: none !important;
  border-right: none !important;
  transform: rotate(45deg) !important;
  z-index: 1 !important;
}

.rkt-onboard-tooltip-body {
  position: relative !important;
  z-index: 2 !important;
  width: 280px !important;
  background: #fff !important;
  border: 1px solid rgba(0,0,0,0.08) !important;
  border-radius: 14px !important;
  padding: 18px !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.12) !important;
}

.rkt-onboard-tooltip-body strong {
  display: block !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  color: #1a1a2e !important;
  margin-bottom: 8px !important;
}

.rkt-onboard-tooltip-body p {
  font-size: 12.5px !important;
  line-height: 1.5 !important;
  color: #666 !important;
  margin: 0 0 14px 0 !important;
}

.rkt-onboard-tooltip-body p b {
  color: #444 !important;
  font-weight: 600 !important;
}

.rkt-onboard-tooltip-btn {
  width: 100% !important;
  padding: 10px 16px !important;
  border: none !important;
  border-radius: 10px !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #fff !important;
  background: linear-gradient(135deg, #6c5ce7, #a855f7) !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 3px 10px rgba(108, 92, 231, 0.3) !important;
}

.rkt-onboard-tooltip-btn:hover {
  transform: translateY(-1px) !important;
  box-shadow: 0 5px 15px rgba(108, 92, 231, 0.4) !important;
}

/* Dark mode tooltip */
body.active-dark-mode .rkt-onboard-tooltip-arrow {
  background: #1e1e32 !important;
  border-color: rgba(255,255,255,0.08) !important;
}

body.active-dark-mode .rkt-onboard-tooltip-body {
  background: #1e1e32 !important;
  border-color: rgba(255,255,255,0.08) !important;
  box-shadow: 0 12px 40px rgba(0,0,0,0.35) !important;
}

body.active-dark-mode .rkt-onboard-tooltip-body strong {
  color: #f0f0f5 !important;
}

body.active-dark-mode .rkt-onboard-tooltip-body p {
  color: #aaa !important;
}

body.active-dark-mode .rkt-onboard-tooltip-body p b {
  color: #ddd !important;
}
/* =================================================================
   SAKURA VIBES — LIGHT MODE VIDEO BACKGROUND
   Show sakura video even in light mode when sakura vibe is selected.
   Mirrors dark mode wrapper positioning so it looks identical.
   ================================================================= */

/* Make wrapper visible in light mode when sakura is selected */
body.rkt-vibe-mode-sakura:not(.active-dark-mode) .main-layout-wrapper {
  position: relative !important;
}

/* Keep content ABOVE the background video in light mode */
body.rkt-vibe-mode-sakura:not(.active-dark-mode) .main-layout-container {
  z-index: 2 !important;
  position: relative !important;
  background-color: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  box-shadow: none !important;
  border: none !important;
}

body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video-wrapper {
  display: block !important;
  position: absolute !important;
  top: 12px !important;
  bottom: 12px !important;
  height: calc(100% - 24px) !important;
  border-radius: 24px !important;
  overflow: hidden !important;
  z-index: 1 !important;
  pointer-events: none !important;
  transform: translateZ(0) !important;
  isolation: isolate !important;
}

/* Show sakura video in light mode */
body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video.rkt-bg-video-sakura {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 24px !important;
}

/* Keep space video hidden in light mode sakura */
body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video.rkt-bg-video-space {
  display: none !important;
}

/* Also respect hidden class in light mode sakura */
body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video.rkt-bg-video-hidden {
  display: none !important;
}

/* Desktop sidebar adjustments for light mode sakura */
@media screen and (min-width: 1366px) {
  body.rkt-vibe-mode-sakura:not(.active-dark-mode) #navigation-widget:not(.navigation-widget-hidden)~.main-layout-wrapper .dark-mode-bg-video-wrapper {
    left: calc(260px + 12px) !important;
    right: 12px !important;
    width: calc(100% - 260px - 12px - 12px) !important;
  }

  body.rkt-vibe-mode-sakura:not(.active-dark-mode) #navigation-widget-small:not(.navigation-widget-hidden)~.main-layout-wrapper .dark-mode-bg-video-wrapper {
    left: calc(80px + 12px) !important;
    right: 12px !important;
    width: calc(100% - 80px - 12px - 12px) !important;
  }
}

/* Tablet for light mode sakura */
@media screen and (max-width: 1365px) {
  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video-wrapper {
    display: block !important;
    position: fixed !important;
  }
}

@media screen and (max-width: 1365px) and (min-width: 769px) {
  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video-wrapper {
    left: 16px !important;
    right: 16px !important;
    width: calc(100% - 32px) !important;
    top: 16px !important;
    bottom: 16px !important;
    height: calc(100vh - 32px) !important;
  }

  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video-wrapper,
  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video {
    border-radius: 16px !important;
  }
}

/* Mobile for light mode sakura */
@media screen and (max-width: 768px) {
  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video-wrapper {
    left: 10px !important;
    right: 10px !important;
    width: calc(100% - 20px) !important;
    top: 10px !important;
    bottom: 10px !important;
    height: calc(100vh - 20px) !important;
  }

  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video-wrapper,
  body.rkt-vibe-mode-sakura:not(.active-dark-mode) .dark-mode-bg-video {
    border-radius: 24px !important;
  }
}

/* =================================================================
   CUSTOM 4-COLUMN SQUARE LIST GRID OVERRIDES
   ================================================================= */

/* Container overrides */
.grid.grid-3-3-3-3 {
  grid-template-columns: repeat(4, 1fr) !important;
  gap: 20px !important;
}

@media screen and (max-width: 1200px) {
  .grid.grid-3-3-3-3 {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

@media screen and (max-width: 900px) {
  .grid.grid-3-3-3-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

@media screen and (max-width: 600px) {
  .grid.grid-3-3-3-3 {
    grid-template-columns: 1fr !important;
  }
}

/* Card Container - Perfect square with modern rounded corners */
body.active-dark-mode .post-preview.small {
  background: rgba(21, 23, 40, 0.6) !important;
  backdrop-filter: blur(20px) saturate(210%) !important;
  -webkit-backdrop-filter: blur(20px) saturate(210%) !important;
  border: 1.5px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.3) !important;
  border-radius: 28px !important;
  /* Modern rounded corners */
  overflow: hidden !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  /* Perfect square */
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1), border-color 0.3s ease !important;
  position: relative !important;
}

body.active-dark-mode .post-preview.small:hover {
  transform: translateY(-4px) !important;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.4) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

/* Hide access button styles and other redundant templates */
body.active-dark-mode .post-preview.small .rtz-access-now-btn {
  display: none !important;
}

/* Centered content wrapper */
body.active-dark-mode .post-preview.small .rtz-card-content-wrap {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
  width: 100% !important;
  height: 100% !important;
  padding: 24px !important;
  box-sizing: border-box !important;
}

/* Logo Image Container (Squircle with thick white border) */
body.active-dark-mode .post-preview.small .post-preview-image-link,
body.active-dark-mode .post-preview.small .post-preview-gallery {
  display: inline-block !important;
  width: 90px !important;
  height: 90px !important;
  margin: 0 0 16px 0 !important;
  position: static !important;
  /* Allows absolute children like badge to float relative to card */
  border-radius: 22px !important;
  border: 4px solid #ffffff !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25) !important;
  overflow: hidden !important;
  flex-shrink: 0 !important;
}

body.active-dark-mode .post-preview.small .post-preview-image,
body.active-dark-mode .post-preview.small .post-preview-gallery .post-preview-gallery-slider-item {
  width: 100% !important;
  height: 100% !important;
  position: static !important;
  /* Allows absolute children like badge to float relative to card */
  border-radius: 16px !important;
  background-size: cover !important;
  background-position: center !important;
}

/* Info container is transparent & simple */
body.active-dark-mode .post-preview.small .post-preview-info {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
}

body.active-dark-mode .post-preview.small .post-preview-info-top {
  display: block !important;
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
}

/* Category Text (e.g. VIDEO GENERATION) */
body.active-dark-mode .post-preview.small .rtz-card-category {
  margin: 0 0 6px 0 !important;
  font-size: 0.62rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: rgba(255, 255, 255, 0.45) !important;
  letter-spacing: 0.8px !important;
  max-width: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  line-height: 1.2 !important;
}

/* Title (e.g. Higgsfield) */
body.active-dark-mode .post-preview.small .rtz-card-title {
  margin: 0 !important;
  font-size: 1.15rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  color: #ffffff !important;
  width: 100% !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

body.active-dark-mode .post-preview.small .rtz-card-title a {
  color: #ffffff !important;
}

body.active-dark-mode .post-preview.small .rtz-card-title a:hover {
  color: #23d2e2 !important;
}

/* Floating Actions wrapper on top right */
body.active-dark-mode .post-preview.small .post-preview-actions {
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 10 !important;
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

body.active-dark-mode .post-preview.small .post-buttons-container {
  display: block !important;
  width: auto !important;
  height: auto !important;
}

/* Elegant Heart Button (Top Right) */
body.active-dark-mode .post-preview.small .vikinger-favorite-button {
  background: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  color: #8f9bb3 !important;
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

body.active-dark-mode .post-preview.small .vikinger-favorite-button:hover {
  transform: scale(1.08) !important;
}

body.active-dark-mode .post-preview.small .vikinger-favorite-button i {
  margin: 0 !important;
  font-size: 1rem !important;
  color: #8f9bb3 !important;
  transition: color 0.2s ease !important;
}

body.active-dark-mode .post-preview.small .vikinger-favorite-button:hover i {
  color: #ff4d4d !important;
}

body.active-dark-mode .post-preview.small .vikinger-favorite-button.favorited i {
  color: #ff4d4d !important;
}

body.active-dark-mode .post-preview.small .vikinger-favorite-button span {
  display: none !important;
}

/* Float badge on top left of card container */
body.active-dark-mode .post-preview.small .vikinger-post-badge,
body.active-dark-mode .post-preview.small .post-preview-image-link .vikinger-post-badge,
body.active-dark-mode .post-preview.small .post-preview-image .vikinger-post-badge {
  position: absolute !important;
  top: 16px !important;
  left: 16px !important;
  right: auto !important;
  bottom: auto !important;
  z-index: 10 !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  padding: 4px 8px !important;
  border-radius: 6px !important;
  text-transform: uppercase !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25) !important;
  display: inline-block !important;
  width: auto !important;
  max-width: max-content !important;
  height: auto !important;
  line-height: 1 !important;
  margin: 0 !important;
  border: none !important;
  animation: none !important;
}

/* Hide status tag to keep it extremely simple and clean like screenshot */
body.active-dark-mode .post-preview.small .vikinger-post-status {
  display: none !important;
}

/* =================================================================
   CUSTOM SIDEBAR EXTENSION DOWNLOAD WIDGET STYLES
   ================================================================= */
.custom-extension-widget {
  margin: 30px 24px 24px !important;
  padding: 24px 20px !important;
  border-radius: 14px !important;
  text-align: center !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  transition: all 0.3s ease !important;
  background: linear-gradient(135deg, rgba(35, 210, 226, 0.04) 0%, rgba(97, 93, 250, 0.04) 100%) !important;
  border: 1px solid rgba(35, 210, 226, 0.12) !important;
  color: #2b303b !important;
  box-shadow: none !important;
}

body.active-dark-mode .custom-extension-widget {
  background: linear-gradient(135deg, rgba(35, 210, 226, 0.08) 0%, rgba(97, 93, 250, 0.08) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

.custom-extension-widget .custom-extension-icon-wrap {
  width: 44px !important;
  height: 44px !important;
  border-radius: 50% !important;
  background: rgba(35, 210, 226, 0.12) !important;
  border: 1px solid rgba(35, 210, 226, 0.25) !important;
  color: #23d2e2 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  margin-bottom: 14px !important;
  font-size: 1.15rem !important;
  box-sizing: border-box !important;
}

body.active-dark-mode .custom-extension-widget .custom-extension-icon-wrap {
  background: rgba(35, 210, 226, 0.15) !important;
  border-color: rgba(35, 210, 226, 0.3) !important;
}

.custom-extension-widget .custom-extension-text {
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  color: inherit !important;
  letter-spacing: 0.2px !important;
}

.custom-extension-widget .custom-extension-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 36px !important;
  border-radius: 30px !important;
  background: linear-gradient(135deg, #23d2e2 0%, #0076ff 100%) !important;
  color: #ffffff !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
  transition: all 0.3s ease !important;
  border: none !important;
  text-decoration: none !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

.custom-extension-widget .custom-extension-btn:hover {
  transform: translateY(-1px) !important;
  filter: brightness(1.08) !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

/* Force Mobile Navigation Bar Menu labels to be white in dark mode */
body.active-dark-mode .mobile-bottom-nav-label,
body.active-dark-mode .mobile-bottom-nav-item.active .mobile-bottom-nav-label {
  color: #ffffff !important;
  opacity: 1 !important;
}

/* Show categories dropdown on mobile, tabs on desktop */
.cfb-select-container {
  display: none !important;
}

.cfb-tabs-container {
  display: flex !important;
}

/* =================================================================
   MOBILE RESPONSIVENESS FOR CUSTOM POST FILTER BAR (< 768px)
   ================================================================= */
@media (max-width: 768px) {

  /* Expand the main filters bar container dynamically using grid */
  .section-filters-bar.v2 {
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    grid-template-rows: auto auto !important;
    grid-template-areas:
      "categories categories categories"
      "left grid-opts right" !important;
    grid-gap: 16px !important;
    padding: 16px 20px !important;
    height: auto !important;
    border-radius: 16px !important;
  }

  /* Make the sub-container transparent in grid calculations */
  .custom-filter-bar {
    display: contents !important;
  }

  /* Category tabs scroll to take full horizontal space */
  .cfb-middle {
    grid-area: categories !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
  }

  /* Toggle desktop tabs and mobile dropdown views */
  .cfb-select-container {
    display: block !important;
    width: 100% !important;
  }

  .cfb-tabs-container {
    display: none !important;
  }

  /* Style mobile selection list dropdown */
  .custom-category-select-wrap {
    position: relative !important;
    width: 100% !important;
  }

  .cfb-category-select {
    width: 100% !important;
    height: 40px !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    padding: 0 38px 0 16px !important;
    color: #ffffff !important;
    font-size: 0.82rem !important;
    font-weight: 600 !important;
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    outline: none !important;
    cursor: pointer !important;
    box-sizing: border-box !important;
  }

  body:not(.active-dark-mode) .cfb-category-select {
    background: rgba(21, 23, 40, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    color: #1e293b !important;
  }

  .custom-category-select-wrap svg {
    position: absolute !important;
    right: 16px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    fill: rgba(255, 255, 255, 0.6) !important;
    width: 10px !important;
    height: 10px !important;
    pointer-events: none !important;
  }

  body:not(.active-dark-mode) .custom-category-select-wrap svg {
    fill: rgba(0, 0, 0, 0.6) !important;
  }

  /* Hide scroll chevron buttons on mobile touch devices */
  .cfb-scroll-btn {
    display: none !important;
  }

  /* Flex wrapper inside cfb-tabs-container */
  .cfb-tabs-container {
    width: 100% !important;
    overflow: visible !important;
  }

  .cfb-tabs-wrapper {
    width: 100% !important;
    gap: 6px !important;
    padding: 2px 0 !important;
  }

  /* Make tab buttons slightly smaller and cleaner on mobile */
  .cfb-tab-btn {
    padding: 6px 12px !important;
    font-size: 0.78rem !important;
  }

  /* Bottom actions: left controls (Heart button) */
  .cfb-left {
    grid-area: left !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
  }

  /* Make Heart circular button symmetric to Group button on mobile */
  .cfb-fav-btn {
    width: 38px !important;
    height: 38px !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: rgba(255, 255, 255, 0.85) !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    transition: all 0.2s ease !important;
    transform: none !important;
  }

  body:not(.active-dark-mode) .cfb-fav-btn {
    background: rgba(21, 23, 40, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    color: #1e293b !important;
  }

  .cfb-fav-btn:hover,
  .cfb-fav-btn.active {
    background: rgba(255, 62, 108, 0.12) !important;
    border-color: rgba(255, 62, 108, 0.25) !important;
    color: #ff3e6c !important;
    transform: scale(1.05) !important;
  }

  /* Bottom actions: center controls (Grid Options) */
  .section-filters-bar.v2>.section-filters-bar-actions:not(.full) {
    grid-area: grid-opts !important;
    position: static !important;
    transform: none !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
  }

  /* Bottom actions: right controls (Group dropdown) */
  .cfb-right {
    grid-area: right !important;
    display: flex !important;
    justify-content: flex-end !important;
    align-items: center !important;
    padding-right: 0 !important;
    /* Remove the desktop overlap offset padding */
  }

  .cfb-group-btn {
    height: 38px !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    border-radius: 30px !important;
    background: rgba(255, 255, 255, 0.06) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body:not(.active-dark-mode) .cfb-group-btn {
    background: rgba(21, 23, 40, 0.04) !important;
    border: 1px solid rgba(0, 0, 0, 0.08) !important;
    color: #1e293b !important;
  }

  /* Position dropdown container properly on mobile */
  .cfb-group-dropdown {
    right: 0 !important;
    left: auto !important;
    width: 220px !important;
  }

  /* Hide vertical dividers on mobile */
  .cfb-divider {
    display: none !important;
  }
}

/* =================================================================
   SIDEBAR MENU LINKS COLOR OVERRIDES (LIGHT & DARK MODE)
   ================================================================= */

/* --- Light Mode --- */
.menu .menu-item .menu-item-link {
  color: #3e3f5e !important;
}
.menu .menu-item .menu-item-link .menu-item-link-icon svg {
  fill: #8f93be !important;
  color: #8f93be !important;
}

.menu .menu-item .menu-item-link:hover,
.menu .menu-item .menu-item-link:focus {
  color: #3e3f5e !important;
}
.menu .menu-item .menu-item-link:hover .menu-item-link-icon svg,
.menu .menu-item .menu-item-link:focus .menu-item-link-icon svg {
  fill: #3e3f5e !important;
  color: #3e3f5e !important;
}

.menu .menu-item.active > .menu-item-link {
  color: #fff !important;
  background-color: var(--color-primary, #6c5ce7) !important;
}
.menu .menu-item.active > .menu-item-link .menu-item-link-icon svg {
  fill: #fff !important;
  color: #fff !important;
}

/* --- Dark Mode (active-dark-mode) --- */
body.active-dark-mode .menu .menu-item .menu-item-link {
  color: #9aa4bf !important;
}
body.active-dark-mode .menu .menu-item .menu-item-link .menu-item-link-icon svg {
  fill: #616a82 !important;
  color: #616a82 !important;
}

body.active-dark-mode .menu .menu-item .menu-item-link:hover,
body.active-dark-mode .menu .menu-item .menu-item-link:focus {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08) !important;
}
body.active-dark-mode .menu .menu-item .menu-item-link:hover .menu-item-link-icon svg,
body.active-dark-mode .menu .menu-item .menu-item-link:focus .menu-item-link-icon svg {
  fill: #fff !important;
  color: #fff !important;
}

body.active-dark-mode .menu .menu-item.active > .menu-item-link,
body.active-dark-mode .menu .menu-item.active > .menu-item-link:hover {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}
body.active-dark-mode .menu .menu-item.active > .menu-item-link .menu-item-link-icon svg,
body.active-dark-mode .menu .menu-item.active > .menu-item-link:hover .menu-item-link-icon svg {
  fill: #fff !important;
  color: #fff !important;
}

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