/*
 * Name: Vertio
 * Version: 4.2.0
 * Author: Grow Shine Services Pvt. Ltd.
 * Download From: https://themes.grow-shine.com
 * Corporate Website : https://www.grow-shine.com
 * License: You must have a valid license purchased only from themes.grow-shine.com in order to legally use the theme for your project.
 * Copyright: © 2016 - 2026 Grow Shine Services Pvt. Ltd. All Rights Reserved.
*/

@charset "UTF-8";
/***** Normalize.css *****/
/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

html {
  scroll-behavior: smooth;
  scroll-padding-top: 5rem;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

main {
  display: block;
}

h1 {
  font-size: 22px;
  margin: 0.67em 0;
  font-weight: 600;
  color: #7865E5;
  font-family: "Instrument Sans", sans-serif;
}

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible;
}

pre {
  font-family: monospace, monospace;
  font-size: 1em;
}

a {
  background-color: transparent;
  transition: all 0.3s ease;
}

a:hover {
  transition: all 0.3s ease;
}

abbr[title] {
  border-bottom: none;
  text-decoration: underline;
  text-decoration: underline dotted;
}

b,
strong {
  font-weight: bolder;
}

code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em;
}

small {
  font-size: 80%;
}

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

img {
  border-style: none;
}

button,
input,
optgroup,
select,
textarea {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15;
  margin: 0;
}

button,
input {
  overflow: visible;
}

button,
select {
  text-transform: none;
}

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted rgba(120, 101, 229, 1);
}

fieldset {
  padding: 0.35em 0.75em 0.625em;
}

legend {
  box-sizing: border-box;
  color: inherit;
  display: table;
  max-width: 100%;
  padding: 0;
  white-space: normal;
}

progress {
  vertical-align: baseline;
}

textarea {
  overflow: auto;
}

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box;
  padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

[type="search"] {
  -webkit-appearance: textfield;
  outline-offset: -2px;
}

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

::-webkit-file-upload-button {
  -webkit-appearance: button;
  font: inherit;
}

details {
  display: block;
}

summary {
  display: list-item;
}

template {
  display: none;
}

[hidden] {
  display: none;
}

/***** Base *****/
* {
  box-sizing: border-box;
}

body {
  background-color: rgba(120, 101, 229, 0.2);
  color: rgba(0, 0, 0, 1);
  font-family: 'Instrument Sans', sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  margin: 0;
  -webkit-font-smoothing: antialiased;
}

@media (min-width: 1024px) {
  body > main {
    min-height: 65vh;
  }
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Instrument Sans', sans-serif;
  font-weight: 600;
  margin-top: 0;
}

h1 {
  font-size: 32px;
}

h2 {
  font-size: 22px;
}

h3 {
  font-size: 18px;
  font-weight: 600;
}

h4 {
  font-size: 16px;
}

a {
  color: #141414;
  text-decoration: none;
}

a:hover, a:active, a:focus {
  text-decoration: none;
}

input,
textarea,
.hbs-form input,
.hbs-form textarea, .search input,
.search textarea {
  color: #000;
  font-size: 14px;
}

input,
.hbs-form input, .search input {
  max-width: 100%;
  box-sizing: border-box;
  transition: border .12s ease-in-out;
}

input:not([type="checkbox"]),
.hbs-form input:where(:not([type=checkbox])), .search input:where(:not([type=checkbox])) {
  outline: none;
}

input[disabled],
.hbs-form input[disabled], .search input[disabled] {
  background-color: #ddd;
}

select,
.hbs-form select, .search select {
  -webkit-appearance: none;
  -moz-appearance: none;
  background: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%23CCC' d='M0 0h10L5 6 0 0z'/%3E%3C/svg%3E%0A") no-repeat #fff;
  background-position: right 10px center;
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 4px;
  padding: 8px 30px 8px 10px;
  outline: none;
  color: #555;
  width: 100%;
}

select:focus,
.hbs-form select:focus, .search select:focus {
  border: 1px solid rgba(120, 101, 229, 1);
}

select::-ms-expand,
.hbs-form select::-ms-expand, .search select::-ms-expand {
  display: none;
}

textarea,
.hbs-form textarea, .search textarea {
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 3px;
  resize: vertical;
  width: 100%;
  outline: none;
  padding: 10px;
}

textarea:focus,
.hbs-form textarea:focus, .search textarea:focus {
  border: 1px solid rgba(120, 101, 229, 1);
}

.container {
  max-width: 1260px;
  margin: 0 auto;
  padding: 0 5%;
}

@media (min-width: 1160px) {
  .container {
    padding: 0;
    width: 90%;
  }
}

.full--width,
.hc_header .full--width {
  max-width: 100%;
}

.container-divider {
  border-top: 1px solid rgba(120, 101, 229, 1);
  margin-bottom: 20px;
}

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.error-page {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
}

.error-page h1 {
  font-size: 5em;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0;
  margin-top: 40px;
}

.error-page h2,
h1.form-header {
  font-weight: 600;
}

.error-page h3 {
  font-size: 10em;
  color: rgba(120, 101, 229, 1);
  margin: 0;
}

@media (min-width: 1160px) {
  .error-page {
    padding: 0;
    width: 90%;
  }
}

.visibility-hidden, .recent-activity-accessibility-label, .pagination-first-text, .pagination-last-text {
  border: 0;
  clip: rect(0 0 0 0);
  -webkit-clip-path: inset(50%);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
  white-space: nowrap;
}

/***** Google Material Symbols *****/
/* Icon names: https://fonts.google.com/icons - loaded in templates/document_head.hbs.
   Every theme UI icon goes through this rule. Font Awesome is only still loaded for the
   fa-brands social logos in footer.hbs and the .__with_fa / .alert-* article shortcodes. */

.hero .search-full::before,
.article-list li:before,
.quick-articles ul > li > a:before,
.article-relatives li:before,
.section-lists li:before,
.quick-articles section h2::before,
.search_heading::after,
.new-request-title::before,
.check-list-bullet li:before,
body .note--message::before,
body .warning--message::before,
body .quote--message::before,
body .support--message::before,
body .check--list li:before,
#service-catalog-item ul > li:before,
body .accordion_title::after,
.search-results-sidebar .see-all-filters::after {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  letter-spacing: normal;
  text-transform: none;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/***** Buttons *****/
.button, .section-subscribe button, .article-subscribe button, .community-follow button, .requests-table-toolbar .organization-subscribe button, .subscriptions-subscribe button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link, .edit-profile-button a, .hc__btn,
.split-button button {
  background-color: rgba(120, 101, 229, 1);
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 3px;
  color: rgba(255, 255, 255, 1);
  cursor: pointer;
  display: inline-block;
  font-size: 12px;
  font-weight: 600;
  line-height: 2.34;
  margin: 0;
  padding: 0 20px;
  text-align: center;
  transition: background-color .12s ease-in-out, border-color .12s ease-in-out, color .15s ease-in-out;
  user-select: none;
  white-space: nowrap;
  width: 100%;
  -webkit-touch-callout: none;
}

.hc__btn {
    width: auto;
}

@media (min-width: 768px) {
  .button, .section-subscribe button, .article-subscribe button, .community-follow button, .requests-table-toolbar .organization-subscribe button, .subscriptions-subscribe button, .pagination-next-link, .pagination-prev-link, .pagination-first-link, .pagination-last-link, .edit-profile-button a, .split-button button {
    width: auto;
  }
}

.button:hover, .section-subscribe button:hover, .article-subscribe button:hover, .community-follow button:hover, .requests-table-toolbar .organization-subscribe button:hover, .subscriptions-subscribe button:hover, .pagination-next-link:hover, .pagination-prev-link:hover, .pagination-first-link:hover, .pagination-last-link:hover, .edit-profile-button a:hover, .button:active, .section-subscribe button:active, .article-subscribe button:active, .community-follow button:active, .requests-table-toolbar .organization-subscribe button:active, .subscriptions-subscribe button:active, .pagination-next-link:active, .pagination-prev-link:active, .pagination-first-link:active, .pagination-last-link:active, .edit-profile-button a:active, .button:focus, .section-subscribe button:focus, .article-subscribe button:focus, .community-follow button:focus, .requests-table-toolbar .organization-subscribe button:focus, .subscriptions-subscribe button:focus, .pagination-next-link:focus, .pagination-prev-link:focus, .pagination-first-link:focus, .pagination-last-link:focus, .edit-profile-button a:focus, .button.button-primary, .section-subscribe button.button-primary, .section-subscribe button[data-selected="true"], .article-subscribe button.button-primary, .article-subscribe button[data-selected="true"], .community-follow button.button-primary, .requests-table-toolbar .organization-subscribe button.button-primary, .requests-table-toolbar .organization-subscribe button[data-selected="true"], .subscriptions-subscribe button.button-primary, .subscriptions-subscribe button[data-selected="true"], .button-primary.pagination-next-link, .button-primary.pagination-prev-link, .button-primary.pagination-first-link, .button-primary.pagination-last-link, .edit-profile-button a.button-primary {
  background-color: rgba(120, 101, 229, 1);
  color: rgba(255, 255, 255, 1);
  text-decoration: none;
}

.button.button-primary:hover, .section-subscribe button.button-primary:hover, .section-subscribe button[data-selected="true"]:hover, .article-subscribe button.button-primary:hover, .article-subscribe button[data-selected="true"]:hover, .community-follow button.button-primary:hover, .requests-table-toolbar .organization-subscribe button.button-primary:hover, .requests-table-toolbar .organization-subscribe button[data-selected="true"]:hover, .subscriptions-subscribe button.button-primary:hover, .subscriptions-subscribe button[data-selected="true"]:hover, .button-primary.pagination-next-link:hover, .button-primary.pagination-prev-link:hover, .button-primary.pagination-first-link:hover, .button-primary.pagination-last-link:hover, .edit-profile-button a.button-primary:hover, .button.button-primary:focus, .section-subscribe button.button-primary:focus, .section-subscribe button[data-selected="true"]:focus, .article-subscribe button.button-primary:focus, .article-subscribe button[data-selected="true"]:focus, .community-follow button.button-primary:focus, .requests-table-toolbar .organization-subscribe button.button-primary:focus, .requests-table-toolbar .organization-subscribe button[data-selected="true"]:focus, .subscriptions-subscribe button.button-primary:focus, .subscriptions-subscribe button[data-selected="true"]:focus, .button-primary.pagination-next-link:focus, .button-primary.pagination-prev-link:focus, .button-primary.pagination-first-link:focus, .button-primary.pagination-last-link:focus, .edit-profile-button a.button-primary:focus, .button.button-primary:active, .section-subscribe button.button-primary:active, .section-subscribe button[data-selected="true"]:active, .article-subscribe button.button-primary:active, .article-subscribe button[data-selected="true"]:active, .community-follow button.button-primary:active, .requests-table-toolbar .organization-subscribe button.button-primary:active, .requests-table-toolbar .organization-subscribe button[data-selected="true"]:active, .subscriptions-subscribe button.button-primary:active, .subscriptions-subscribe button[data-selected="true"]:active, .button-primary.pagination-next-link:active, .button-primary.pagination-prev-link:active, .button-primary.pagination-first-link:active, .button-primary.pagination-last-link:active, .edit-profile-button a.button-primary:active {
  background-color: #3921c3;
  border-color: #3921c3;
}

.button[data-disabled], .section-subscribe button[data-disabled], .article-subscribe button[data-disabled], .community-follow button[data-disabled], .requests-table-toolbar .organization-subscribe button[data-disabled], .subscriptions-subscribe button[data-disabled], .pagination-next-link[data-disabled], .pagination-prev-link[data-disabled], .pagination-first-link[data-disabled], .pagination-last-link[data-disabled], .edit-profile-button a[data-disabled] {
  cursor: default;
}

.button-large, input[type="submit"] {
  cursor: pointer;
  background-color: rgba(120, 101, 229, 1);
  border: 0;
  border-radius: 3px;
  color: rgba(255, 255, 255, 1);
  font-size: 14px;
  font-weight: 400;
  line-height: 2.72;
  min-width: 190px;
  padding: 0 1.9286em;
  width: 100%;
}

@media (min-width: 768px) {
  .button-large, input[type="submit"] {
    width: auto;
  }
}

.button-large:hover, .button-large:active, .button-large:focus, input[type="submit"]:hover, input[type="submit"]:active, input[type="submit"]:focus {
  background-color: #3921c3;
}

.button-large[disabled], input[type="submit"][disabled] {
  background-color: #ddd;
}

.button-secondary {
  color: #333;
  border: 1px solid rgba(120, 101, 229, 1);
  background-color: transparent;
}

.button-secondary:hover, .button-secondary:focus, .button-secondary:active {
  color: rgba(0, 0, 0, 1);
  border: 1px solid rgba(120, 101, 229, 1);
  background-color: #f7f7f7;
}

#tinymce,
.mce-content-body {
  font-family: 'Instrument Sans', sans-serif !important;
}

/***** Tables *****/

.table {
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
  border-spacing: 0;
}

@media (min-width: 768px) {
  .table {
    table-layout: auto;
  }
}

.table th,
.table th a {
  color: #333;
  font-size: 13px;
  text-align: left;
}

[dir="rtl"] .table th, [dir="rtl"]
.table th a {
  text-align: right;
}

.table tr {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  display: block;
  padding: 20px 0;
}

@media (min-width: 768px) {
  .table tr {
    display: table-row;
  }
}

.table td {
  display: block;
}

@media (min-width: 768px) {
  .table td {
    display: table-cell;
  }
}

@media (min-width: 1024px) {
  .table td, .table th {
    padding: 20px 30px;
  }
}

@media (min-width: 768px) {
  .table td, .table th {
    padding: 10px 20px;
    height: 60px;
  }
}

/***** Forms *****/

.form {
  max-width: 750px;
  background-color: rgba(212, 189, 243, 0.95);
  padding: 30px;
  border-radius: 3px;
  margin-bottom: 45px;
}

.form-field ~ .form-field {
  margin-top: 25px;
}

.form-field label {
  display: block;
  font-size: 13px;
  margin-bottom: 10px;
  font-weight: 600;
}

.form input {
  border: 1px solid rgba(120, 101, 229, 1) !important;
  border-radius: 3px;
  min-height: 40px;
  width: 100%;
}

.new_community_post footer input[type=submit] {
  width: inherit;
  border-color: rgba(120, 101, 229, 1) !important;
}

#hc-wysiwyg,
.form-field .nesty-input {
  border: 1px solid rgba(120, 101, 229, 1);
}

.form-field input[type="text"] {
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 3px;
}

.form-field input[type="text"]:focus,
.form-field input:focus {
  border: 1px solid rgba(120, 101, 229, 1);
}

.form-field input[type="checkbox"] {
  width: auto;
}

.form-field .nesty-input {
  border-radius: 4px;
  height: 40px;
  line-height: 40px;
  outline: none;
  vertical-align: middle;
}

.form-field .nesty-input:focus {
  border: 1px solid rgba(120, 101, 229, 1);
  text-decoration: none;
}

.form-field .hc-multiselect-toggle:focus {
  outline: none;
  border: 1px solid rgba(120, 101, 229, 1);
  text-decoration: none;
}

.form-field textarea {
  vertical-align: middle;
}

.form-field input[type="checkbox"] + label {
  margin: 0 0 0 10px;
}

.form-field .optional {
  color: #333;
  margin-left: 4px;
}

.form-field p {
  color: #333;
  font-size: 12px;
  margin: 5px 0;
}

.form footer {
  margin-top: 0;
  padding-top: 30px;
  text-align: right;
}

.form footer a {
  color: #333;
  cursor: pointer;
  margin-right: 15px;
}

.form .suggestion-list {
  font-size: 13px;
  margin-top: 15px;
}

.form .suggestion-list .searchbox {
  background: #fff;
  border: 1px solid rgba(120, 101, 229, 1);
  padding: 20px;
  border-radius: 3px;
}

.form .suggestion-list label {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  display: block;
  padding-bottom: 5px;
}

.form .suggestion-list li {
  padding: 10px 0;
}

.form .suggestion-list li a:visited {
  color: #000;
}

.form .upload-item {
  background: #fff;
  border: 1px solid rgba(120, 101, 229, 1);
}

.form .required > label:after {
    content: "*";
    color: red;
    margin-left: 2px;
}

.form button[type="submit"] {
    min-width: 150px;
    float: right;
}

.form div[role="button"] {
    background-color: #fff;
    border-color: rgba(120, 101, 229, 1);
}

body .ck.ck-editor__main > .ck-editor__editable:not(.ck-focused),
body .ck.ck-editor__top .ck-sticky-panel .ck-sticky-panel__content {
  border-color: rgba(120, 101, 229, 1);
}

/***** Header *****/

.alert--bar {
  background: rgba(213, 244, 67, 1);
  padding: 10px 0;
  color: rgba(0, 0, 0, 1);
  text-align: center;
  position: relative;
  z-index: 99;
}

.height-42 {
  max-height: 42px;
  overflow: hidden;
}

.alert--bar a {
  color: rgba(0, 0, 0, 1);
  border-bottom: 1px solid;
}

.hc_header {
  background: rgba(120, 101, 229, 1);
  z-index: 9;
  position: relative;
  transition: all 0.3s ease;
}

.fixed-divider {
  height: 71px;
}

.fixed--header,
.hc_header.menu-is-open {
  position: fixed;
  top: 0;
  width: 100%;
}

.fixed--header.top-42 {
  top: 42px;
}

.scroll--fixed {
  top: 0 !important;
  transition: all 0.3s ease;
}

.hc_header.menu-is-open {
  z-index: 999;
}

.border-top {
  border-top: 1px solid rgba(213, 244, 67, 1);
}

.header {
  max-width: 1260px;
  margin: 0 auto;
  padding: 0 5%;
  position: relative;
  align-items: center;
  display: flex;
  height: 71px;
  justify-content: space-between;
}

@media (min-width: 1160px) {
  .header {
    padding: 0;
    width: 90%;
  }
}

.logo img {
  max-height: 30px;
}

@media (max-width: 500px) {
  .logo img {
    max-height: 25px;
    margin-top: 5px;
  }
}

.logo span {
  margin: 0 10px;
  color: rgba(213, 244, 67, 1);
  vertical-align: top;
  position: relative;
  top: 5px;
}

.logo a {
  display: inline-block;
}

.user-nav {
  display: inline-block;
  position: absolute;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .user-nav {
    position: relative;
  }
}

.user-nav[aria-expanded="true"] {
  background-color: #fff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.15), 0 4px 10px 0 rgba(0, 0, 0, 0.1);
  border: solid 1px rgba(120, 101, 229, 1);
  right: 0;
  left: 0;
  top: 71px;
  z-index: 1;
}

.user-nav[aria-expanded="true"] > a {
  display: block;
  margin: 20px;
}

.nav-wrapper a {
  border: 0;
  color: rgba(213, 244, 67, 1);
  padding: 0 10px 0 10px;
  width: auto;
}

.nav-wrapper .language-selector .dropdown-toggle {
  color: rgba(213, 244, 67, 1);
  position: relative;
  top: -1px;
}

[dir=ltr] .nav-wrapper .language-selector .dropdown-toggle {
  padding-left: 5px;
}

@media (min-width: 768px) {
  .nav-wrapper a {
    display: inline-block;
  }
  .nav-wrapper .cd-primary-nav-trigger {
    padding-right: 0;
    margin-right: -12px;
  }
}

[dir="rtl"] .nav-wrapper .cd-primary-nav-trigger {
    padding-right: 5px;
    margin-right: 0;
    position: relative;
    top: 2px;
}

.nav-wrapper a:hover, .nav-wrapper a:focus, .nav-wrapper a:active {
  background-color: transparent;
  color: rgba(213, 244, 67, 1);
}

.nav-wrapper a.login {
  display: inline-block;
}

.nav-wrapper .menu-button {
  background: none;
  border: 0;
  color: #141414;
  display: none;
  margin-right: 10px;
  padding: 0;
  width: auto;
}

@media (min-width: 768px) {
  .nav-wrapper .menu-button {
    display: none;
  }
}

.nav-wrapper .menu-button .icon-menu {
  vertical-align: middle;
  width: 13px;
  height: 13px;
}

[dir="rtl"] .nav-wrapper .menu-button {
  margin-left: 10px;
  margin-right: 0;
}

.nav-wrapper .menu-button:hover, .nav-wrapper .menu-button:focus, .nav-wrapper .menu-button:active {
  background-color: transparent;
  color: #141414;
}

.skip-navigation {
  align-items: center;
  background-color: black;
  color: white;
  display: flex;
  font-size: 14px;
  justify-content: center;
  left: -999px;
  margin: 20px;
  padding: 20px;
  overflow: hidden;
  position: absolute;
  top: auto;
  z-index: -999;
}

[dir="rtl"] .skip-navigation {
  left: initial;
  right: -999px;
}

.skip-navigation:focus, .skip-navigation:active {
  left: auto;
  overflow: auto;
  text-align: center;
  text-decoration: none;
  top: auto;
  z-index: 999;
}

[dir="rtl"] .skip-navigation:focus, [dir="rtl"] .skip-navigation:active {
  left: initial;
  right: auto;
}

/***** User info in header *****/
.user-info {
  display: inline-block;
}

.user-info .dropdown-toggle::after {
  display: none;
}

@media (min-width: 768px) {
  .user-info .dropdown-toggle::after {
    display: inline-block;
  }
}

.user-info > button {
  border: 0;
  color: rgba(213, 244, 67, 1);
  min-width: 0;
  padding: 0;
  white-space: nowrap;
}

.user-info > button:hover, .user-info > button:focus {
  color: rgba(213, 244, 67, 1);
  background-color: transparent;
}

.user-info > button::after {
  color: #141414;
  padding-right: 15px;
}

[dir="rtl"] .user-info > button::after {
  padding-left: 15px;
  padding-right: 0;
}

#user #user-name {
  display: none;
  font-size: 14px;
}

@media (min-width: 768px) {
  #user #user-name {
    display: inline-block;
  }
}

#user #user-name:hover {
  text-decoration: underline;
}

/***** User avatar *****/
.user-avatar {
  height: 25px;
  width: 25px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
}

.avatar {
  display: inline-block;
  position: relative;
}

.avatar img {
  height: 40px;
  width: 40px;
}

.avatar .icon-agent {
  color: rgba(120, 101, 229, 1);
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -4px;
  background-color: rgba(255, 255, 255, 1);
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

/***** Footer *****/

.footer {
  background: rgba(120, 101, 229, 1);
  margin-top: 30px;
  padding: 30px 0;
  color: rgba(213, 244, 67, 1);
}

.footer .social {
  margin-bottom: 20px;
}

.footer .social li {
  display: inline-block;
  margin: 2px;
}

.footer .social li a {
  border: 2px solid rgba(213, 244, 67, 1);
  height: 35px;
  display: block;
  width: 35px;
  line-height: 32px;
  border-radius: 100%;
}

.footer .social li i {
  font-size: 0.9em;
}

.footer .social li a:hover,
.footer .social li a:focus {
  background: rgba(120, 101, 229, 1);
  border-color: rgba(120, 101, 229, 1);
}

.footer a {
  border-bottom: 1px dashed;
  color: rgba(213, 244, 67, 1);
}

.footer-inner {
  max-width: 1160px;
  margin: 0 auto;
  padding: 0 5%;
  display: flex;
  justify-content: space-between;
}

.text-center {
  text-align: center;
}

@media (min-width: 1160px) {
  .footer-inner {
    padding: 0;
    width: 90%;
  }
  .nav-wrapper .cd-primary-nav-trigger {
    padding-right: 0;
    margin-right: -10px;
  }
}

.footer-language-selector {
  color: #333;
  display: inline-block;
}

/***** Breadcrumbs *****/

.breadcrumbs {
  margin: 0 0 15px 0;
  padding: 0;
}

@media (min-width: 768px) {
  .breadcrumbs {
    margin: 0;
  }
}

.breadcrumbs li {
  color: #333;
  display: inline;
  font-size: 13px;
  max-width: 450px;
  overflow: hidden;
  text-overflow: ellipsis;
}

.breadcrumbs li + li::before {
  content: ">";
  margin: 0 4px;
}

.breadcrumbs li a:visited {
  color: rgba(0, 0, 0, 1);
}

/***** Search field *****/

.search {
  position: relative;
}

.search-container .search input[type="search"] {
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 3px;
  box-shadow: none;
  box-sizing: border-box;
  height: 40px;
  padding: 5px 5px 5px 35px;
}

[dir="rtl"] .search input[type="search"] {
  padding-right: 40px;
  padding-left: 20px;
}

.search input[type="search"]:focus {
  border: 1px solid rgba(120, 101, 229, 1);
}

.search input[type="search"] {
  border: 1px solid #fff;
  border-radius: 3px;
  box-shadow: 0 6px 19px rgb(39 49 58 / 9%);
  color: rgba(120, 101, 229, 1);
  font-weight: 500;
  height: 50px;
  padding-left: 40px;
  padding-right: 20px;
  width: 100%;
}

.requests-table-toolbar .search input[type="search"] {
  border: 1px solid rgba(120, 101, 229, 1);
}

.hero .search-full::before {
  content: "search";
  left: 0;
  position: absolute;
  height: 100%;
  align-items: center;
  display: flex;
  color: rgba(120, 101, 229, 1);
  font-size: 14px;
  margin-left: 15px;
  margin-top: 1px;
}

.search input[type="submit"] {
  position: absolute;
  top: 0;
  right: 0;
  height: 50px;
  min-width: 100px;
  max-width: 100px;
  border-radius: 0 3px 3px 0;
  background: rgba(120, 101, 229, 1);
  color: rgba(255, 255, 255, 1);
  padding: 0;
}

[dir="rtl"] .search input[type="submit"] {
  border-radius: 3px 0 0 3px;
  right: auto;
  left: 0;
}

.search-icon {
  position: relative;
  top: 50%;
  transform: translateY(26px);
  position: absolute;
  left: 12px;
  z-index: 1;
  width: 16px;
  height: 16px;
  color: rgba(120, 101, 229, 1);
}

.breadcrumbs__block .search-icon,
.requests-table-toolbar .search-icon {
    transform: translateY(-8px);
}

[dir="rtl"] .search-icon,
[dir="rtl"] .hero .search-full::before {
  right: 15px;
  left: auto;
}

[dir="rtl"] .quick-articles section h2:after,
[dir="rtl"] .search_heading:after,
[dir="rtl"] .new-request-title:after {
    visibility: hidden;
}

.search-container {
  position: relative;
}

.breadcrumbs__block {
  background: rgba(212, 189, 243, 0.95);
  padding: 15px 0;
  margin-bottom: 30px;
}

button.clear-button,
.breadcrumbs-none li.search-breadcrumbs,
.author-none .search-date {
  display: none !important;
}

@media (max-width: 768px) {
  .hero .search-full::before {
    visibility: hidden;
  }
  .search-full input[type="search"] {
    padding-left: 15px;
  }
  .alert--bar {
    font-size: 10px;
  }
}

/***** Hero component *****/

.welcome_text {
  color: rgba(213, 244, 67, 1);
  margin-bottom: 30px;
  font-weight: 600;
  line-height: 1.2;
}
.hero {
  background-color: rgba(120, 101, 229, 1);
  height: 400px;
  padding: 0 20px;
  text-align: center;
  width: 100%;
}

.hero_show {
    background-image: url(/hc/theming_assets/01M0CH72RWGEPW15EHFTJ3ZNNK);
    background-position: center;
    background-size: cover;
}

.hero-inner {
  position: relative;
  top: 50%;
  transform: translateY(-70%);
  max-width: 610px;
  margin: 0 auto;
}

.page-header {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 10px 0;
}

@media (min-width: 768px) {
  .page-header {
    align-items: baseline;
    flex-direction: row;
    margin: 0;
  }
}

.page-header .section-subscribe {
  flex-shrink: 0;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .page-header .section-subscribe {
    margin-bottom: 0;
  }
}

.page-header h1 {
  color: rgba(0, 0, 0, 1);
  flex-grow: 1;
  margin-bottom: 15px;
  font-weight: 600;
}

.my-activities-header > h1 {
  font-weight: 600;
}

.page-header-description {
  margin: 0 0 30px 0;
  word-break: break-word;
}

@media (min-width: 1024px) {
  .page-header-description {
    flex-basis: 100%;
  }
}

.page-header .icon-lock {
  height: 20px;
  width: 20px;
  position: relative;
  left: -5px;
  vertical-align: baseline;
}

.sub-nav {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 30px;
  min-height: 40px;
  padding-bottom: 15px;
}

.breadcrumbs__block .sub-nav {
  margin-bottom: 0;
  padding-bottom: 0;
  align-items: center;
}

@media (min-width: 768px) {
  .sub-nav {
    align-items: baseline;
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .sub-nav input[type="search"] {
    min-width: 300px;
  }
}

.sub-nav input[type="search"]::after {
  font-size: 15px;
}

/***** Blocks *****/
/* Used in Homepage#categories and Community#topics */
.blocks-list,
.quick-articles {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  list-style: none;
  padding: 0;
}

@media (min-width: 768px) {
  .blocks-list {
    margin: 0;
  }
}

.blocks-item,
.quick-articles section {
  background: #fff;
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 4px;
  box-sizing: border-box;
  color: rgba(120, 101, 229, 1);
  display: flex;
  flex: 1 0 340px;
  margin: 0 0 30px;
  max-width: 100%;
  text-align: center;
}

.quick-articles section {
  display: block;
  margin: 40px 5px 10px;
  text-align: left;
  padding: 30px 30px 20px 30px;
}

[dir="rtl"] .quick-articles section {
  text-align: right;
}

.quick-articles h2 {
  font-size: 1.3em;
  font-weight: 600;
  color: rgba(0, 0, 0, 1);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
}

@media (min-width: 768px) {
  .blocks-item {
    margin: 40px 5px 10px;
  }
}

.blocks-item:hover, .blocks-item:focus, .blocks-item:active {
  background-color: #fff;
}

.blocks-item:hover *, .blocks-item:focus *, .blocks-item:active * {
  color: #333;
  text-decoration: none;
}

.blocks-item-internal {
  background-color: transparent;
  border: 1px solid rgba(120, 101, 229, 1);
}

.blocks-item-internal .icon-lock {
  height: 15px;
  width: 15px;
  bottom: 5px;
  position: relative;
}

.blocks-item-internal a {
  color: rgba(0, 0, 0, 1);
}

.blocks-item-link {
  background: #fff;
  color: rgba(0, 0, 0, 1);
  padding: 35px 30px;
  display: flex;
  flex-direction: column;
  flex: 1;
  justify-content: center;
  border-radius: inherit;
  position: relative;
}

.topics .blocks-item-link {
  padding: 40px 30px 20px 30px;
}

.topics .blocks-item-title {
  font-size: 1.4em;
}

.blocks-item-link:hover, .blocks-item-link:active {
  text-decoration: none;
}

.blocks-item-link:focus {
  outline: 0;
  box-shadow: none;
  text-decoration: none;
}

.blocks-item-title {
    margin-top: 10px;
    margin-bottom: 0;
    font-weight: 600;
    font-size: 1.1em;
}

.blocks-item-description {
  font-size: 0.9em;
  margin: 0;
}

.blocks-item-description:not(:empty) {
  margin-top: 10px;
}

/***** Homepage *****/
.section {
  margin-bottom: 40px;
}

@media (min-width: 768px) {
  .section {
    margin-bottom: 60px;
  }
}

.home-section h2 {
  color: rgba(0, 0, 0, 1);
  margin-bottom: 10px;
  text-align: center;
  font-weight: 600;
}

.categories {
  position: relative;
  top: -150px;
  margin-bottom: -150px;
}

.blocks-item span.category-icon,
.topics-item .topic-icon {
  background: rgba(142, 108, 255, 1);
  height: 60px;
  width: 60px;
  display: block;
  margin: 0 auto;
  border-radius: 100%;
  line-height: 60px;
  text-align: center;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin-top: -30px;
  transition: transform 0.2s, opacity 0.2s;
}

.blocks-item span.category-icon img,
.topics-item .topic-icon img {
  max-width: 50px;
}

.blocks-item:hover span.category-icon,
.topics-item:hover .topic-icon {
  transition: transform 0.2s, opacity 0.2s;
  transform: scale(.9);
}

.blocks-item span.category-icon i,
.topics-item .topic-icon i {
  color: rgba(213, 244, 67, 1);
  font-size: 1.5em;
  line-height: 60px;
  width: 100%;
}

.blocks-item span.category-icon i,
.topics-item .topic-icon i:first-child {
  display: none;
}

.blocks-item span.category-icon i:last-child,
.topics-item .topic-icon i:last-child {
  display: block;
}

.article-list li:before,
.quick-articles ul > li > a:before,
.article-relatives li:before,
.section-lists li:before {
  content: "description";
  position: absolute;
  left: 0;
  margin-top: 1px;
}

[dir="rtl"] .article-list li:before,
[dir="rtl"] .quick-articles ul > li > a:before,
[dir="rtl"] .article-relatives li:before,
[dir="rtl"] .section-lists li:before {
  left: auto;
  right: 0;
}

.section-lists li:before {
  content: "folder_open";
}
.article-relatives li a {
  color: #141414;
}
.article-relatives h2 {
    margin-bottom: 15px;
}
.article-list li:last-child {
    border-bottom: 0;
}
.section-container .section-empty {
    margin-top: 15px;
    display: inline-block;
}

/***** Promoted articles *****/

.promoted-articles {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

@media (min-width: 1024px) {
  .promoted-articles {
    flex-direction: row;
  }
}

.promoted-articles-item {
  flex: 1 0 auto;
}

@media (min-width: 1024px) {
  .promoted-articles-item {
    align-self: flex-end;
    flex: 0 0 auto;
    padding-right: 0;
    width: 100%;
    /* Three columns on desktop */
  }
  [dir="rtl"] .promoted-articles-item {
    padding: 0 0 0 30px;
  }
}

.promoted-articles-item:nth-child(3n) {
  padding-right: 0;
}

.promoted-articles-item a,
.quick-articles li a {
  display: block;
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  padding: 15px 0;
  color: #141414;
}

.quick-articles li a,
.article-list li,
.article-relatives li,
.section-lists li {
    padding-left: 25px;
}

[dir="rtl"] .quick-articles li a,
[dir="rtl"] .article-list li,
[dir="rtl"] .article-relatives li,
[dir="rtl"] .section-lists li {
    padding-left: 0;
    padding-right: 25px;
}

.quick-articles ul li:last-child a {
    border-bottom: 0;
}

.quick-articles section li,
.article-list li,
.section-lists li {
    position: relative;
    margin-bottom: 0;
}

.promoted-articles-item .icon-lock {
  vertical-align: baseline;
}

.promoted-articles-item:last-child a {
  border: 0;
}

@media (min-width: 1024px) {
  .promoted-articles-item:last-child a {
    border-bottom: 1px solid rgba(120, 101, 229, 1);
  }
}

.quick-articles section h2::before,
.search_heading::after,
.new-request-title::before {
  content: "star";
  margin-left: -10px;
  margin-right: 10px;
  opacity: 0.1;
  font-size: 2em;
}

.new-request-title {
  font-weight: 600;
  display: flex;
  align-items: center;
}

.new-request-title::before {
  content: "mail";
  font-size: 45px;
  margin-left: 0;
}

.quick-articles section.recent-articles h2::before {
    content: "visibility";
}

.hide--icon::before,
.hide--icon section h2::before {
  display: none;
}

/***** Community section in homepage *****/

.community {
  text-align: center;
}

.community-image {
  display: flex;
  align-items: center;
  min-height: 200px;
  background-image: url(/hc/theming_assets/01M0EVH5ZVH178RQ539XZZ4J11);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  max-width: 100%;
  position: relative;
  text-align: center;
  margin-bottom: -30px;
}

.community-image:before {
  position: absolute;
  content: "";
  background: #000000;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  opacity: 0.5;
}

.community-image .btn {
  background: rgba(255, 255, 255, 0.78);
  border: 2px solid rgba(255, 255, 255, 0.72);
  color: rgba(0, 0, 0, 1);
  padding: 10px 45px;
  border-radius: 3px;
  font-size: 1.3em;
  font-weight: 600;
  position: relative;
  margin: 0 5px;
}

.community,
.activity {
  border-top: 0;
  padding: 30px 0;
}

.pt-80 {
  padding-top: 80px;
}

.pt-0 {
  padding-top: 0;
}

.mb-30 {
  margin-bottom: 30px;
}

/***** Recent activity *****/

.recent-activity-item > h3 {
  margin-bottom: 5px;
}

.recent-activity-header {
  margin-bottom: 10px;
  text-align: center;
  font-weight: 600;
}

.recent-activity-list {
  padding: 0;
}

.recent-activity-item {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  overflow: auto;
  padding: 20px 0;
}

.recent-activity-item-parent {
  font-size: 16px;
}

.recent-activity-item-parent, .recent-activity-item-link {
  margin: 6px 0;
  color: rgba(0, 0, 0, 1);
  display: inline-block;
  width: 100%;
}

@media (min-width: 768px) {
  .recent-activity-item-parent, .recent-activity-item-link {
    width: 70%;
    margin: 0;
  }
}

.recent-activity-item-link {
  font-size: 14px;
}

.recent-activity-item-meta {
  margin: 15px 0 0 0;
  float: none;
}

@media (min-width: 768px) {
  .recent-activity-item-meta {
    margin: 0;
    float: right;
  }
  [dir="rtl"] .recent-activity-item-meta {
    float: left;
  }
}

.recent-activity-item-time, .recent-activity-item-comment {
  color: #333;
  display: inline-block;
  font-size: 13px;
}

.recent-activity-item-comment {
  padding-left: 5px;
}

[dir="rtl"] .recent-activity-item-comment {
  padding: 0 5px 0 0;
}

.recent-activity-item-comment::before {
  display: inline-block;
}

.recent-activity-controls {
  padding-top: 15px;
}

.recent-activity-comment-icon svg {
  vertical-align: middle;
  color: rgba(120, 101, 229, 1);
  width: 16px;
  height: 16px;
}

.recent-activity-comment-icon:after {
  content: attr(data-comment-count);
  margin-left: 3px;
}

[dir="rtl"] .recent-activity-comment-icon:after {
  margin-left: 0;
  margin-right: 3px;
}

/***** Category pages *****/
.category-container {
  display: flex;
  justify-content: flex-end;
}

.category-content {
  flex: 1;
}

@media (min-width: 1024px) {
  .category-content {
    flex: 0 0 100%;
  }
}

.section-tree {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 768px) {
  .section-tree {
    flex-direction: row;
  }
}

.section-tree .section {
  flex: initial;
}

@media (min-width: 768px) {
  .section-tree .section {
    flex: 0 0 45%;
    /* Two columns for tablet and desktop. Leaving 5% separation between columns */
  }
}

.section-tree-title {
  margin-bottom: 0;
  font-size: 18px;
  font-weight: 600;
}

.section-tree-title a {
  color: rgba(0, 0, 0, 1);
}

.section-tree .see-all-articles,
.recent-activity-controls > a {
  display: inline-block;
  padding: 6px 15px;
  background: rgba(120, 101, 229, 1);
  border-radius: 3px;
  color: rgba(255, 255, 255, 1);
  margin-top: 10px;
}

.see-all-articles i {
  margin-left: 5px;
  font-size: 10px;
}

.article-list-item,
.section-lists-item {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  font-size: 16px;
  padding: 15px 0;
}

.article-list-item a,
.section-lists-item a {
  color: rgba(0, 0, 0, 1);
}

.icon-star {
  color: rgba(120, 101, 229, 1);
  font-size: 18px;
}

/***** Section pages *****/
.section-container {
  display: flex;
  justify-content: flex-end;
}

.section-content {
  flex: 1;
}

@media (min-width: 1024px) {
  .section-content {
    flex: 0 0 100%;
  }
}

.section-list {
  margin: 40px 0;
}

.section-list--collapsed .section-list-item:nth-child(1n + 6) {
  display: none;
}

.section-list-item {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  font-size: 16px;
  padding: 15px 0;
}

.section-list-item:first-child {
  border-top: 1px solid rgba(120, 101, 229, 1);
}

.section-list-item a {
  align-items: center;
  color: rgba(0, 0, 0, 1);
  display: flex;
  justify-content: space-between;
}

.see-all-sections-trigger {
  cursor: pointer;
  display: block;
  padding: 15px;
  text-align: center;
}

.see-all-sections-trigger[aria-hidden="true"] {
  display: none;
}

/***** Article *****/
.article {
  /*
  * The article grid is defined this way to optimize readability:
  * Sidebar | Content | Free space
  * 17%     | 66%     | 17%
  */
  flex: 1 0 auto;
}

@media (min-width: 1024px) {
  .article {
    flex: 1 0 79%;
    max-width: 79%;
    min-width: 640px;
    padding: 0 0px 0 40px;
  }
  .full__article {
    flex: 1 0 100%;
    max-width: 100%;
    padding: 0;
  }
}

[dir="rtl"] .article {
    padding: 0 40px 0 0;
}

.article-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  .article-container {
    flex-direction: row;
  }
}

.article-header {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  align-items: flex-start;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 20px;
  margin-top: 20px;
  padding-bottom: 15px;
}

@media (min-width: 768px) {
  .article-header {
    flex-direction: row;
    margin-top: 0;
  }
}

.article-avatar {
  margin-right: 10px;
}

.article-author,
.article-subscribe {
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .article-title {
    flex-basis: 100%;
    font-weight: 600;
    /* Take entire row */
  }
}

.article-title .icon-lock {
  position: relative;
  left: -5px;
  vertical-align: baseline;
}

.article [role="button"] {
  flex-shrink: 0;
  /*Avoid collapsing elements in Safari (https://github.com/philipwalton/flexbugs#1-minimum-content-sizing-of-flex-items-not-honored)*/
  width: 100%;
}

@media (min-width: 768px) {
  .article [role="button"] {
    width: auto;
  }
}

.article-info {
  max-width: 100%;
}

.article-meta {
  display: inline-block;
  vertical-align: middle;
}

.article-body {
  display: flow-root;
}

.article-body img {
  height: auto;
}

.article-body iframe,
.article-body a > img {
  max-width: 100% !important;
  border: 1px solid #dddddd;
  padding: 6px;
  border-radius: 8px;
}

.article-body td,
#service-catalog-item td {
  padding: 10px;
}

.article-body ul, .article-body ol,
#service-catalog-item ol,
#service-catalog-item ul {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

[dir="rtl"] .article-body ul, [dir="rtl"] .article-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}

.article-body ul > ul, .article-body ol > ol, .article-body ol > ul, .article-body ul > ol, .article-body li > ul, .article-body li > ol {
  margin: 0;
}

.article-body ul {
  list-style-type: disc;
}

.article-body ul > li,
.article-body ol > li,
.article-body p,
#service-catalog-item li {
  margin-bottom: 15px;
}

.article-body a:visited {
  color: #000;
}

.article-body p > img.image-style-align-left {
  float: left;
  margin: 8px 20px 6px 0;
}
.article-body p > img.image-style-align-right {
  float: right;
  margin: 8px 0px 6px 20px;
}
.article-body p > img.image-style-block-align-right {
  margin-left: auto;
  margin-right: 0;
}
.article-body p > img.image-style-block-align-left {
  margin-left: 0;
  margin-right: auto;
}
.article-body figure.image {
  display: table;
  margin: 0 auto;
}
.article-body figure.image > img {
  display: block;
  width: 100%;
}
.article-body figure.image.image-style-align-left {
  float: left;
  margin: 8px 20px 6px 0;
}
.article-body figure.image.image-style-align-right {
  float: right;
  margin: 8px 0px 6px 20px;
}
.article-body figure.image.image-style-block-align-right {
  margin-left: auto;
  margin-right: 0;
}
.article-body figure.image.image-style-block-align-left {
  margin-left: 0;
  margin-right: auto;
}
.article-body figcaption {
  padding: 10px 0;
  font-size: 12px;
  text-align: center;
  background-color: rgba(101,79,225,0.2);
}

.article-body a {
  text-decoration: underline;
  text-underline-position: under;
  text-decoration-color: rgba(120, 101, 229, 1);
}

.article-body a:hover {
  color: rgba(120, 101, 229, 1);
  text-decoration-color: #141414;
}

.article-body code {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}

.article-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}

.article-body blockquote {
  border-left: 1px solid #ddd;
  color: #333;
  padding: 0 15px;
}

.article-body > p:last-child,
.footer-legal p {
  margin-bottom: 0;
}

.article-content {
  line-height: 1.6;
  margin: 30px 0 40px 0;
  word-wrap: break-word;
}

#service-catalog-item .service-catalog-description {
  line-height: 1.6;
  font-size: 16px;
}

.article-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

.article-comment-count {
  color: #333;
}

.article-comment-count:hover {
  text-decoration: none;
}

.article-comment-count-icon {
  vertical-align: middle;
  color: rgba(120, 101, 229, 1);
  width: 18px;
  height: 18px;
}

.article-sidebar {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  border-top: 1px solid rgba(120, 101, 229, 1);
  flex: 1 0 auto;
  margin-bottom: 20px;
  padding: 0;
}

@media (min-width: 1024px) {
  .article-sidebar {
    border: 0;
    flex: 0 0 20%;
    height: auto;
  }
  .article-sidebar,
  .search-results-sidebar,
  body .request-sidebar {
    position: sticky;
    top: 15px;
    align-self: flex-start;
  }
  body .top-90 {
    top: 90px;
  }
}

.article-relatives {
  border-top: 1px solid rgba(120, 101, 229, 1);
  display: flex;
  flex-direction: column;
  padding: 20px 0;
}

@media (min-width: 768px) {
  .article-relatives {
    flex-direction: row;
  }
}

.article-relatives > * {
  flex: 1 0 50%;
  min-width: 50%;
  overflow-wrap: break-word;
  margin-right: 0;
}

.article-relatives > *:last-child,
body #service-catalog-item ul {
  padding: 0;
}

@media (min-width: 768px) {
  .article-relatives > * {
    padding-right: 20px;
  }
}

.article-votes {
  border-top: 1px solid rgba(120, 101, 229, 1);
  padding: 30px 0;
  text-align: center;
}

.article-votes-question {
  font-weight: 700;
}

.article-vote {
  margin: 10px 5px;
  min-width: 90px;
  width: auto;
}

.article-vote-up:hover,
.article-vote-up:focus,
.article-vote-up:active {
   background: #4cae4c;
   border-color: #4cae4c;
}

.article-vote-down:hover,
.article-vote-down:focus,
.article-vote-down:active {
   background: #d83d31;
   border-color: #d83d31;
}

.article-more-questions {
  margin: -5px 0 20px;
  text-align: center;
}

.article-more-questions a {
    border-bottom: 1px solid rgba(120, 101, 229, 1);
}

.article-return-to-top {
  border-top: 1px solid rgba(120, 101, 229, 1);
}

@media (min-width: 1024px) {
  .article-return-to-top {
    display: none;
  }
}

.article-return-to-top a {
  color: rgba(0, 0, 0, 1);
  display: block;
  padding: 20px 0;
}

.article-return-to-top a:hover, .article-return-to-top a:focus {
  text-decoration: none;
}

.article-return-to-top-icon {
  transform: rotate(0.5turn);
  position: relative;
  top: 5px;
}

.sidenav-title {
  font-size: 15px;
  position: relative;
  font-weight: 600;
  margin-bottom: 10px;
  display: block;
  font-family: 'Instrument Sans', sans-serif;
}

.sidenav-item {
  background: rgba(212, 189, 243, 0.95);
  border-radius: 3px;
  color: rgba(0, 0, 0, 1);
  display: block;
  margin-bottom: 3px;
  padding: 10px;
  font-size: 0.9em;
}

.sidenav-item.current-article, .sidenav-item:hover {
  background-color: rgba(120, 101, 229, 1);
  color: rgba(255, 255, 255, 1);
  text-decoration: none;
}

.recent-articles li,
.related-articles li {
  margin-bottom: 12px;
  position: relative;
}

.content-tags > p {
  color: #68737D;
  margin-top: 32px;
  margin-bottom: 4px;
}

.content-tags-add-hint {
  color: #68737D;
  font-size: 14px;
}

.content-tag-list {
  display: flex;
  flex-wrap: wrap;
  word-break: break-word;
}

.content-tag-list li {
  border-right: 1px solid #C2C8CC;
  margin-bottom: 4px;
}

[dir="ltr"] .content-tag-list li {
  padding-right: 8px;
  margin-right: 8px;
}

[dir="rtl"] .content-tag-list li {
  padding-left: 8px;
  margin-left: 8px;
}

.content-tag-list li:last-child {
  border: none;
}

/***** Attachments *****/
/* Styles attachments inside posts, articles and comments */

.attachments .attachment-item {
  position: relative;
  margin-bottom: 10px;
}

.article-content .attachments .attachment-item {
  background: #F7F7F7;
  padding: 15px;
  border-radius: 5px;
}

.article-content .article-attachments li:first-child {
  margin-top: 25px;
}

.attachments .attachment-item:last-child {
  margin-bottom: 0;
}

.attachments .attachment-item .attachment-icon {
  color: rgba(0, 0, 0, 1);
  left: 0;
  position: relative;
  top: 2px;
}

[dir="rtl"] .attachments .attachment-item {
  padding-left: 0;
  padding-right: 20px;
}

[dir="rtl"] .attachments .attachment-item .attachment-icon {
  left: auto;
  right: 0;
}

.upload-dropzone {
  border-color: rgba(120, 101, 229, 1);
  background-color: #fff;
  border-radius: 3px;
}

.upload-dropzone span {
  color: #333;
}

/***** Social share links *****/
.share {
  padding: 0;
  white-space: nowrap;
}

.share li, .share a {
  display: inline-block;
}

.share li {
  height: 25px;
  width: 25px;
}

.share a {
  color: #333;
}

.share a:hover {
  text-decoration: none;
  color: rgba(120, 101, 229, 1);
}

.share a svg {
  height: 18px;
  width: 18px;
  display: block;
}

/***** Comments *****/
/* Styles comments inside articles, posts and requests */
.comment {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  padding: 20px 0;
}

.comment-heading, .recent-articles-title,
.related-articles-title {
  margin-bottom: 5px;
  margin-top: 0;
  font-size: 18px;
  font-weight: 600;
}

.comment-overview {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  border-top: 1px solid rgba(120, 101, 229, 1);
  padding: 20px 0;
}

.comment-overview p {
  margin-top: 0;
}

.comment-callout {
  color: #333;
  display: inline-block;
  font-size: 13px;
  margin-bottom: 0;
}

.comment-callout a {
  color: #141414;
}

.comment-sorter {
  display: inline-block;
  float: right;
}

.comment-sorter .dropdown-toggle {
  color: #333;
  font-weight: 300;
  font-size: 13px;
}

[dir="rtl"] .comment-sorter {
  float: left;
}

.comment-wrapper {
  display: flex;
  position: relative;
}

.comment-wrapper.comment-official {
  border: 1px solid rgba(120, 101, 229, 1);
  padding: 40px 20px 20px;
}

@media (min-width: 768px) {
  .comment-wrapper.comment-official {
    padding-top: 20px;
  }
}

.comment-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}

[dir="rtl"] .comment-info {
  padding-right: 0;
  padding-left: 20px;
}

.comment-author {
  align-items: flex-start;
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 20px;
}

@media (min-width: 768px) {
  .comment-author {
    justify-content: space-between;
  }
}

.comment-avatar {
  margin-right: 10px;
}

[dir="rtl"] .comment-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.comment-meta {
  flex: 1 0 auto;
}

.comment-labels {
  flex-basis: 100%;
}

@media (min-width: 768px) {
  .comment-labels {
    flex-basis: auto;
  }
}

.comment .status-label:not(.status-label-official) {
  margin-top: 10px;
}

@media (min-width: 768px) {
  .comment .status-label:not(.status-label-official) {
    margin-top: 0;
  }
}

.comment-form {
  display: flex;
  padding-top: 30px;
  word-wrap: break-word;
}

.comment-container {
  width: 100%;
}

.comment-form-controls {
  display: none;
  margin-top: 10px;
  text-align: left;
}

@media (min-width: 768px) {
  [dir="ltr"] .comment-form-controls {
    text-align: right;
  }
}

.comment-form-controls input[type="submit"] {
  margin-top: 15px;
}

@media (min-width: 1024px) {
  .comment-form-controls input[type="submit"] {
    margin-left: 15px;
  }
  [dir="rtl"] .comment-form-controls input[type="submit"] {
    margin-left: 0;
    margin-right: 15px;
  }
}

.comment-form-controls input[type="checkbox"] {
  margin-right: 5px;
}

.comment-form-controls input[type="checkbox"] [dir="rtl"] {
  margin-left: 5px;
}

.comment-ccs,
body .fancybox__caption,
body .fancybox__button--zoom,
body .fancybox__thumbs,
body .fancybox__nav,
body .fancybox__toolbar__items--left,
body .fancybox__button--slideshow,
body .fancybox__button--thumbs {
  display: none;
}

.comment-ccs + textarea {
  margin-top: 10px;
}

.comment-attachments {
  margin-top: 10px;
}

.comment-attachments a {
  color: #141414;
}

.comment-body {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  font-family: 'Instrument Sans', sans-serif;
  line-height: 1.6;
  overflow-x: auto;
}

.comment-body img {
  height: auto;
  max-width: 100%;
}

.comment-body ul, .comment-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

[dir="rtl"] .comment-body ul, [dir="rtl"] .comment-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}

.comment-body ul > ul, .comment-body ol > ol, .comment-body ol > ul, .comment-body ul > ol, .comment-body li > ul, .comment-body li > ol {
  margin: 0;
}

.comment-body ul {
  list-style-type: disc;
}

.comment-body a:visited {
  color: #000;
}

.comment-body code {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}

.comment-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}

.comment-body blockquote {
  border-left: 1px solid #ddd;
  color: #333;
  padding: 0 15px;
}

.comment-mark-as-solved {
  display: inline-block;
}

/***** Vote *****/
/* Used in article comments, post comments and post */
.vote {
  display: flex;
  flex-direction: column;
  text-align: center;
}

.vote a:active, .vote a:hover, .vote a:focus {
  text-decoration: none;
}

.vote-sum {
  color: #333;
  display: block;
  margin: 3px 0;
}

[dir="rtl"] .vote-sum {
  direction: ltr;
  unicode-bidi: bidi-override;
}

.vote-up svg {
  transform: scale(1, -1);
}

.vote-up:hover,
.vote-down:hover {
  color: rgba(120, 101, 229, 1);
}

.vote-up, .vote-down {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: none;
  color: #333;
  cursor: pointer;
  min-height: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vote-voted {
  color: rgba(120, 101, 229, 1);
}

.vote-voted:hover {
  color: #3921c3;
}

/***** Actions *****/
/* Styles admin and en user actions(edit, delete, change status) in comments and posts */
.actions {
  text-align: center;
  flex-shrink: 0;
  /*Avoid collapsing elements in Safari*/
}

.actions button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: transparent;
  border: none;
  cursor: pointer;
  min-height: 35px;
  min-width: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/***** Community *****/

.community-hero {
  background-image: url($community_background_image);
  margin-bottom: 10px;
}

.community-footer {
  padding-top: 20px;
  padding-bottom: 20px;
  text-align: center;
}

.community-footer-title {
  font-size: 20px;
  margin-bottom: 20px;
  font-weight: 600;
}

.community-featured-posts .title {
  font-size: 18px;
  font-weight: 600;
}

.community-featured-posts, .community-activity {
  padding-top: 40px;
  width: 100%;
}

.community-header {
  margin-bottom: 30px;
}

.community-header .title {
  margin-bottom: 0;
  font-size: 16px;
}

.post-to-community {
  margin-top: 10px;
}

@media (min-width: 768px) {
  .post-to-community {
    margin: 0;
  }
}

.pt-40 {
  padding-top: 40px;
}

.mt-30 {
  margin-top: 30px;
}

/* Community topics grid */
.topics {
  max-width: none;
  width: 100%;
}

.topics-item .meta-group {
  justify-content: center;
  margin-top: 10px;
}

/* Community topic page */
.topic-header {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  font-size: 13px;
}

@media (min-width: 768px) {
  .topic-header {
    padding-bottom: 10px;
  }
}

.topic-header .dropdown {
  display: block;
  border-top: 1px solid rgba(120, 101, 229, 1);
  padding: 10px 0;
}

@media (min-width: 768px) {
  .topic-header .dropdown {
    border-top: 0;
    display: inline-block;
    margin-right: 20px;
    padding: 0;
  }
}

.no-posts-with-filter {
  margin-top: 20px;
  margin-bottom: 20px;
}

/* Topic, post and user follow button */
.community-follow {
  margin-bottom: 10px;
  width: 100%;
}

@media (min-width: 768px) {
  .community-follow {
    margin-bottom: 0;
    width: auto;
  }
}

.community-follow button {
  line-height: 30px;
  padding: 0 10px 0 15px;
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  .community-follow button {
    width: auto;
  }
}

.community-follow button:hover {
  background-color: rgba(120, 101, 229, 1);
}

.community-follow button:hover::after, .community-follow button:focus::after {
  border-color: rgba(255, 255, 255, 1);
  color: rgba(255, 255, 255, 1);
}

.community-follow button[data-selected="true"] {
  background-color: rgba(120, 101, 229, 1);
  color: rgba(255, 255, 255, 1);
}

.community-follow button[data-selected="true"]::after {
  border-left: 1px solid rgba(255, 255, 255, 1);
  color: rgba(255, 255, 255, 1);
}

.community-follow button[data-selected="true"]:hover {
  background-color: #3921c3;
  border-color: #3921c3;
}

.community-follow button::after {
  border-left: 1px solid #fff;
  content: attr(data-follower-count);
  color: #fff;
  display: inline-block;
  margin-left: 15px;
  padding-left: 10px;
  position: absolute;
  right: 10px;
}

@media (min-width: 768px) {
  .community-follow button::after {
    position: static;
  }
}

[dir="rtl"] .community-follow button::after {
  border-left: 0;
  border-right: 1px solid rgba(120, 101, 229, 1);
  margin: 0 10px 0 0;
  padding: 0 10px 0 0;
}

/***** Striped list *****/
/* Used in community posts list and requests list */
.striped-list {
  padding: 0;
}

.striped-list-item {
  align-items: flex-start;
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 20px 0;
}

@media (min-width: 768px) {
  .striped-list-item {
    align-items: center;
    flex-direction: row;
  }
}

.striped-list-info {
  flex: 2;
}

.striped-list-title {
  color: #141414;
  margin-bottom: 10px;
  margin-right: 5px;
}

.striped-list-title:hover, .striped-list-title:focus, .striped-list-title:active {
  text-decoration: underline;
}

.striped-list-title:visited {
  color: #000;
}

.striped-list .meta-group {
  margin: 5px 0;
}

.striped-list-count {
  color: #333;
  font-size: 13px;
  justify-content: flex-start;
  text-transform: capitalize;
}

@media (min-width: 768px) {
  .striped-list-count {
    display: flex;
    flex: 1;
    justify-content: space-around;
  }
}

.striped-list-count-item::after {
  content: "·";
  display: inline-block;
  padding: 0 5px;
}

@media (min-width: 768px) {
  .striped-list-count-item::after {
    display: none;
  }
}

.striped-list-count-item:last-child::after {
  display: none;
}

.striped-list-number {
  text-align: center;
}

@media (min-width: 768px) {
  .striped-list-number {
    color: rgba(0, 0, 0, 1);
    display: block;
    font-weight: 400;
  }
}

/***** Status labels *****/
/* Styles labels used in posts, articles and requests */
.status-label {
  background-color: #038153;
  border-radius: 3px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  margin-right: 2px;
  padding: 3px 10px;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-block;
}

.status-label:hover, .status-label:active, .status-label:focus {
  text-decoration: none;
}

.status-label-pinned, .status-label-featured, .status-label-official {
  background-color: rgba(120, 101, 229, 1);
}

.status-label-official {
  border-radius: 0;
  margin-right: 0;
  position: absolute;
  right: 0;
  text-align: center;
  top: 0;
  width: 100%;
}

@media (min-width: 768px) {
  .status-label-official {
    border-radius: 0 0 4px 4px;
    right: 30px;
    width: auto;
  }
}

[dir="rtl"] .status-label-official {
  left: 30px;
  right: auto;
}

.status-label-not-planned, .status-label-closed {
  background-color: #e9ebed;
  color: #333;
}

.status-label-pending, .status-label-pending-moderation {
  background-color: #1f73b7;
  text-align: center;
}

.status-label-open {
  background-color: #c72a1c;
}

.status-label-solved {
  background-color: #68737d;
}

.status-label-new {
  background-color: #ffb648;
  color: #703b15;
}

.status-label-hold {
  background-color: #000;
}

.status-label-open, .status-label-closed, .status-label-solved, .status-label-new, .status-label-hold, .status-label-pending {
  text-transform: lowercase;
}

/***** Post *****/
/*
* The post grid is defined this way:
* Content | Sidebar
* 70%     | 30%
*/
.post {
  flex: 1;
  margin-bottom: 10px;
}

@media (min-width: 1024px) {
  .post {
    flex: 1 0 70%;
    max-width: 70%;
  }
}

.post-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  .post-container {
    flex-direction: row;
  }
}

.post-header {
  align-items: center;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-bottom: 10px;
}

@media (min-width: 768px) {
  .post-header {
    align-items: baseline;
    flex-direction: row;
  }
}

.post-header .status-label {
  vertical-align: super;
}

.post-title {
  margin-bottom: 20px;
  width: 100%;
}

@media (min-width: 768px) {
  .post-title {
    margin-bottom: 0;
    padding-right: 10px;
  }
}

.post-title h1 {
  display: inline;
  vertical-align: middle;
  font-weight: 600;
}

@media (min-width: 768px) {
  .post-title h1 {
    margin-right: 5px;
  }
}

.post-author {
  align-items: flex-start;
  display: flex;
  justify-content: space-between;
}

.post-avatar {
  margin-bottom: 30px;
}

.post-content {
  font-family: 'Instrument Sans', sans-serif;
  line-height: 1.6;
  word-break: break-word;
}

.post-info-container {
  display: flex;
  margin-bottom: 40px;
}

.post-info {
  min-width: 0;
  padding-right: 20px;
  width: 100%;
}

[dir="rtl"] .post-info {
  padding-right: 0;
  padding-left: 20px;
}

.post-meta {
  display: inline-block;
  flex: 1;
  margin-left: 10px;
  vertical-align: middle;
}

[dir="rtl"] .post-meta {
  margin-left: 0;
  margin-right: 10px;
}

.post-body img {
  height: auto;
  max-width: 100%;
}

.post-body ul, .post-body ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}

[dir="rtl"] .post-body ul, [dir="rtl"] .post-body ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}

.post-body ul > ul, .post-body ol > ol, .post-body ol > ul, .post-body ul > ol, .post-body li > ul, .post-body li > ol {
  margin: 0;
}

.post-body ul {
  list-style-type: disc;
}

.post-body a:visited {
  color: #000;
}

.post-body code {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}

.post-body pre {
  background: #f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
}

.post-body blockquote {
  border-left: 1px solid #ddd;
  color: #333;
  padding: 0 15px;
}

.post-footer {
  align-items: center;
  display: flex;
  justify-content: space-between;
  padding-bottom: 20px;
}

.post-comment-count {
  color: #333;
}

.post-comment-count:hover {
  text-decoration: none;
}

.post-comment-count .icon-comments {
  color: rgba(120, 101, 229, 1);
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 5px;
  vertical-align: middle;
}

.post-sidebar {
  border-top: 1px solid rgba(120, 101, 229, 1);
  flex: 1;
  padding: 30px 0;
  text-align: center;
}

@media (min-width: 1024px) {
  .post-sidebar {
    border: 0;
    flex: 1 0 30%;
    padding: 0 0 0 50px;
    text-align: initial;
  }
  [dir="rtl"] .post-sidebar {
    padding: 0 50px 0 0;
  }
}

.post-sidebar-title {
  font-size: 18px;
  font-weight: 600;
}

.post-comments {
  margin-bottom: 20px;
}

@media (min-width: 1024px) {
  .post-comments {
    margin-bottom: 0;
  }
}

/* Navigation element that collapses on mobile */
.collapsible-nav {
  flex-direction: column;
  font-size: 14px;
  position: relative;
}

@media (min-width: 768px) {
  .collapsible-nav {
    flex-direction: row;
  }
}

.collapsible-nav-border {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  border-top: 1px solid rgba(120, 101, 229, 1);
}

@media (min-width: 768px) {
  .collapsible-nav-border {
    border-top: 0;
  }
}

.collapsible-nav-toggle {
  top: calc(45px / 2);
  transform: translateY(-50%);
  position: absolute;
  right: 0;
  padding: 0;
  border: 0;
  background: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  z-index: 1;
}

@media (min-width: 768px) {
  .collapsible-nav-toggle {
    display: none;
  }
}

[dir="rtl"] .collapsible-nav-toggle {
  left: 0;
  right: auto;
}

.collapsible-nav-toggle-icon {
  display: none;
}

.collapsible-nav-toggle[aria-expanded="false"] .chevron-icon {
  display: inline-block;
}

.collapsible-nav-toggle[aria-expanded="true"] .x-icon {
  display: inline-block;
}

.collapsible-nav-toggle:focus {
  outline: none;
}

.collapsible-nav-list {
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .collapsible-nav-list {
    flex-direction: row;
  }
}

.collapsible-nav-list li {
  color: rgba(0, 0, 0, 1);
  line-height: 45px;
  order: 1;
}

@media (min-width: 768px) {
  .collapsible-nav-list li {
    line-height: normal;
    margin-right: 30px;
  }
  [dir="rtl"] .collapsible-nav-list li {
    margin-left: 30px;
    margin-right: 0;
  }
  .collapsible-nav-list li a {
    text-decoration: none;
    padding: 15px 0;
  }
}

.collapsible-nav-list li a {
  color: rgba(0, 0, 0, 1);
  display: block;
}

@media (min-width: 768px) {
  .collapsible-nav-list li:hover {
    border-bottom: 4px solid #ddd;
  }
  .collapsible-nav-list li:hover a:not([aria-current="page"]) {
    padding: 15px 0 11px 0;
    text-decoration: none;
  }
}

.collapsible-nav-list li:not([aria-selected="true"]),
.collapsible-nav-list li:not(.current) {
  display: none;
}

@media (min-width: 768px) {
  .collapsible-nav-list li:not([aria-selected="true"]),
  .collapsible-nav-list li:not(.current) {
    display: block;
  }
}

@media (min-width: 768px) {
  .collapsible-nav-list li[aria-selected="true"] {
    padding: 15px 0 11px 0;
  }
}

.collapsible-nav-list li[aria-selected="true"],
.collapsible-nav-list li.current {
  order: 0;
  position: relative;
}

@media (min-width: 768px) {
  .collapsible-nav-list li[aria-selected="true"],
  .collapsible-nav-list li.current {
    border-bottom: 4px solid rgba(120, 101, 229, 1);
    order: 1;
  }
}

.collapsible-nav-list li[aria-selected="true"] a,
.collapsible-nav-list li.current a {
  color: rgba(0, 0, 0, 1);
}

.collapsible-nav[aria-expanded="true"] li:not([aria-selected="true"]),
.collapsible-nav[aria-expanded="true"] li:not(.current) {
  display: block;
}

/* Sidebar navigation that collapses on mobile */
.collapsible-sidebar {
  flex: 1;
  max-height: 45px;
  overflow: hidden;
  padding: 10px 0;
  position: relative;
}

@media (min-width: 1024px) {
  .collapsible-sidebar {
    max-height: none;
    padding: 0;
  }
}

.collapsible-sidebar-title {
  margin-top: 0;
}

.collapsible-sidebar-toggle {
  position: absolute;
  top: calc(45px / 2);
  transform: translateY(-50%);
  right: 0;
  padding: 0;
  border: 0;
  background: none;
  width: 25px;
  height: 25px;
  border-radius: 50%;
}

@media (min-width: 1024px) {
  .collapsible-sidebar-toggle {
    display: none;
  }
}

[dir="rtl"] .collapsible-sidebar-toggle {
  left: 0;
  right: auto;
}

.collapsible-sidebar-toggle-icon {
  display: none;
}

.collapsible-sidebar-toggle[aria-expanded="false"] .chevron-icon {
  display: inline-block;
}

.collapsible-sidebar-toggle[aria-expanded="true"] .x-icon {
  display: inline-block;
}

.collapsible-sidebar-toggle:focus {
  outline: none;
  border: 1px solid rgba(120, 101, 229, 1);
}

.collapsible-sidebar-body {
  display: none;
}

@media (min-width: 1024px) {
  .collapsible-sidebar-body {
    display: block;
  }
}

.collapsible-sidebar[aria-expanded="true"] {
  max-height: none;
}

.collapsible-sidebar[aria-expanded="true"] .collapsible-sidebar-body {
  display: block;
}

/***** My activities *****/
.my-activities-nav {
  background-color: rgba(212, 189, 243, 0.95);
  margin-bottom: 20px;
}

.my-activities-sub-nav {
  margin-bottom: 30px;
}

.my-activities-table .striped-list-title {
  /* My activities tables */
  display: block;
  margin-bottom: 10px;
  max-width: 350px;
  white-space: normal;
}

@media (min-width: 1024px) {
  .my-activities-table .striped-list-title {
    margin-bottom: 0;
    max-width: 500px;
    min-width: 350px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

.my-activities-table thead {
  display: none;
}

@media (min-width: 768px) {
  .my-activities-table thead {
    display: table-header-group;
  }
}

.my-activities-table th:first-child,
.my-activities-table td:first-child {
  padding-left: 0;
}

@media (min-width: 1024px) {
  .my-activities-table th:first-child,
  .my-activities-table td:first-child {
    width: 500px;
  }
}

.my-activities-table th:last-child,
.my-activities-table td:last-child {
  padding-right: 0;
}

.my-activities-table td:not(:first-child) {
  display: none;
}

@media (min-width: 768px) {
  .my-activities-table td:not(:first-child) {
    display: table-cell;
  }
}

/* Requests table */
.requests-search {
  width: 100%;
}

.requests-table-toolbar {
  align-items: flex-end;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .requests-table-toolbar {
    flex-direction: row;
  }
}

.requests-table-toolbar .search {
  flex: 1;
  width: 100%;
}

.requests-table-toolbar .request-table-filter {
  width: 100%;
}

@media (min-width: 768px) {
  .requests-table-toolbar .request-table-filter {
    width: auto;
  }
}

.requests-table-toolbar .request-filter {
  display: block;
}

@media (min-width: 768px) {
  .requests-table-toolbar .request-filter {
    margin: 0 0 0 30px;
  }
  [dir="rtl"] .requests-table-toolbar .request-filter {
    margin: 0 30px 0 0;
  }
}

.requests-table-toolbar .request-filter-label {
  font-size: 13px;
  margin-top: 30px;
}

@media (min-width: 768px) {
  .requests-table-toolbar .request-filter-label {
    margin-top: 0;
  }
}

.requests-table-toolbar select {
  max-height: 40px;
  margin-bottom: 30px;
  width: 100%;
}

@media (min-width: 768px) {
  .requests-table-toolbar select {
    margin-bottom: 0;
    width: auto;
  }
}

@media (min-width: 768px) {
  .requests-table-toolbar .organization-subscribe {
    margin-left: 10px;
  }
  [dir="rtl"] .requests-table-toolbar .organization-subscribe {
    margin: 0 10px 0 0;
  }
}

.requests-table-toolbar .organization-subscribe button {
  line-height: 40px;
  max-height: 40px;
  padding: 0 20px;
}

.requests-table-toolbar + .requests-search-info {
  margin-top: 15px;
}

.requests-table-toolbar + .requests-search-info.meta-data::after {
  content: "";
  margin: 0;
}

.requests-table-toolbar + .requests-search-info + .requests {
  margin-top: 20px;
}

.requests-table-toolbar + .requests {
  margin-top: 40px;
}

.requests .requests-table-meta {
  display: block;
}

@media (min-width: 768px) {
  .requests .requests-table-meta {
    display: none;
  }
}

.requests .requests-table thead {
  display: none;
}

@media (min-width: 768px) {
  .requests .requests-table thead {
    display: table-header-group;
  }
}

.requests .requests-table-info {
  display: block;
}

@media (min-width: 768px) {
  .requests .requests-table-info {
    display: table-cell;
    vertical-align: middle;
    width: auto;
  }
}

.requests .requests-table .requests-link {
  position: relative;
}

.requests .requests-table .requests-sort-symbol {
  position: absolute;
  left: calc(100% + 3px);
  bottom: 0;
  font-size: 10px;
}

/* Following table */
@media (min-width: 768px) {
  .subscriptions-subscribe button {
    width: auto;
  }
}

.subscriptions-table td:last-child {
  display: block;
}

@media (min-width: 768px) {
  .subscriptions-table td:last-child {
    display: table-cell;
  }
}

.subscriptions-table td:first-child {
  display: flex;
  align-items: center;
}

.subscriptions-table .user-avatar {
  margin-right: 10px;
}

.subscriptions .striped-list-title {
  display: inline-block;
  vertical-align: middle;
}

/* Contributions table */
.contributions-table td:last-child {
  color: #333;
  font-size: 13px;
}

@media (min-width: 768px) {
  .contributions-table td:last-child {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
  }
}

.no-activities {
  color: #333;
}

/***** Request *****/
.request-container {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 1024px) {
  .request-container {
    align-items: flex-start;
    flex-direction: row;
  }
}

.request-container .comment-container {
  min-width: 0;
}

.request-breadcrumbs {
  margin-bottom: 30px;
}

@media (min-width: 1024px) {
  .request-breadcrumbs {
    margin-bottom: 20px;
  }
}

.request-main {
  flex: 1 0 auto;
  order: 1;
}

.request-main .comment-fields, .request-main .request-submit-comment {
  display: none;
}

.request-main .comment-fields.shown {
  display: block;
}

.request-main .request-submit-comment.shown {
  display: inline;
}

@media (min-width: 1024px) {
  .request-main {
    flex: 0 0 66%;
    order: 0;
    min-width: 0;
  }
}

.request-main .comment-form-controls {
  display: block;
}

.request-main .comment-ccs {
  display: block;
}

.request-main .comment-show-container {
  border-radius: 2px;
  border: 1px solid rgba(120, 101, 229, 1);
  color: #333;
  text-align: inherit;
  padding: 8px 25px;
  width: 100%;
}

.request-main .comment-show-container.hidden {
  display: none;
}

.request-main .form-field.comment-ccs > ul {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}

.request-main .form-field.comment-ccs > ul[data-hc-focus="true"] {
  border: 1px solid rgba(120, 101, 229, 1);
}

.request-main .form-field.comment-ccs > input[type="text"] {
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  border-bottom: 0;
}

.request-main .comment-ccs + textarea {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
  margin-top: 0;
}

.request-main .comment-ccs + textarea:focus {
  border-top: 1px solid rgba(120, 101, 229, 1);
}

.request-main input#mark_as_solved {
  display: none;
}

.request-title {
  width: 100%;
  font-weight: 600;
}

@media (min-width: 1024px) {
  .request-title {
    border-bottom: 1px solid rgba(120, 101, 229, 1);
    margin-bottom: 0;
    max-width: 66%;
    padding-bottom: 20px;
  }
}

.request-sidebar {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  border-top: 1px solid rgba(120, 101, 229, 1);
  flex: 1 0 auto;
  order: 0;
}

@media (min-width: 1024px) {
  .request-sidebar {
    background-color: rgba(212, 189, 243, 0.95);
    border: 0;
    font-size: 13px;
    flex: 0 0 auto;
    padding: 0 20px;
    width: 30%;
  }
}

.request-sidebar h2 {
  font-size: 15px;
  font-weight: 600;
  position: relative;
}

@media (min-width: 1024px) {
  .request-sidebar h2 {
    display: none;
  }
}

.request-details {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  font-size: 0;
  margin: 0;
  padding-bottom: 20px;
}

.request-details:last-child {
  border: 0;
}

.request-details dt, .request-details dd {
  display: inline-block;
  vertical-align: top;
  font-size: 13px;
  margin: 20px 0 0 0;
}

.request-details dd {
  padding: 0 10px;
  width: 60%;
}

.request-details dd::after {
  content: "\A";
  white-space: pre;
}

.request-details dt {
  color: rgba(0, 0, 0, 1);
  font-weight: 600;
  width: 40%;
}

.request-details .request-collaborators {
  display: inline-block;
}

.request-attachments dt, .request-attachments dd {
  width: 100%;
}

.request-attachments dd {
  margin: 10px 0 0 0;
}

.request-form textarea {
  min-height: 120px;
}

.request-follow-up {
  padding-top: 20px;
}

/***** Pagination *****/
.pagination {
  margin: 20px 0;
  text-align: center;
}

.pagination-next, .pagination-prev, .pagination-first, .pagination-last {
  display: inline-block;
}

.pagination-first-link, .pagination-last-link {
  padding: 0 10px;
}

.pagination-next-link {
  padding-right: 10px;
}

.pagination-next-text {
  margin-right: 10px;
}

[dir="rtl"] .pagination-next-link {
  padding-left: 10px;
}

[dir="rtl"] .pagination-next-text {
  margin-left: 10px;
}

.pagination-prev-link {
  padding-left: 10px;
}

.pagination-prev-text {
  margin-left: 10px;
}

[dir="rtl"] .pagination-prev-link {
  padding-right: 10px;
}

[dir="rtl"] .pagination-prev-text {
  margin-right: 10px;
}

/***** Metadata *****/
.meta-group {
  display: block;
}

.meta-group * {
  display: inline;
}

.meta-data {
  color: #333;
  font-size: 13px;
}

.meta-data:not(:last-child)::after {
  content: "\00B7";
  margin: 0 5px;
}

/* User Profiles */
.profile-header {
  padding: 30px 0;
}

.profile-header .container {
  display: flex;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .profile-header .container {
    flex-wrap: nowrap;
  }
}

.profile-header .profile-info {
  flex-basis: 100%;
  display: flex;
  flex-wrap: wrap;
  min-width: 0;
}

.profile-avatar {
  position: relative;
  line-height: 0;
  align-self: center;
  margin-right: 10px;
}

[dir="rtl"] .profile-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.profile-avatar .user-avatar {
  width: 65px;
  height: 65px;
}

.profile-avatar .icon-agent {
  bottom: 0;
  right: 0;
}

.profile-header .basic-info {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  flex-basis: 0;
  min-width: 0;
}

.profile-header .basic-info .name {
  margin: 0;
  font-weight: 600;
  line-height: 22px;
}

.profile-header .basic-info .name a {
  color: #333;
}

.profile-header .options {
  display: flex;
  flex-basis: 100%;
  margin-top: 12px;
  align-items: flex-start;
  flex-wrap: wrap;
}

@media (min-width: 768px) {
  .profile-header .options {
    flex-wrap: nowrap;
    flex-basis: auto;
    margin-top: 0;
    margin-left: 10px;
  }
  [dir="rtl"] .profile-header .options {
    margin-left: 0;
    margin-right: 10px;
  }
  .profile-header .options > :not(:last-child) {
    margin-bottom: 0;
    margin-right: 10px;
  }
  [dir="rtl"] .profile-header .options > :not(:last-child) {
    margin-left: 10px;
    margin-right: 0;
  }
}

.edit-profile-button a {
  background-color: rgba(120, 101, 229, 1);
  border: 0;
  color: rgba(255, 255, 255, 1);
  line-height: normal;
  padding: 8px 20px;
  outline-color: rgba(120, 101, 229, 1);
}

.profile-header .description {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  margin: 15px 0;
  flex-basis: 100%;
}

.profile-stats {
  font-size: 13px;
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
}

.profile-stats .stat {
  display: flex;
  margin-bottom: 10px;
}

.profile-stats .stat-label {
  color: #333;
  flex: 0 0 100px;
  margin-right: 10px;
}

[dir="rtl"] .profile-stats .stat-label {
  margin-left: 10px;
  margin-right: 0;
}

.profile-stats-activity {
  border-top: solid 1px rgba(120, 101, 229, 1);
  margin-top: 15px;
}

@media (min-width: 768px) {
  .profile-stats-activity {
    border-top: 0;
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .profile-stats-activity .stat {
    flex-direction: column;
  }
}

.profile-stats-activity .stat:first-child {
  margin-top: 10px;
}

@media (min-width: 768px) {
  .profile-stats-activity .stat:first-child {
    margin-top: 0;
  }
}

@media (min-width: 768px) {
  .profile-stats-activity .stat:not(:last-child) {
    margin-right: 40px;
  }
  [dir="rtl"] .profile-stats-activity .stat:not(:last-child) {
    margin-left: 40px;
    margin-right: 0;
  }
}

@media (min-width: 768px) {
  .profile-stats-activity .stat-label {
    flex: 0 1 auto;
  }
}

.profile-stats-counters {
  border-bottom: solid 1px rgba(120, 101, 229, 1);
}

@media (min-width: 768px) {
  .profile-stats-counters {
    flex: 0 0 200px;
    border-bottom: 0;
    margin-left: 40px;
  }
  [dir="rtl"] .profile-stats-counters {
    margin-left: 0;
    margin-right: 40px;
  }
}

@media (min-width: 1024px) {
  .profile-stats-counters {
    flex: 0 0 270px;
    margin-left: 60px;
  }
  [dir="rtl"] .profile-stats-counters {
    margin-right: 60px;
    margin-left: 0;
  }
}

@media (min-width: 768px) {
  .profile-stats-counters .stat {
    flex-direction: column;
  }
}

@media (min-width: 1024px) {
  .profile-stats-counters .stat {
    flex-direction: row;
  }
}

@media (min-width: 768px) {
  .profile-stats-counters .stat:not(:last-child) {
    margin-bottom: 15px;
  }
}

@media (min-width: 768px) {
  .profile-stats-counters .stat-label {
    flex: 0 1 auto;
  }
}

@media (min-width: 1024px) {
  .profile-stats-counters .stat-label {
    flex: 0 0 100px;
  }
}

.profile-private-badge {
  flex-basis: 100%;
  border: solid 1px rgba(120, 101, 229, 1);
  border-radius: 4px;
  color: rgba(120, 101, 229, 1);
  padding: 5px 20px;
  font-size: 12px;
  text-align: center;
}

.profile-private-badge .profile-private-icon {
  margin-left: 5px;
  line-height: 15px;
}

@media (min-width: 768px) {
  .profile-private-badge {
    flex-basis: auto;
  }
}

.profile-nav {
  background-color: rgba(212, 189, 243, 0.95);
  margin-bottom: 37px;
}

.profile-section {
  width: 100%;
}

@media (min-width: 1024px) {
  .profile-section {
    width: calc(100% - 330px);
  }
}

.profile-section-header {
  display: flex;
  flex-wrap: wrap;
}

.profile-section-title {
  flex-basis: 100%;
  margin-bottom: 0;
}

.profile-section-description {
  flex-basis: 100%;
  padding: 10px 0;
  color: #333;
  font-size: 13px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

@media (min-width: 768px) {
  .profile-section-description {
    flex: 1 0 50%;
    padding-bottom: 0;
  }
}

.profile-section-sorter {
  flex-basis: 100%;
  border-top: solid 1px #eee;
  font-size: 13px;
}

.profile-section-sorter .dropdown-toggle {
  padding: 10px 0;
  width: 100%;
}

.profile-section-sorter .dropdown-toggle::after {
  position: absolute;
  right: 0;
}

[dir="rtl"] .profile-section-sorter .dropdown-toggle::after {
  left: 0;
  right: initial;
}

@media (min-width: 768px) {
  .profile-section-sorter .dropdown-toggle::after {
    position: relative;
  }
}

@media (min-width: 768px) {
  .profile-section-sorter {
    flex: 0 1 auto;
    padding-top: 0;
    border-top: 0;
    margin-left: 20px;
  }
  [dir="rtl"] .profile-section-sorter {
    margin-left: 0;
    margin-right: 20px;
  }
}

.profile-contribution {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  padding: 20px 0;
  position: relative;
}

.profile-contribution-header {
  margin-bottom: 5px;
}

.profile-contribution-title {
  margin: 0 0 5px 0;
  display: inline;
  line-height: 21px;
  font-size: 16px;
  vertical-align: middle;
}

.profile-contribution-title > a {
   color: rgba(0, 0, 0, 1);
}

.profile-contribution-body {
  margin: 10px 0;
}

.profile-contribution-list > .profile-contribution {
  border-top: 1px solid rgba(120, 101, 229, 1);
}

@media (min-width: 768px) {
  .profile-contribution-list > .profile-contribution {
    padding-left: 30px;
  }
  [dir="rtl"] .profile-contribution-list > .profile-contribution {
    padding-right: 30px;
    padding-left: 0;
  }
}

.profile-contribution-list > .profile-contribution:last-child {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
}

.profile-contribution-icon {
  left: 0;
  position: absolute;
  color: #ccc;
  line-height: 25px;
}

[dir="rtl"] .profile-contribution-icon {
  right: 0;
}

.profile-contribution-icon svg {
  vertical-align: middle;
}

.profile-contribution-list .profile-contribution-header {
  margin-left: 30px;
}

[dir="rtl"] .profile-contribution-list .profile-contribution-header {
  padding-right: 30px;
  padding-left: 0;
}

@media (min-width: 768px) {
  .profile-contribution-list .profile-contribution-header {
    margin-left: 0;
  }
  [dir="rtl"] .profile-contribution-list .profile-contribution-header {
    padding-right: 0;
  }
}

.profile-comments .profile-contribution-breadcrumbs {
  margin-left: 30px;
}

[dir="rtl"] .profile-comments .profile-contribution-breadcrumbs {
  padding-right: 30px;
  padding-left: 0;
}

@media (min-width: 768px) {
  .profile-comments .profile-contribution-breadcrumbs {
    margin-left: 0;
  }
  [dir="rtl"] .profile-comments .profile-contribution-breadcrumbs {
    padding-right: 0;
  }
}

.profile-section .no-activity,
.profile-section .private-activity {
  display: block;
  margin-top: 40px;
  color: #999;
}

.private-activity-icon {
  margin-right: 10px;
}

[dir="rtl"] .private-activity-icon {
  margin-right: 0;
  margin-left: 10px;
}

.profile-activity-list {
  margin-top: 25px;
}

.profile-activity {
  position: relative;
  padding-bottom: 30px;
}

@media (min-width: 768px) {
  .profile-activity {
    padding-left: 20px;
  }
  [dir="rtl"] .profile-activity {
    padding-right: 20px;
    padding-left: 0;
  }
}

@media (min-width: 768px) {
  .profile-activity:not(:last-child) {
    border-left: 1px solid rgba(120, 101, 229, 1);
  }
  [dir="rtl"] .profile-activity:not(:last-child) {
    border-left: 0;
    border-right: 1px solid rgba(120, 101, 229, 1);
  }
}

.profile-activity-header {
  display: flex;
  align-items: center;
  margin-left: 35px;
}

[dir="rtl"] .profile-activity-header {
  margin-left: 0;
  margin-right: 35px;
}

@media (min-width: 768px) {
  .profile-activity-header {
    margin-left: 0;
  }
  [dir="rtl"] .profile-activity-header {
    margin-right: 0;
  }
}

.profile-activity-header .user-avatar {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  min-width: 40px;
  align-self: flex-start;
}

[dir="rtl"] .profile-activity-header .user-avatar {
  margin-left: 10px;
  margin-right: 0;
}

.profile-activity-description {
  -moz-hyphens: auto;
  -ms-hyphens: auto;
  -webkit-hyphens: auto;
  word-break: break-word;
  word-wrap: break-word;
  margin: 0;
  min-width: 0;
  width: 100%;
}

.profile-activity-description span:first-child {
  font-weight: 600;
  display: inline;
}

.profile-activity-contribution {
  padding: 20px;
  margin-top: 10px;
  border-radius: 8px;
  background-color: rgba(212, 189, 243, 0.95);
}

@media (min-width: 768px) {
  .profile-activity-contribution {
    margin-top: 0;
    margin-left: 50px;
  }
  [dir="rtl"] .profile-activity-contribution {
    margin-left: 0;
    margin-right: 50px;
  }
}

.profile-activity-icon {
  position: absolute;
  left: 0;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-color: #ffffff;
  background-position: 50% 50%;
  text-align: center;
  color: #ccc;
}

[dir="rtl"] .profile-activity-icon {
  right: 0;
}

@media (min-width: 768px) {
  .profile-activity-icon {
    left: -14px;
  }
  [dir="rtl"] .profile-activity-icon {
    right: -14px;
  }
}

.profile-activity-icon svg {
  position: relative;
  top: 50%;
  transform: translateY(-50%);
  width: 1em;
  height: 1em;
  margin: auto;
}

/***** Search results *****/
.search-results {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: space-between;
}

@media (min-width: 1024px) {
  .search-results {
    flex-direction: row;
  }
}

.search-results-column {
  flex: 1;
}

@media (min-width: 1024px) {
  .search-results-column {
    flex: 0 0 75%;
  }
}

.search-results-sidebar {
  border-top: 1px solid rgba(120, 101, 229, 1);
  flex: 1 0 auto;
  margin-bottom: 20px;
  padding: 0;
}

@media (min-width: 1024px) {
  .search-results-sidebar {
    border: 0;
    flex: 0 0 20%;
    height: auto;
  }
}

.search-results-sidebar .sidenav-item:hover, .search-results-sidebar .sidenav-item.current {
  background-color: rgba(120, 101, 229, 1);
  color: #fff;
  text-decoration: none;
}

.search-results-sidebar .sidenav-subitem {
  unicode-bidi: embed;
}

.search-results-sidebar .collapsible-sidebar {
  margin-bottom: 30px;
}

.search-results-sidebar .collapsible-sidebar[aria-expanded="false"] .multibrand-filter-list {
  display: none;
}

@media (min-width: 1024px) {
  .search-results-sidebar .collapsible-sidebar[aria-expanded="false"] .multibrand-filter-list {
    display: block;
  }
}

.search-results-sidebar .multibrand-filter-list--collapsed li:nth-child(1n + 6) {
  display: none;
}

/*
.search-results-sidebar .multibrand-filter-list .doc-count {
  color: #666;
}
*/

.search-results-sidebar .see-all-filters {
  background: none;
  border: none;
  cursor: pointer;
  display: block;
  padding: 10px;
  color: #333;
  font-weight: 600;
}

.search-results-sidebar .see-all-filters[aria-hidden="true"] {
  display: none;
}

.search-results-sidebar .see-all-filters:hover {
  text-decoration: underline;
}

.search-results-sidebar .see-all-filters::after {
  content: "expand_more";
  font-size: 18px;
  vertical-align: middle;
  margin-left: 2px;
}

.search-results-subheading {
  font-size: 18px;
  font-weight: 600;
}

.search-results-list {
  margin-bottom: 25px;
}

.search-results-list > li {
  border-bottom: 1px solid rgba(120, 101, 229, 1);
  padding: 20px 0;
}

.search-results-list > li:first-child {
  border-top: 1px solid rgba(120, 101, 229, 1);
}

.search-results-list > li h2 {
  margin-bottom: 5px;
  font-weight: 600;
  font-size: 1.2em;
}

.search-results-list > li h2 a {
  color: #333;
}

.search-results .meta-group {
  display: block;
  align-items: center;
  clear: both;
  color: #666;
}

@media (min-width: 1024px) {
  .search-results .meta-group {
    display: flex;
  }
}

.search-results .meta-group > li {
  display: block;
}

@media (min-width: 1024px) {
  .search-results .meta-group > li {
    display: inline;
  }
}

@media (min-width: 1024px) {
  .search-results .meta-group li:first-child {
    flex: 1;
  }
}

.search-results .meta-group .meta-data {
  color: inherit;
}

[dir="ltr"] .search-results .meta-group .meta-data:not(:last-child) {
  margin-right: 20px;
}

[dir="rtl"] .search-results .meta-group .meta-data:not(:last-child) {
  margin-left: 20px;
}

.search-results .meta-group .meta-data::after {
  content: none;
}

.search-results-description {
  margin-top: 10px;
  word-break: break-word;
}

.search-result-title {
  font-size: 16px;
  display: inline-block;
}

[dir="ltr"] .search-result-icons {
  float: right;
}

[dir="rtl"] .search-result-icons {
  float: left;
}

.search-result-votes, .search-result-meta-count {
  color: #333;
  display: inline-block;
  font-size: 13px;
  padding: 4px 5px;
  position: relative;
}

.search-result-votes-icon, .search-result-meta-count-icon {
  color: rgba(120, 101, 229, 1);
  vertical-align: middle;
  width: 13px;
  height: 13px;
}

[dir="ltr"] .search-result-votes, [dir="ltr"] .search-result-meta-count {
  margin-left: 5px;
}

[dir="ltr"] .search-result-votes::before, [dir="ltr"] .search-result-meta-count::before {
  margin-right: 3px;
}

[dir="rtl"] .search-result-votes, [dir="rtl"] .search-result-meta-count {
  margin-right: 5px;
}

[dir="rtl"] .search-result-votes::before, [dir="rtl"] .search-result-meta-count::before {
  margin-left: 3px;
}

.search-result .meta-group {
  align-items: center;
}

.search-result-breadcrumbs {
  margin: 0;
}

@media (min-width: 1024px) {
  .search-result-breadcrumbs {
    display: table-row;
  }
}

@media (min-width: 1024px) {
  .search-result-breadcrumbs li {
    display: table-cell;
  }
}

.search-result-breadcrumbs li, .search-result-breadcrumbs li a, .search-result-breadcrumbs li a:visited {
  color: inherit;
}

/* Near-identical article titles repeat across products, so the path is what tells two
   results apart. Every step is set as a chip: a distinct SHAPE is what makes it findable
   when skimming - merely darkening the text made it compete with the title above it.
   Uses the theme's own button colour pair, so contrast holds for any brand colour. */

/* First path step is the Help Center root - identical on every result, pure noise. */
.search-result-breadcrumbs li:first-child {
  display: none;
}

/* Chips already read as separate blocks; the global ">" would sit between two fills. */
.search-result-breadcrumbs li + li::before {
  content: none;
}

.search-result-breadcrumbs li a,
.search-result-breadcrumbs li a:visited {
  display: inline-block;
  background: transparent;
  color: rgba(120, 101, 229, 1);
  border: 1px solid rgba(120, 101, 229, 1);
  font-weight: 600;
  font-size: 12px;
  line-height: 1.5;
  padding: 0 7px;
  margin-right: 5px;
  border-radius: 3px;
  text-decoration: none;
  vertical-align: baseline;
}

.search-result-breadcrumbs li a:hover,
.search-result-breadcrumbs li a:focus {
  background: rgba(120, 101, 229, 1);
  color: rgba(255, 255, 255, 1);
  text-decoration: none;
}

/* By default use bold instead of italic to highlight */
.search-results-description em {
  background: #fff3ca;
  font-style: normal;
  font-weight: bold;
}

/* Add a yellow background for Chinese */
html[lang|="zh"] .search-results-description em {
  font-style: normal;
  background: yellow;
}

/***** Notifications *****/
.notification {
  border: 1px solid;
  display: table;
  font-family: 'Instrument Sans', sans-serif;
  font-size: 12px;
  padding: 13px 15px;
  transition: height .2s;
  width: 100%;
  color: #555;
}

.notification a {
  color: #158ec2;
}

.notification-inner {
  margin: 0 auto;
  padding: 0 20px;
  max-width: 980px;
}

.notification-icon, .notification-text, .notification-dismiss {
  display: table-cell;
  vertical-align: middle;
}

.notification-text {
  padding: 0 15px;
  width: 100%;
}

.notification + .notification {
  margin-bottom: -1px;
  position: relative;
  top: -1px;
}

/* Error */
.notification-error {
  background: #ffeded;
  border-color: #f7cbcb;
}

.notification-error .notification-icon::before, .notification-error .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23555555'/%3E%3C/svg%3E");
}

/* Notice */
.notification-notice {
  background: #dbf3ff;
  border-color: #b5e0f5;
}

.notification-notice .notification-icon::before, .notification-notice .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23555555'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' d='M3.5 6l2 2L9 4.5'/%3E%3Ccircle cx='6' cy='6' r='5.5'/%3E%3C/g%3E%3C/svg%3E");
}

/* Alert / Lock */
.notification-alert {
  color: #ad5e18;
  background: #fff8ed;
  border-color: #fcdba9;
}

.notification-alert .notification-icon::before, .notification-alert .notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%23ad5e18' stroke-linecap='round' d='M5.06 1.27l-4.5 8.5c-.18.33.06.73.44.73h9c.38 0 .62-.4.44-.73l-4.5-8.5a.494.494 0 00-.88 0zM5.5 4v2'/%3E%3Ccircle cx='5.5' cy='8' r='.8' fill='%23ad5e18'/%3E%3C/svg%3E");
}

.notification-icon::before, .notification-inline.notification-error::before {
  background-size: cover;
  content: "";
  display: inline-block;
  height: 14px;
  width: 14px;
  vertical-align: middle;
}

/* Dismiss button */
.notification-dismiss, a.notification-dismiss {
  color: #555;
  cursor: pointer;
  opacity: .6;
  transition: opacity 100ms ease;
  text-decoration: none !important;
}

.notification-dismiss:hover {
  opacity: 1;
}

/* Inline notifications */
.notification-inline {
  border-radius: 4px;
  line-height: 14px;
  margin-top: 5px;
  padding: 5px;
  position: relative;
  text-align: left;
  vertical-align: middle;
}

[dir="rtl"] .notification-inline {
  text-align: right;
}

.notification-inline[aria-hidden="true"] {
  display: none;
}

.notification-inline.notification-error::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' focusable='false' viewBox='0 0 12 12'%3E%3Cg fill='none' stroke='%23e35b66'%3E%3Ccircle cx='5.5' cy='6.5' r='5'/%3E%3Cpath stroke-linecap='round' d='M5.5 3.5v3'/%3E%3C/g%3E%3Ccircle cx='5.5' cy='9' r='1' fill='%23e35b66'/%3E%3C/svg%3E");
  margin: -2px 5px 0 0;
}

[dir="rtl"] .notification-inline.notification-error::before {
  margin: 0 0 0 5px;
}

.notification-inline.notification-error {
  background-color: #fff0f1;
  border: 1px solid #e35b66;
  color: #cc3340;
}

.notification-inline.notification-large {
  padding: 13px 15px;
  margin-bottom: 25px;
}

.notification-left-aligned {
  text-align: left;
  padding-left: 0;
}

html[dir="rtl"] .notification-left-aligned {
  text-align: right;
  padding-left: auto;
  padding-right: 0;
}

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-toggle {
  cursor: pointer;
  background: none;
  border: 0;
  display: inline-block;
  padding: 0;
  text-align: initial;
  vertical-align: middle;
}

.dropdown-toggle:hover,
.dropdown-toggle:focus {
  outline: none;
  text-decoration: none;
}

.dropdown-toggle > * {
  display: inline-block;
}

.dropdown-menu {
  background: #fff;
  border: 1px solid #fff;
  border-radius: 3px;
  box-shadow: 0 1px 5px rgba(0, 0, 0, 0.1);
  display: none;
  font-size: 14px;
  font-style: normal;
  font-weight: normal;
  left: 0;
  margin-top: 10px;
  min-width: 170px;
  padding: 10px 0;
  position: absolute;
  text-align: left;
  z-index: 1000;
}

.dropdown-toggle[aria-expanded=true] + .dropdown-menu {
  display: block;
}

[dir="rtl"] .dropdown-menu {
  text-align: right;
}

.dropdown-menu[aria-expanded="true"] {
  display: block;
}

.dropdown-menu [role="separator"] {
  border-bottom: 1px solid #d8d8d8;
  color: #969696;
  display: block;
  font-weight: normal;
  font-size: 11px;
  padding: 5px 0;
  margin: 5px 20px 10px 20px;
}

.dropdown-menu [role="menuitem"] {
  color: #333;
  cursor: pointer;
  display: block;
  padding: 7px 40px 7px 20px;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
  -webkit-appearance: none;
  text-align: start;
  line-height: inherit;
  width: 100%;
}

[dir="rtl"] .dropdown-menu [role="menuitem"] {
  padding: 7px 20px 7px 40px;
}

.dropdown-menu [role="menuitem"]:hover, .dropdown-menu [role="menuitem"]:focus {
  background: #f3f3f3;
  text-decoration: none;
  color: #333;
}

.dropdown-menu [role="menuitem"][aria-selected="true"] {
  cursor: default;
}

.dropdown-menu [role="menuitem"][aria-selected="true"]::after {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='currentColor' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M1 7l3 3 7-7'%3E%3C/path%3E%3C/svg%3E");
  display: inline-block;
  height: 12px;
  margin-left: 10px;
  width: 12px;
}

[dir="rtl"] .dropdown-menu [role="menuitem"][aria-selected="true"]::after {
  margin-left: 0;
  margin-right: 10px;
  float: left;
}

.dropdown-menu [role="menuitem"][hidden], .dropdown-menu [role="menuitem"][aria-hidden="true"] {
  display: none !important;
}

.dropdown-menu-end {
  left: auto;
  right: 0;
}

.dropdown-menu-top {
  bottom: 100%;
  margin-bottom: 1px;
}

[dir="rtl"] .dropdown-menu {
  left: auto;
  right: 0;
  text-align: right;
}

[dir="rtl"] .dropdown-menu-end {
  left: 0;
  right: auto;
}

.dropdown-chevron-icon {
  vertical-align: middle;
}
.cd-primary-nav-trigger .cd-menu-text {
  color: rgba(213, 244, 67, 1);
  display: none;
}

span.cd-menu-icon {
  position: relative;
  top: -3px;
  margin-left: 23px;
}

span.ml-5 {
  margin-left: 5px;
}

.cd-primary-nav-trigger .cd-menu-icon {
    display: inline-block;
    right: auto;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    width: 18px;
    height: 2px;
    background-color: rgba(213, 244, 67, 1);
    -webkit-transition: background-color 0.3s;
    -moz-transition: background-color 0.3s;
    transition: background-color 0.3s;
}

.cd-primary-nav-trigger .cd-menu-icon::before,
.cd-primary-nav-trigger .cd-menu-icon:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    background-color: rgba(213, 244, 67, 1);
    right: 0;
    -webkit-transition: -webkit-transform .3s, top .3s, background-color 0s;
    -moz-transition: -moz-transform .3s, top .3s, background-color 0s;
    transition: transform .3s, top .3s, background-color 0s;
}

.cd-primary-nav-trigger .cd-menu-icon::before {
    top: -5px;
}

.cd-primary-nav-trigger .cd-menu-icon::after {
    top: 5px;
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked {
    background-color: rgba(255, 255, 255, 0);
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before,
.cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
    background-color: rgba(213, 244, 67, 1);
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked::before {
    top: 0;
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    transform: rotate(135deg);
}

.cd-primary-nav-trigger .cd-menu-icon.is-clicked::after {
    top: 0;
    -webkit-transform: rotate(225deg);
    -moz-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    -o-transform: rotate(225deg);
    transform: rotate(225deg);
}

@media only screen and (min-width: 768px) {
    .cd-primary-nav-trigger {
        width: 100px;
        background-color: transparent;
    }
    .cd-primary-nav-trigger .cd-menu-text {
        display: inline-block;
    }
    .cd-primary-nav-trigger .cd-menu-icon {
        left: auto;
        right: 1em;
        -webkit-transform: translateX(0) translateY(-50%);
        -moz-transform: translateX(0) translateY(-50%);
        -ms-transform: translateX(0) translateY(-50%);
        -o-transform: translateX(0) translateY(-50%);
        transform: translateX(0) translateY(-50%);
    }
}
.cd-primary-nav {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    background: rgba(0, 0, 0, 0.90);
    z-index: 2;
    text-align: center;
    padding: 50px 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    /* this fixes the buggy scrolling on webkit browsers - mobile devices only - when overflow property is applied */
    -webkit-overflow-scrolling: touch;
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition-property: -webkit-transform;
    -moz-transition-property: -moz-transform;
    transition-property: transform;
    -webkit-transition-duration: 0.4s;
    -moz-transition-duration: 0.4s;
    transition-duration: 0.4s;
}
.cd-primary-nav li {
    font-size: 22px;
    font-size: 1.375rem;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: .2em 0;
}
.cd-primary-nav a {
    display: block;
    padding: .2em 1em;
    -webkit-transition: background 0.2s;
    -moz-transition: background 0.2s;
    transition: background 0.2s;
    color: rgba(255, 255, 255, 1);
}
.cd-primary-nav a:focus,
.cd-primary-nav a:active {
    color: #fff;
}
.cd-primary-nav a:hover {
    color: #fff;
    background: rgba(120, 101, 229, 1);
    text-decoration: none;
}
.cd-primary-nav.is-visible {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -ms-transform: translateY(0);
    -o-transform: translateY(0);
    transform: translateY(0);
}
.visible_xs {
    display: block;
}
@media only screen and (min-width: 768px) {
    .cd-primary-nav {
        padding: 80px 0;
    }
    .visible_xs {
        display: none;
    }
}
@media only screen and (min-width: 1170px) {
    .cd-primary-nav li {
        font-size: 30px;
        font-size: 1.875rem;
    }
    .cd-primary-nav .cd-label {
        font-size: 16px;
        font-size: 1rem;
    }
}
@media (max-width: 768px) {
  .xs_hide {
    display: none;
  }
  .categories {
    position: relative;
    top: 25px;
    margin-bottom: 0;
  }
  .hero {
    height: 300px;
  }
  .hero-inner {
    transform: translateY(-50%);
  }
  .categories .blocks-item {
    margin: 0 0 50px;
  }
}
@media (max-width: 600px) {
  .community-image .btn {
    display: block;
    margin-bottom: 5px;
  }
}
@media (max-width: 464px) {
  .hero-inner .search-icon {
    top: 65%;
  }
  .nav-wrapper .language-selector {
    display: none;
  }
}

/* =========================================== */
/*  Community Badges
/* =========================================== */

/* Styles labels used next to the authors of article comments, community posts, and community comments */
.community-badge-title {
  background-color: #04444d;
  border-radius: 4px;
  color: #fff;
  font-size: 12px;
  font-weight: 600;
  padding: 0px 8px;
  vertical-align: top;
  white-space: nowrap;
  display: inline-flex;
  line-height: 18px;
  vertical-align: middle;
}

.profile-info .community-badge-title {
  padding: 2px 8px;
  line-height: 20px;
  margin-left: 5px;
}

.community-badge-container-achievements {
  display: flex;
}

.community-badge-container-achievements > .community-badge-titles {
  margin-left: calc(28px - 0.5em);
}

[dir="rtl"] .community-badge-container-achievements > .community-badge-titles {
  margin-right: calc(28px - 0.5em);
}

.community-name-and-title-badges {
  display: flex;
  flex-wrap: wrap;
}

.community-badge {
  margin: 2px;
}

.community-badge-achievements {
  display: block;
  height: 16px;
  white-space: nowrap;
  width: 16px;
}

.profile-info .community-badge-achievements {
  height: 40px;
  width: 40px;
}

.community-title-badges {
  flex-basis: 100%;
  margin-top: 15px;
}

.community-badge-achievements-rest {
  font-size: 12px;
  font-weight: 600;
  line-height: 20px;
  text-align: center;
  vertical-align: top;
}

.community-badge-achievements img {
  width: 100%;
  height: 100%;
}

.community-badge-titles img {
  width: 20px;
  height: 20px;
}

.profile-info .community-badge-achievements-rest {
  line-height: 40px;
  font-size: 20px;
}

.split-button {
  display: flex;
}

.split-button button {
  background: rgba(120, 101, 229, 1);
  border: 0;
  color: #FFFFFF;
  height: 32px;
  line-height: 16px;
  outline-color: rgba(120, 101, 229, 1);
}

.split-button button:not(:only-child):last-child {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  min-width: 26px;
  max-width: 26px;
  padding: 0;
}

[dir="rtl"] .split-button button:not(:only-child):first-child {
  border-left: 1px solid rgba(255, 255, 255, 1);
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

[dir="ltr"] .split-button button:not(:only-child):first-child {
  border-right: 1px solid rgba(255, 255, 255, 1);
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

[dir="rtl"] .split-button button:not(:only-child):last-child {
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

[dir="ltr"] .split-button button:not(:only-child):last-child {
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

.profile-badges-items {
  margin-top: 25px;
}

.profile-badges-item {
  border-top: 1px solid rgba(120, 101, 229, 1);
  display: flex;
  flex: 1;
  flex-direction: row;
  justify-content: flex-start;
  padding: 27px 12px;
}

.profile-badges-item > div {
  padding-right: 12px;
  padding-left: 12px;
}

.profile-badges-item-image {
  height: 40px;
  width: 40px;
  margin-right: 12px;
}

.profile-badges-item-image img {
  max-height: 40px;
}

.profile-section .profile-badges-item-image img {
  background: #efefef;
  border-radius: 40px;
  width: 40px;
  height: 40px;
}

[dir="rtl"] .profile-badges-item-image {
  margin-left: 12px;
  margin-right: 0;
}

.profile-badges-item-title, .profile-badges-item-metadata-title {
  font-size: 15px;
  margin-bottom: 10px;
}

.profile-badges-item-title {
  font-weight: 600;
}

.profile-badges-item-description, .profile-badges-item-metadata-description {
  color: #333;
  font-size: 13px;
  margin: 0;
}

.profile-badges-item-metadata {
  margin-left: auto;
  text-align: right;
}

[dir="rtl"] .profile-badges-item-metadata {
  margin-left: 0;
  margin-right: auto;
  text-align: left;
}

.community-badge[aria-label="Community team"] {
  background: #eaa40a;
}

.community-badge[aria-label="Community moderator"],
.community-badge[aria-label="Community manager"] {
  background: #11aa7b;
}

.community-badge[aria-label="Idea generator"],
.community-badge[aria-label="Good karma"] {
  background: #4a8cf1;
}

.community-badge[aria-label="Great answers"] {
  background: #fc585b;
}

.b-600 {
  font-weight: 600;
}

.mb-40 {
  margin-bottom: 40px;
}

/* =========================================== */
/*  Shortcodes
/* =========================================== */

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}

.alert-info {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}

.alert-success {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6;
}

.alert-warning {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc;
}

.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

.alert {
    border-width: 2px;
}

.__with_fa {
    border: 2px solid rgba(245, 166, 35, 1);
    background: rgba(245, 166, 35, 0.66);
    position: relative;
    font-size: 1.2em;
    line-height: 1.4;
    padding: 30px 15px 15px 15px;
}

.__with_fa .fa {
    position: absolute;
    top: 0;
    background: #fff;
    margin-top: -25px;
    border-radius: 100%;
    border: 2px solid rgba(245, 166, 35, 1);
    left: 15px;
    height: 45px;
    width: 45px;
    display: block;
    text-align: center;
    line-height: 45px;
}

.__with_fa .fa:before {
    margin-left: 5px;
}

.__with_fa {
    margin-top: 40px;
}

.alert-download {
    border: 2px solid #9adeec;
    background: #bce8f1;
}

.alert-quote {
    border: 2px solid rgba(103, 77, 68, 0.26);
    background: rgba(121, 85, 72, 0.26);
}

.alert-pdf {
    border: 2px solid rgba(229, 65, 94, 1);
    background: rgb(229, 65, 94);
    color: #fff;
}

.alert-download .fa {
    border: 2px solid #9adeec;
}

.alert-quote .fa {
    border: 2px solid rgb(186, 174, 168);
}

.alert-pdf .fa {
    border: 2px solid rgba(229, 65, 94, 1);
    color: rgba(229, 65, 94, 1);
}

.accordion {
   margin-bottom: 30px;
}

.colored_accordion .accordion_title {
   background: #ddd;
   border-color: #ddd;
}

.colored_accordion ._active {
   background: #ffb110;
   border-color: #ffb110;
   color: #fff;
}

.default_accordion ._active {
   background: rgba(120, 101, 229, 1);
   border-color: rgba(120, 101, 229, 1);
   color: #ffffff;
}

.accordion_content {
   display: none;
   padding: 10px;
}

/* Surfaces rendered by the JS bundles (Zendesk Garden): the request form, the request
   list and the service catalog. Garden injects its styles at runtime, i.e. AFTER this
   stylesheet, so these rules are prefixed with `body` to win on specificity.
   Selected via data-garden-id, which is part of Garden's public markup contract and
   survives bundle updates - unlike the generated class name `.blyUrs` that used to sit
   here and had silently stopped matching anything. Never hardcode those hashes. */
body .table,
body [data-garden-id="tables.table"] {
   background: #f2f1fd;
}

/* Dropdown surfaces float above page content and must never be see-through. */
body [data-garden-id="dropdowns.menu"],
body [data-garden-id="dropdowns.menu.floating"],
body [data-garden-id="dropdowns.combobox.listbox"],
body [data-garden-id="dropdowns.combobox.floating"] {
   background-color: #f2f1fd;
}

/* Form controls share that same surface. Plain #fff reads as a hard cut-out against a
   tinted page background - the jar is the HUE, not the brightness. A near-white tint of
   the brand hue stays in the same colour family as the page while still sitting a touch
   lighter, so controls keep reading as raised. Derived from rgba(120, 101, 229, 1) so it follows
   whatever brand colour is configured. */
input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
textarea,
select,
.hbs-form select,
.search select,
.form .suggestion-list .searchbox,
body [data-garden-id="forms.input"],
body [data-garden-id="forms.faux_input"],
body [data-garden-id="forms.media_input"],
body [data-garden-id="dropdowns.combobox.input"],
body [data-garden-id="dropdowns.combobox.trigger"] {
   background-color: #f2f1fd;
}

/* The hero search sits on the hero image/colour, not on the page ground - it keeps its
   own white field so it stays legible there. */
.hero .search input[type="search"] {
   background-color: #fff;
}

/* The "Filter" dialog on the request list is the one Garden surface that paints itself
   with the theme's own background setting. StyledModal takes background.raised, and the
   Zendesk theme bridge in shared-bundle.js maps background.raised (as well as default,
   recessed and subtle) onto settings.background_color. That setting is a 20% alpha value
   here, so the modal renders translucent: the dimmed page and the request table show
   straight through it and heading, labels and buttons end up on a moving, violet-washed
   ground instead of a surface of their own.
   Same treatment as the surfaces above, and for the same reason - selected via
   data-garden-id because that is part of Garden's public markup contract and survives
   bundle updates, and prefixed with `body` because Garden injects its styles at runtime,
   i.e. after this stylesheet, so a bare attribute selector would lose on order.
   Header, body and footer are transparent in Garden's own CSS and would inherit the fix
   from the modal alone; they are listed anyway so a future bundle cannot quietly hand one
   of them background.raised and make it see-through again. */
body [data-garden-id="modals.modal"],
body [data-garden-id="modals.header"],
body [data-garden-id="modals.body"],
body [data-garden-id="modals.footer"] {
   background-color: #f2f1fd;
}

/* Garden draws the modal outline and the header/footer separators from border.default,
   which resolves to grey.300 and lands at 1.23:1 against the tinted surface - visually no
   separator at all. rgba(120, 101, 229, 1) is what every other bordered surface in this theme uses
   and reaches 3.92:1, above the 3:1 that WCAG 1.4.11 asks for non-text UI. */
body [data-garden-id="modals.modal"] {
   border-color: rgba(120, 101, 229, 1);
}

body [data-garden-id="modals.header"] {
   border-bottom-color: rgba(120, 101, 229, 1);
}

body [data-garden-id="modals.footer"] {
   border-top-color: rgba(120, 101, 229, 1);
}

/* The backdrop is deliberately left alone. Garden derives it from neutralHue, not
   primaryHue, so it dims the page without carrying the brand tint into the dialog, and
   once the modal above is opaque it no longer shows through at all. Pinning a colour here
   would only freeze Garden's neutral shade for no gain. */

.table > thead > tr > th {
   color: #333;
   font-weight: 500;
   padding: 14px;
}

.table>thead>tr>th {
   border-bottom: 2px solid rgba(120, 101, 229, 1);
}

.table > tbody > tr > td {
   border-top: 1px solid rgba(120, 101, 229, 1);
   padding: 14px;
   font-size: 0.9em;
}

.table.header-color>thead>tr>th {
   border-color: #444;
   background: #444;
   color: #fff;
   padding: 10px;
}

.dark-table {
   background: #444;
   color: #fff;
}
.dark-table > thead > tr > th {
   border-bottom: 2px solid #fff;
}
.dark-table > tbody > tr > td {
   background: #333;
   border-color: #fff;
}
.dark-table > thead > tr > th {
   color: #fff;
}
.colored-list ul,
.colored-list ol {
   margin: 15px 0 0 0px;
}
.colored-list {
    list-style-type: none;
    padding: 0;
    counter-reset: li-counter;
}
.colored-list > li {
    position: relative;
    margin-bottom: 15px !important;
    padding-left: 35px;
    min-height: 0;

}
.colored-list > li:before {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 12px;
    color: #fff;
    content: counter(li-counter);
    counter-increment: li-counter;
    background-color: #276FD0;
    border-radius: 100%;
    height: 25px;
    width: 25px;
    line-height: 25px;
    text-align: center;
}
.list-black > li:before {
   background-color: #a59898;
}
.check-list-bullet li {
   list-style-type: none;
   position: relative;
   padding-left: 30px;
   margin-bottom: 15px !important;
}
.check-list-bullet li:before {
    content: "check_circle";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 25px;
    color: #276FD0;
    margin-top: -6px;
}

.article-body pre {
    margin-top: 15px;
}

@media (max-width: 550px) {
	.user-info span {
		display: none;
	}
  .article-subscribe {
    width: 100%;
  }
  .profile-header .basic-info .name {
    line-height: inherit;
  }
  body .recent-activity-item-meta,
  body .recent-activity-item > h3 {
    margin: 0;
  }
}

@media (max-width: 768px) {
	.article-relatives .recent-articles {
		margin-bottom: 10px;
	}
  .article-sidebar {
    margin-bottom: 0;
  }
  .cd-primary-nav-trigger {
    padding-right: 0 !important;
  }
  .split-button {
    width: 100%;
  }
  .profile-stats-activity {
    padding-top: 10px;
  }
  .profile-stats-counters {
    padding-bottom: 10px;
  }
}

.ck.ck-button:focus-visible, .ck.ck-content.ck-editor__editable.ck-editor__editable_inline.ck-focused,
.ck.ck-content.ck-editor__editable.ck-focused, .ck.ck-toolbar:focus-visible {
  box-shadow: none !important;
  outline-offset: 0 !important;
}

body .note--message,
body .warning--message,
body .quote--message,
body .support--message {
  padding: 30px 15px 15px 15px;
  font-size: 16px !important;
  position: relative;
  margin-top: 40px;
  margin-bottom: 20px;
  border-radius: 2px;
}

body .note--message::before,
body .warning--message::before,
body .quote--message::before,
body .support--message::before {
  position: absolute;
  top: 0;
  background: #fff;
  margin-top: -25px;
  border-radius: 100%;
  left: 15px;
  height: 45px;
  width: 45px;
  line-height: 45px;
  text-align: center;
  font-size: 23px;
}

[dir="rtl"] body .note--message::before,
[dir="rtl"] body .warning--message::before,
[dir="rtl"] body .quote--message::before,
[dir="rtl"] body .support--message::before {
  left: inherit;
  right: 15px;
}

body .note--message::before {
  content: "edit";
}

body .warning--message::before {
  content: "warning";
}

body .quote--message::before {
  content: "format_quote";
}

body .support--message::before {
  content: "support_agent";
}

body .note--message {
  background: #bce8f1;
  border: 2px solid #68cbdf;
}

body .support--message {
  background: #ebe8fb;
  border: 2px solid #5239de;
}

body .note--message::before {
  border: 2px solid #68cbdf;
}

body .support--message::before {
  border: 2px solid #5239de;
}

body .warning--message {
  background: #e5415e;
  border: 2px solid #e5415e;
  color: #fff;
}

body .warning--message::before {
  border: 2px solid #e5415e;
  color: #000;
}

body .quote--message {
  background: #d5ccc9;
  border: 2px solid #a89690;
}

body .quote--message::before {
  border: 2px solid #a89690;
}

body .check--list {
  margin-left: 30px;
}

body .check--list li,
body .number--list li,
#service-catalog-item ol li,
#service-catalog-item ul li {
  position: relative;
  list-style-type: none;
}

body .number--list li,
#service-catalog-item ol li,
#service-catalog-item ul li {
  padding-left: 35px;
}

body .check--list li:before,
#service-catalog-item ul > li:before {
  content: "check_circle";
  position: absolute;
  top: 0;
  left: -30px;
  font-size: 22px;
  color: rgba(120, 101, 229, 1);
  margin-top: -4px;
}

#service-catalog-item ul > li:before {
  left: 0;
}

[dir="rtl"] body .check--list li:before {
  left: inherit;
  right: -30px;
}

body .number--list,
#service-catalog-item ol {
  list-style-type: none;
  padding: 0;
  counter-reset: li-counter;
}

body .number--list > li:before,
#service-catalog-item ol > li:before {
  position: absolute;
  top: 0;
  left: 0;
  font-size: 12px;
  color: #fff;
  content: counter(li-counter);
  counter-increment: li-counter;
  background-color: rgba(120, 101, 229, 1);
  border-radius: 100%;
  height: 25px;
  width: 25px;
  line-height: 25px;
  text-align: center;
  margin-top: -1px;
}

[dir="rtl"] body .number--list > li:before {
  left: inherit;
  right: -35px;
}

body .accordion_title {
  background: #ffffff;
  border: 2px solid #dddddd;
  color: rgba(0, 0, 0, 1);
  cursor: pointer;
  padding: 15px 45px 15px 15px;
  margin-bottom: 5px;
  position: relative;
  border-radius: 2px;
}

[dir="rtl"] body .accordion_title {
  padding: 15px 15px 15px 45px;
}

body .accordion_content {
  display: none;
  padding: 10px;
}

body .accordion_title::after {
  content: "chevron_right";
  position: absolute;
  top: 50%;
  right: 15px;
  font-size: 16px;
  margin-top: -12px;
  transition: all 0.2s ease-in;
}

[dir="rtl"] body .accordion_title::after {
  right: inherit;
  left: 15px;
  transform: rotate(180deg);
}

body .article-body .accordion_title._active::after,
body .article-body .accordion_title.open::after {
  transform: rotate(90deg);
}

body .accordion_title.open {
  background: rgba(120, 101, 229, 1);
  border: 2px solid rgba(120, 101, 229, 1);
  color: #fff;
}

.tabs {
  width: 100%;
  background-color: rgba(120, 101, 229, 1);
  border-radius: 5px;
}

ul#tabs-nav {
  list-style: none;
  margin: 0;
  padding: 5px;
  overflow: auto;
}

ul#tabs-nav > li {
  float: left;
  font-weight: 600;
  margin-right: 2px;
  margin-bottom: 0;
  padding: 8px 10px;
  border-radius: 5px;
  cursor: pointer;
}

[dir="rtl"] ul#tabs-nav > li {
  float: right;
}

ul#tabs-nav > li:hover,
ul#tabs-nav > li.active {
  background-color: #3921c3;
}

#tabs-nav > li > a {
  text-decoration: none;
  color: #ffffff;
}

#tabs-content {
  background: #ffffff;
}

.tab-content {
  padding: 10px;
  border: 2px solid rgba(120, 101, 229, 1);
  background-color: #ffffff;
}

/***** Summary component *****/
zd-summary-block {
  background: #f3f6f6;
}
[dir=ltr] zd-summary-block {
  border-left-color: #859fa1;
}
[dir=rtl] zd-summary-block {
  border-right-color: #859fa1;
}

.service-catalog-description {
  display: flow-root;
}
.service-catalog-description a {
  color: #141414;
  text-decoration: underline;
}
.service-catalog-description a:visited {
  color: #333333;
}
.service-catalog-description a:hover, .service-catalog-description a:active, .service-catalog-description a:focus {
  color: #7865e5;
}
.service-catalog-description img {
  height: auto;
  max-width: 100%;
}
.service-catalog-description p > img.image-style-align-left {
  float: left;
  margin: 8px 20px 6px 0;
}
.service-catalog-description p > img.image-style-align-right {
  float: right;
  margin: 8px 0px 6px 20px;
}
.service-catalog-description p > img.image-style-block-align-right {
  margin-left: auto;
  margin-right: 0;
}
.service-catalog-description p > img.image-style-block-align-left {
  margin-left: 0;
  margin-right: auto;
}
.service-catalog-description figure.image {
  display: table;
  margin: 0 auto;
}
.service-catalog-description figure.image > img {
  display: block;
  width: 100%;
}
.service-catalog-description figure.image.image-style-align-left {
  float: left;
  margin: 8px 20px 6px 0;
}
.service-catalog-description figure.image.image-style-align-right {
  float: right;
  margin: 8px 0px 6px 20px;
}
.service-catalog-description figure.image.image-style-block-align-right {
  margin-left: auto;
  margin-right: 0;
}
.service-catalog-description figure.image.image-style-block-align-left {
  margin-left: 0;
  margin-right: auto;
}
.service-catalog-description figcaption {
  padding: 10px 0;
  font-size: 12px;
  text-align: center;
  background-color: rgba(101,79,225,0.2);
}
.service-catalog-description ul,
.service-catalog-description ol {
  padding-left: 20px;
  list-style-position: outside;
  margin: 20px 0 20px 20px;
}
[dir=rtl] .service-catalog-description ul,
[dir=rtl] .service-catalog-description ol {
  padding-right: 20px;
  padding-left: 0;
  margin-left: 0;
  margin-right: 20px;
}
.service-catalog-description ul > ul,
.service-catalog-description ol > ol,
.service-catalog-description ol > ul,
.service-catalog-description ul > ol,
.service-catalog-description li > ul,
.service-catalog-description li > ol {
  margin: 0;
}
.service-catalog-description ul {
  list-style-type: disc;
}
.service-catalog-description :not(pre) > code {
  background: rgba(109,88,227,0.2);
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 0 5px;
  margin: 0 2px;
}
.service-catalog-description pre {
  background: rgba(109,88,227,0.2);
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  white-space: pre;
  direction: ltr;
}
.service-catalog-description blockquote {
  border-left: 1px solid #ddd;
  color: #333;
  padding: 0 15px;
}
.service-catalog-main-content {
  display: flex;
  gap: 32px;
}
.service-catalog-list {
  width: 100%;
}
.service-catalog-breadcrumbs {
  display: flex;
  align-items: center;
  gap: 20px;
}
.service-catalog-sidebar div[role="button"] {
  margin-bottom: 3px;
}
.article-body {
  color: rgba(0, 0, 0, 1);
  font-family: 'Instrument Sans', sans-serif;
  font-size: 15px;
  line-height: 1.5;
}

.article-body p,
.article-body li,
.article-body td,
.article-body th {
  color: rgba(0, 0, 0, 1);
  font-family: 'Instrument Sans', sans-serif;
}

.article-body h1,
.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body h6 {
  color: rgba(120, 101, 229, 1);
  font-family: 'Instrument Sans', sans-serif;
  font-weight: 600;
}

/* ===========================================================================
   FIX: CC-Feld ("Anfrage einreichen") - doppelter Rahmen im Feld
   Angehaengt am Dateiende, bestehende Regeln bleiben unveraendert.
   ---------------------------------------------------------------------------
   URSACHE

   Das CC-Feld ist das einzige Feld des Formulars, bei dem Zendesk ein echtes
   <input> INNERHALB des Feldrahmens verschachtelt. Aufbau laut
   assets/new-request-form-bundle.js (Komponente "cc-field") und
   assets/shared-bundle.js (Garden 9.15.0):

     div[data-garden-id="forms.field"]
      └─ div[data-garden-id="forms.faux_input"]        <- der sichtbare Feldrahmen
          ├─ span  ... Tags der bereits gesetzten Adressen
          └─ div   position:relative
              ├─ div[data-garden-id="forms.faux_input"][aria-hidden="true"]
              │                                        <- unsichtbarer Breiten-
              │                                           messer, opacity:0,
              │                                           min-width:200px
              └─ input[data-garden-id="forms.input"]   <- das echte Eingabefeld,
                                                          position:absolute;
                                                          top:0; left:0

   Zendesk rendert dieses innere <input> mit isBare, also absichtlich ohne
   Rahmen und ohne Polsterung. Die Theme-Regel

       .form input { border: 1px solid rgba(120, 101, 229, 1) !important; ... }   (Z. 606)

   trifft aber JEDES <input> innerhalb von .form, und ihr !important schlaegt
   Gardens isBare-Styling. Das innere Feld erhaelt dadurch Rahmen,
   border-radius:3px und min-height:40px. Weil es position:absolute; left:0
   ist und seine Breite vom unsichtbaren Breitenmesser erbt (min-width:200px),
   erscheint es als zweiter, schmalerer Kasten am linken Rand des echten
   Feldrahmens - genau das gemeldete Symptom.

   Zwei weitere Regeln verstaerken den Effekt:
     - Z. 6003  input:not([type="checkbox"])...  { background-color:
                #f2f1fd; }
                faerbt den inneren Kasten als eigene Flaeche ein.
     - Z. 628   .form-field input:focus { border: 1px solid rgba(120, 101, 229, 1); }
                setzt den Fokusrahmen auf den inneren statt auf den aeusseren
                Kasten.

   Alle uebrigen Formularfelder sind ein einzelnes <input>, das selbst der
   Feldrahmen ist. Dort malt .form input genau den einen Rahmen, der hingehoert
   - deshalb faellt nur das CC-Feld auf.

   LOESUNG

   Angesetzt wird an der Verschachtelung selbst: ein forms.input, das Nachfahre
   eines forms.faux_input ist. Diese Kombination gibt es im Formular nur beim
   CC-Feld; einzeln stehende Felder und die Garden-MediaInputs
   (data-garden-id="forms.media_input") werden nicht getroffen.

   SPEZIFITAET
   Der Selector wiegt (0,4,2) und schlaegt damit sowohl .form input (0,1,1) als
   auch die Hintergrundregel aus Z. 6003 (0,4,1) sowie die zur Laufzeit
   nachgeladenen Garden-Klassen (0,1,0). !important steht deshalb nur auf
   border - der einzigen Eigenschaft, gegen die eine bestehende
   !important-Deklaration steht.

   VARIABLEN
   rgba(120, 101, 229, 1) und rgba(120, 101, 229, 1) wie im uebrigen Theme. border-radius:3px und
   min-height:40px sind bewusst dieselben Literale wie in .form input (Z. 606),
   damit das Feld exakt auf den uebrigen Feldern sitzt.
   =========================================================================== */

/* 1) Aeusserer Kasten = der Feldrahmen. Sieht aus wie jedes andere Formularfeld:
      gleicher Rahmen, gleicher Radius, gleiche Mindesthoehe, gleiche Flaeche.
      :not([aria-hidden="true"]) nimmt den unsichtbaren Breitenmesser aus, der
      dieselbe data-garden-id traegt - sonst wuerde er das Feld mit aufblaehen. */
body .form [data-garden-id="forms.field"] [data-garden-id="forms.faux_input"]:not([aria-hidden="true"]) {
  box-sizing: border-box;
  width: 100%;
  min-height: 40px;
  border: 1px solid rgba(120, 101, 229, 1);
  border-radius: 3px;
  background-color: #f2f1fd;
  /* Nur die vertikale Polsterung wird angefasst, damit das leere Feld exakt auf
     40px kommt. Die horizontale Polsterung von Garden entspricht bereits der
     der uebrigen Inputs und bleibt unangetastet. Mit gesetzten Adressen darf
     das Feld in die Hoehe wachsen - das ist bei Mehrfachauswahl gewollt. */
  padding-top: 1px;
  padding-bottom: 1px;
}

/* 2) Fokus. Der Fokusrahmen wandert vom inneren auf den aeusseren Kasten, sonst
      waere das Feld beim Tabben nicht mehr als aktiv erkennbar. :focus-within
      greift, weil das echte <input> ein Nachfahre ist. Der Ring liegt bei
      3,92:1 gegen die Feldflaeche (#F2F1FD) und damit ueber den 3:1, die
      WCAG 1.4.11 fuer Bedienelemente verlangt. */
body .form [data-garden-id="forms.field"] [data-garden-id="forms.faux_input"]:not([aria-hidden="true"]):focus-within {
  border-color: rgba(120, 101, 229, 1);
  box-shadow: 0 0 0 2px #d8d2f7;
}

/* 3) Inneres <input> wieder "bare" stellen - das ist der eigentliche Fix.
      border braucht !important, weil .form input (Z. 606) !important setzt.
      min-height:0 gibt Gardens height: var(--line-height) wieder frei, statt
      es auf 40px hochzuzwingen. background:transparent laesst die Flaeche des
      aeusseren Kastens durchscheinen; der eingegebene Text steht damit auf
      #F2F1FD und erreicht mit rgba(0, 0, 0, 1) (#000) 18,78:1. */
body .form [data-garden-id="forms.field"] [data-garden-id="forms.faux_input"] input[data-garden-id="forms.input"] {
  border: 0 !important;
  border-radius: 0;
  min-height: 0;
  padding: 0;
  background-color: transparent;
  box-shadow: none;
}