@charset "UTF-8";

/* =========================================================================
   DO NOT RUN A FORMATTER OR LINTER OVER THIS FILE.

   This stylesheet ships with three more closing braces than opening ones.
   That is deliberate and load-bearing. Correcting the imbalance restores five
   rules the browser has been silently discarding for years - including the
   entire max-width 1024px off-canvas mobile sidebar block - which is a visible
   layout change, not a lint fix.

   Prettier, stylelint, or an editor "Format Document" will balance those braces
   and change how the site renders. There is no lint error here to fix.

   There are four stray closers across three sites. No line numbers are given
   here on purpose: numbers written into this file rot the moment anything is
   inserted above them - this banner once carried some, and its own insertion
   made every one of them wrong by exactly its own length. For positions, run
   python3 scripts/validate_theme.py, which computes and prints them. The
   strays, identified by what they are:

     1. The closer left behind by the commented-out pre rule, whose opener
        sits inside the comment above it.
     2. The .sidebar-container rule whose opener was typo'd into a closer.
        That single character contributes two strays at one site: the typo'd
        closer itself, and the rule's real closer a few lines below it,
        orphaned because nothing opened. The browser discards the rule and
        the entire max-width 1024px off-canvas mobile sidebar block after it.
     3. The duplicate closer that corrupts the .sidebar-wrapper selector into
        an invalid one, so its scroll container never applies.

   Two different counts of this imbalance are both correct, and reconciling them
   by editing a brace would be the exact mistake this banner exists to prevent.
   Counting the raw text gives three; ignoring comments gives four. The
   difference is site 1: its opener sits inside the comment, so the raw scan
   sees an extra opener that offsets one stray. Strip comments - which is what
   a browser's parser effectively does - and that offset disappears, leaving
   four. scripts/validate_theme.py asserts the comment-ignoring figure, since
   that is what a browser sees, and says "outside comments" in its output to
   make clear which it means.

   scripts/validate_theme.py asserts the imbalance is unchanged, and
   scripts/package_theme.py refuses to build if it moves - but both only guard
   the packaging path. An editor save can still do the damage. See also
   .prettierignore and the project vault notes.

   Also note: this is not plain CSS. Zendesk interpolates dollar-prefixed
   setting identifiers from manifest.json, and dollar-prefixed asset names for
   asset URLs, at serve time - so a CSS parser reports those as errors too.
   (Written without the sigil on purpose: validate_theme.py scans this file for
   dollar-prefixed names and would read an example here as a real reference.)
   ========================================================================= */

@font-face {
    font-family: 'Proxima Nova';
    src: url(/hc/theming_assets/01KZF54KS6SVCTN5A0RVD2QHDV);
    src: local('Proxima Nova Semibold'), local('ProximaNova-Semibold'),
        url(/hc/theming_assets/01KZF54KM2KQP1TBHHNAZVTMP3) format('woff2'),
        url(/hc/theming_assets/01KZF54KNYE7HCQEEMH3ASDY84) format('woff'),
        url(/hc/theming_assets/01KZF54KV9TF80H49WCC7F472W) format('truetype'),
        url(/hc/theming_assets/01KZF54KP9FJH73DHTSCXM3D9M) format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url(/hc/theming_assets/01KZF54K6J0JX3PXZ8TD7NHV26);
    src: local('Proxima Nova Regular'), local('ProximaNova-Regular'),
        url(/hc/theming_assets/01KZF54HM85WNNV5HRV173XPEV) format('woff2'),
        url(/hc/theming_assets/01KZF54KGPC4W5DCV6NC60XVJY) format('woff'),
        url(/hc/theming_assets/01KZF54KTH1JNJWH3EYX21W9AB) format('truetype'),
        url(/hc/theming_assets/01KZF54KSEN6SBC1A7BJH7MYGG) format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Proxima Nova';
    src: url(/hc/theming_assets/01KZF54KP8QB0DBEWYBHHKYJRH);
    src: local('Proxima Nova Bold'), local('ProximaNova-Bold'),
        url(/hc/theming_assets/01KZF54KS5VKDQJ1JR2X2T04Z2) format('woff2'),
        url(/hc/theming_assets/01KZF54KS85DG61T9VAGVS9TDW) format('woff'),
        url(/hc/theming_assets/01KZF54KP660G7026PC6AG299T) format('truetype'),
        url(/hc/theming_assets/01KZF54KP0NAN4FD9HAT3D2K4P) format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


/* Reset the box-sizing */
*,
*:before,
*:after {
  box-sizing: border-box;
}

html,
body {
  letter-spacing: 0.25px;
  height: 100%;
}


/* Body reset */
html {
  font-size: 10px;
  -webkit-tap-highlight-color: transparent;
}

body {
  /* Brand typography, intentionally not a theme setting. Headings inherit this. */
  font-family: Proxima Nova, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(84, 88, 90, 1);
  background-color: rgba(255, 255, 255, 1);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

/* Reset fonts for relevant elements */
input:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  outline: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
}

button:focus:active:hover:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  outline: 0;
}

/* Links */
a {
  color: rgba(70, 103, 177, 1);
  text-decoration: none;
  transition: all 0.3s;
}

a:hover,
a:focus {
  color: rgba(5, 5, 5, 1);
  text-decoration: none;
}

figure {
  margin: 0;
}

img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
}

hr {
  display: block;
  height: 1px;
  padding: 0;
  margin: 2em 0;
  border: 0;
  border-top: 1px solid #eceeef;
}

/* Divider */
hr.dotted {
  border-top: 1px dotted rgba(158, 162, 162, 1);
}

hr.solid {
  border-top: 1px solid rgba(158, 162, 162, 1);
}

hr.dashed {
  border-top: 1px dashed rgba(158, 162, 162, 1);
}

hr.rounded {
  border-top: 3px solid rgba(158, 162, 162, 1);
  border-radius: 50%;
}

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/* Headings */
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
.article-body h1,
.article-body h2,
.article-body h3,
.article-body h4,
.article-body h5,
.article-body h6,
.article-body .h1,
.article-body .h2,
.article-body .h3,
.article-body .h4,
.article-body .h5,
.article-body .h6 {
  font-weight: 600;
  line-height: 2;
}

h2 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

h3 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

h4 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

h5 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

h6 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

.h1 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

.h2 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

.h3 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

.h4 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

.h5 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

.h6 {
  margin: calc((16px * 1.5) * 1.3) 0 calc((16px * 1.5) * 0.4) 0;
}

p {
  margin: calc((16px * 1.5) * 0.5) 0 calc((16px * 1.5) * 0.5) 0;
}

li p {
  margin: 0 0;
}

ul {
  /* list-style: none; */
  padding: 0px;
  margin: 0 0 calc((16px * 1.5) * 0.8);
}

h1, .h1 {
  font-size: 26px;
  color: #00A85D;
}

h2,
.h2,
.article-body .sidebar h2,
.article-body .sidebar .h2
{
  font-size: 24px;
    /*color: #00A85D;*/
  color: rgba(84, 88, 90, 1);
}


h3,
.h3,
.article-body .sidebar h3,
.article-body .sidebar .h3
{
  font-size: 20px;
  font-weight: 600;
  line-height: 24px;
}

h4, .h4,
.article-body .sidebar h4,
.article-body .sidebar .h4 
{
  font-size: 18px;
  line-height: 22px;
}
h5, .h5,
.article-body .sidebar h5,
.article-body .sidebar .h5 
{
  font-size: 16px;
  line-height: 20px;
}

h6, .h6,
.article-body .sidebar h5,
.article-body .sidebar .h5 
{
  font-size: 17px;
  line-height: 18px;
}

b,
strong {
  font-weight: 600;
}

.guilabel {
  font-weight: bold;
}

/***** Notes *****/

.callout {
   font-weight: bold;
   color: #F47119;
   font-size: 18px;
    padding: 10px;
    margin-left: 15px;
    margin-right: 15px;
    margin-top: 15px;
    margin-bottom: 15px;
}

.phrase {
  font-family:  Proxima Nova, sans-serif; 
  font-size: inherit;
  line-height: 1.5;
  color: inherit;
  background-color: rgba(255, 255, 255, 1);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}

.tip, .important { 
    border: 1px solid #CCC;
    padding: 10px;
    margin-bottom: 2rem;
}

.tip p:last-child, .tip p:last-child { 
  margin-bottom: 0px;
}

.tip {
  border-left: 2px solid #00A85D !important;
}

.important {
  border-left: 2px solid #F48A19 !important;
}

.caution {
 		margin: 0 0 2rem 0;
    padding: 10px;
  	border-left: 2px solid #DF2D2A !important;
  	border: 1px solid #CCC;
}

.caution .title {
  color: #DF2D2A;
}

.warning, .note, .important, .caution, .tip, .example {
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-top: 15px;
  padding-bottom: 15px;
}

.warning h3, .note h3, .important h3, .caution h3, .tip h3, .example h3,
.warning>p.admonition-label, .note>p.admonition-label, .important>p.admonition-label, .caution>p.admonition-label, .tip>p.admonition-label{
    margin-top:0px;
    margin-left: 0px;
    margin-right: 0px;

}

h3.title {
  font-weight: bold !important;
  font-size: 16px;
  line-height: 10px !important;
  color: rgba(84, 88, 90, 1);
}

.sidebar.accordion p.title {
  font-weight: bold !important;
  font-size: 18px;
  color: rgba(84, 88, 90, 1);
}

p.title {
  font-weight: bold;
  font-size: 24px;
  line-height: 20px;
  color: #00A85D;
}

.sidebar-title, p.title {
  font-weight: bold;
  font-size: 24px;
  line-height: 20px;
  color: #00A85D;
  
}

.sidebar .panel-body.expand p:first-child
{
  margin-top: 1.3em;
}

small,
.small {
  font-size: 80%;
  font-weight: normal;
  line-height: 1;
}

.footnote,
.small {
  font-size: 80%;
  font-weight: normal;
  line-height: 10px;
}

/***** Tables *****/
.table, .article-body table {
  width: 100%;
  table-layout: fixed;
  border-spacing: 0;
  border-collapse: collapse;
  margin: 0px 0px 40px !important;
}
.table td, .table th, .article-body table td, .article-body table th {
  vertical-align: top;
}

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

.table th, .article-body table th
.table th a {
  color: #868b8e;
  font-size: 13px;
  font-weight: 300;
  text-align: left !important;
  padding: 0px;
}

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

.table tr, .article-body table tr {
  border-bottom: 1px solid #ddd;
  //display: block;
  padding: 0px;
}

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

.table td, .article-body table td {
  //display: block;
  padding-top: 0px !important;
  padding-top: 0px !important;
  padding-left: 3px;
  padding-right: 3px;
}

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

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

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

/*Tables in dropdowns*/

.panel-body .table-responsive table
{
  table-layout: fixed;
}

/* Description Lists */
dl {
  margin-top: 0;
  margin-bottom: calc(16px * 1.5);
}

dt {
  margin-bottom: calc(16px * 1.5 / 2);
  line-height: 1.5;
}

dd {
  margin-bottom: calc(16px * 1.5 / 2);
  line-height: 1.5;
}

dt {
  font-weight: bold;
}

dd {
  margin-left: 0;
  /* Undo browser default */
}

.dl-horizontal:before,
.dl-horizontal:after {
  display: table;
  content: "";
}

.dl-horizontal:after {
  clear: both;
}

.dl-horizontal dt {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 768px) {
  .dl-horizontal dt {
    float: left;
    width: 30%;
    padding-right: 15px;
    clear: both;
  }
}

@media (min-width: 768px) {
  .dl-horizontal dd {
    float: right;
    width: 70%;
  }
}

/* Abbreviations and acronyms */
abbr[title] {
  cursor: help;
  border-bottom: 1px dotted #818a91;
}

abbr[data-original-title] {
  cursor: help;
  border-bottom: 1px dotted #818a91;
}

/* Blockquotes */
blockquote {
  padding: 40px 20px;
  margin: 0 0 calc(16px * 1.5);
  font-family:  Proxima Nova, sans-serif; 
  font-style: italic;
  color: rgba(84, 88, 90, 1);
  border-left: 5px solid rgba(158, 162, 162, 1);
}

/* Code */
code {
  padding: 0px !important;
  border-radius: 2px !important;
  font-family: monospace;
  font-size: 16px;
  line-height: 1.2 !important;
  height: 100% !important;
  padding: 0px 2px !important;
}

/*  Addresses */
address {
  margin-bottom: calc(16px * 1.5);
  font-style: normal;
  line-height: 1.5;
}

.clearfix:before,
.clearfix:after {
  display: table;
  content: "";
}

.clearfix:after {
  clear: both;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

.list-unstyled {
  padding-left: 0;
  list-style: none;
}

.hidden,
.hidden {
  display: none !important;
}

/* 
Normalize non-controls

Restyle and baseline non-control form elements. 
*/
fieldset:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  /*  
  Chrome and Firefox set a `min-width: min-content;` on fieldsets, 
  so we reset that to ensure it behaves more like a standard block element
  See https:github.com/twbs/bootstrap/issues/12359. 
  */
  min-width: 0;
  padding: 0;
  margin: 0;
  border: 0;
}

legend:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  padding: 0;
  margin-bottom: calc(16px * 1.5);
  font-size: calc(16px * 1.5);
  line-height: inherit;
  color: #373a3c;
  border: 0;
  border-bottom: 1px solid #e5e5e5;
}

label:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: inline-block;
  max-width: 100%;
  margin-bottom: calc(16px * 1.5 / 2);
  font-weight: 600;
}

/*pre {
  white-space: pre-line;*/
}

/* 
 Normalize form controls

 While most of our form styles require extra classes, some basic normalization
 is required to ensure optimum display with or without those classes to better
 address browser inconsistencies. 
*/
/*  Override content-box in Normalize (* isn't specific enough) */
input[type="search"] {
  box-sizing: border-box;
}

/*  Position radios and checkboxes better */
input[type="radio"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="checkbox"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  margin: 4px 0 0;
  margin-top: 1px \9;
  line-height: normal;
}

/*  Set the height of file controls to match text inputs */
input[type="file"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
}

/*  Make range inputs behave like textual form controls */
input[type="range"] {
  display: block;
  width: 100%;
}

/*  Make multiple select elements height not fixed */
select[multiple],
select[size] {
  height: auto;
}

/*  Focus for file, radio, and checkbox */
input[type="file"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="radio"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="checkbox"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

/*  Adjust output element */
output {
  display: block;
  padding-top: 7px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
}

/* Menu Separator */
.menuSeparator {
  width: 100%;
  height: 1px;
  background-color: rgba(6, 236, 225, 0.678);
}

/* 
 Common form controls

 Shared size and type resets for form controls. Apply `.form-control` to any
 of the following form controls:
 
*/
select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 1px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

option:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  background: #fff;
}

textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 1px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="text"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 1px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="password"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="datetime"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="week"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="number"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="email"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="url"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px 6px 35px;
  font-size: 16px;
  line-height: 1.5;
  color: rgba(84, 88, 90, 1);
  background-image: none;
  border: 1px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="search"]:active:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  border-color: red;
}

.searchbar-top input[type="search"] {
  color: rgba(42, 47, 69, 1);
  background-color: #fff;
  border: 1px solid rgba(169, 169, 169, 1);
  padding: 19px 0;
  padding-right: 5px;
  padding-left: 40px;
  transition: all 0.3s ease-out;
  border-radius: 5px;
}

[dir="rtl"] .searchbar-top input[type="search"] {
  padding-right: 50px;
}

input[type="tel"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

input[type="color"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 2px solid #eceeef;
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.nesty-input {
  display: block;
  width: 100%;
  height: auto;
  padding: 6px 12px;
  font-size: 16px;
  line-height: 1.5;
  color: #55595c;
  background-color: #fff;
  background-image: none;
  /*  Reset unusual Firefox-on-Android default style; see https:github.com/necolas/normalize.css/issues/214 */
  border: 1px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

/*  Customize the `:focus` state to imitate native WebKit styles. */
select:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
textarea:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="text"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="password"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="datetime"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="datetime-local"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="date"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="month"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="time"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="week"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="number"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="email"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="url"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="search"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="tel"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="color"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.nesty-input:focus {
  border: 1px solid;
  color: #55595c;
  background-color: #fff;
  border-color: rgba(5, 5, 5, 1);
  outline: 0;
  transition: all 0.3s;
  opacity: unset;
}

/*  Placeholder */
select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="text"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="password"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="datetime"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="week"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="number"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="email"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="url"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="tel"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
input[type="color"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-webkit-input-placeholder,
.nesty-input::-webkit-input-placeholder {
  color: #999;
  opacity: 1;
}

select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="text"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="password"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="datetime"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="week"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="number"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="email"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="url"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="tel"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
input[type="color"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-moz-placeholder,
.nesty-input::-moz-placeholder {
  color: #999;
  opacity: 1;
}

select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="text"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="password"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="datetime"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="week"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="number"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="email"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="url"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="tel"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
input[type="color"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)):-ms-input-placeholder,
.nesty-input:-ms-input-placeholder {
  color: #999;
  opacity: 1;
}

select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="text"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="password"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="datetime"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="week"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="number"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="email"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="url"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="tel"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
input[type="color"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::-ms-input-placeholder,
.nesty-input::-ms-input-placeholder {
  color: #999;
  opacity: 1;
}

select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="text"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="password"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="datetime"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="week"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="number"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="email"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="url"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="tel"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
input[type="color"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *))::placeholder,
.nesty-input::placeholder {
  color: #999;
  opacity: 1;
}

.searchbar-top input::-webkit-input-placeholder {
  /* Edge */
  color: #fff;
  opacity: 0.5;
}

.searchbar-top input:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: #fff;
  opacity: 0.5;
}

.searchbar-top input::placeholder {
  color: rgba(42, 47, 69, 1);
  opacity: 0.5;
}

.searchbar-top input:focus::-webkit-input-placeholder {
  /* Edge */
  color: rgba(42, 47, 69, 1);
  opacity: 1;
}

.searchbar-top input:focus:-ms-input-placeholder {
  /* Internet Explorer 10-11 */
  color: rgba(42, 47, 69, 1);
  opacity: 1;
}

.searchbar-top input:focus::placeholder {
  color: rgba(42, 47, 69, 1);
  opacity: 1;
}

select:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  height: calc(16px * 1.5 + 12px + 2px);
}

/*  Reset height for `textarea`s */
textarea:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  height: auto;
  height: calc((16px * 1.5 + 12px + 2px) * 3);
  resize: vertical;
}

.powered-by-zendesk {
  display: none;
}

/* 
 This overrides the extra rounded corners on search inputs in iOS so that our
 `.form-control` class can properly style them. Note that this cannot simply
 be added to `.form-control` as it's not specific enough. For details, see
 https:github.com/twbs/bootstrap/issues/11586. */
input[type="search"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
  -webkit-appearance: none;
}

/*  Special styles for iOS temporal inputs

 In Mobile Safari, setting `display: block` on temporal inputs causes the
 text within the input to become vertically misaligned. As a workaround, we
 set a pixel line-height that matches the given height of the input, but only
 for Safari. */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  input[type="date"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
  input[type="time"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
  input[type="datetime-local"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
  input[type="month"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)) {
    line-height: calc(16px * 1.5 * 2.5);
  }
}

/* ==========================================================================
   Buttons
   ========================================================================== */
.btn,
input[type="submit"],
[role="button"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.header .login,
.lines-button,
.community-recent-activity .recent-activity-controls a,
.satisfaction-box input[type="radio"] ~ label {
  display: inline-block;
  padding: 2px 10px;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-transform: none;
  letter-spacing: 0.1px;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 5px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
  touch-action: manipulation;
}

.btn-header {
  font-size: calc(16px - 5px);
}

.btn:focus,
.btn:active:focus,
input[type="submit"]:focus,
input[type="submit"]:active:focus,
[role="button"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
[role="button"]:active:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:active:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.header .login:focus,
.header .login:active:focus,
.lines-button:focus,
.lines-button:active:focus,
.community-recent-activity .recent-activity-controls a:focus,
.community-recent-activity .recent-activity-controls a:active:focus,
.satisfaction-box input[type="radio"] ~ label:focus,
.satisfaction-box input[type="radio"] ~ label:active:focus {
  outline: thin dotted;
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}

.btn:hover,
button:hover:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.btn:focus,
button:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
input[type="submit"]:hover,
input[type="submit"]:focus,
[role="button"]:hover:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
[role="button"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.header .login:hover,
.header .login:focus,
.lines-button:hover,
.lines-button:focus,
.community-recent-activity .recent-activity-controls a:hover,
.community-recent-activity .recent-activity-controls a:focus,
.satisfaction-box input[type="radio"] ~ label:hover,
.satisfaction-box input[type="radio"] ~ label:focus {
  text-decoration: none;
}

.btn:active,
input[type="submit"]:active,
[role="button"]:active:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:active:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.header .login:active,
.lines-button:active,
.community-recent-activity .recent-activity-controls a:active,
.satisfaction-box input[type="radio"] ~ label:active {
  background-image: none;
  outline: none;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

[role="button"]:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.btn-default,
.section-subscribe .dropdown-toggle,
.community-recent-activity .recent-activity-controls a,
.article-subscribe,
.article-unsubscribe,
.post-subscribe,
.post-unsubscribe,
.topic-menu-item-subscribe .dropdown-toggle,
.topic-menu-item-subscribe .topic-unsubscribe {
  color: #181818; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
  transition: all 0.2s ease-out;
  border-radius: 5px;
}

[role="button"]:hover:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:hover:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
[role="button"]:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:focus:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
[role="button"]:active:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
button:active:where(:not(#new-request-form *, [data-garden-id], [data-garden-id] *)),
.btn-default:hover,
.btn-default:focus,
.btn-default:active,
.section-subscribe .dropdown-toggle:hover,
.section-subscribe .dropdown-toggle:focus,
.section-subscribe .dropdown-toggle:active,
.community-recent-activity .recent-activity-controls a:hover,
.community-recent-activity .recent-activity-controls a:focus,
.community-recent-activity .recent-activity-controls a:active,
.article-subscribe:hover,
.article-subscribe:focus,
.article-subscribe:active,
.article-unsubscribe:hover,
.article-unsubscribe:focus,
.article-unsubscribe:active,
.post-subscribe:hover,
.post-subscribe:focus,
.post-subscribe:active,
.post-unsubscribe:hover,
.post-unsubscribe:focus,
.post-unsubscribe:active,
.topic-menu-item-subscribe .dropdown-toggle:hover,
.topic-menu-item-subscribe .dropdown-toggle:focus,
.topic-menu-item-subscribe .dropdown-toggle:active,
.topic-menu-item-subscribe .topic-unsubscribe:hover,
.topic-menu-item-subscribe .topic-unsubscribe:focus,
.topic-menu-item-subscribe .topic-unsubscribe:active {
  color: #181818; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background-color: rgba(81, 198, 111, 1);
  border-color: zass-#36a452;
  opacity: 0.9;
  box-shadow: 0px 8px 16px 0 rgba(0, 62, 59, 0.12);
  outline: 0;
}

input[type="submit"],
.btn-primary {
  color: #181818; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
  font-size: 16px;
  font-family: Proxima Nova, sans-serif; 
}

input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:active,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  color: #181818; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background-color: rgba(81, 198, 111, 1);
  opacity: 0.9;
  border-color: zass-#36a452;
}

.btn-header,
.header .login {
  color: rgba(169, 169, 169, 1);
  background-color: transparent;
  border-color: rgba(169, 169, 169, 1);
}

.btn-footer {
  color: rgba(169, 169, 169, 1);
  background-color: transparent;
  border: unset;
  font-size: calc(16px - 2px);
  padding: 6px 0;
}

.btn-footer:active {
  box-shadow: unset;
}

.btn-footer span {
  padding: 10px 49px;
}

.btn-header:hover,
.btn-header:focus,
.btn-header:active,
.header .login:hover,
.header .login:focus,
.header .login:active {
  color: zass-#8a8a8a;
  background-color: transparent;
  border-color: rgba(5, 5, 5, 1);
}

.profile-header-options [data-action="edit-profile"] {
  color: #164237; /* Dark Green - the brand-approved green for text on White */
  background-color: transparent;
  border-color: #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
  display: inline-block;
  padding: 4px 8px;
  margin-bottom: 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  text-transform: uppercase;
  letter-spacing: 0.1px;
  white-space: nowrap;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
  border-radius: 4px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease-out;
  touch-action: manipulation;
  outline: 0;
}

.profile-header-options [data-action="edit-profile"]:hover,
.profile-header-options [data-action="edit-profile"]:focus,
.profile-header-options [data-action="edit-profile"]:active {
  color: #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
  background-color: zass-darken(transparent, 12%);
  border-color: #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
}

.profile-header-options [data-action="edit-profile"]:active {
  background-image: none;
}

.profile-header-options [data-action="edit-profile"]:hover {
  opacity: 0.8;
}

/* SPLIT BUTTON */
.split-button {
  display: flex;
  justify-content: center;
}

.split-button button {
  height: 32px;
  line-height: 16px;
}

.split-button button:hover {
  color: #181818 !important; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
  box-shadow: 0px 8px 16px 0 rgba(79, 86, 107, 1);
  outline: 0;
}

[dir="rtl"] .split-button button:not(:only-child):first-child {
  border-left: 1px solid rgba(81, 198, 111, 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(81, 198, 111, 1);
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

.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):last-child {
  border-left: unset;
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
}

[dir="ltr"] .split-button button:not(:only-child):last-child {
  border-left: 0;
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

/* END OF SPLIT BUTTON */
/* Community Badges */
.community-badge {
  display: flex;
  flex-wrap: wrap;
}

.community-badge-titles {
  background-color: rgba(81, 198, 111, 1);
  border-radius: 4px;
  color: rgba(255, 255, 255, 1) !important;
  font-size: 12px;
  font-weight: 600;
  padding: 2px 8px;
  vertical-align: middle;
  white-space: nowrap;
  display: inline-flex;
  line-height: 20px;
  margin: 5px 2px;
}

.community-badge-container-achievements {
  padding-top: 5px;
}

.community-badge-achievements {
  display: inline-block;
  margin: 0 3px 0 0;
  padding: 5px 5px;
}

[dir="rtl"] .community-badge-achievements {
  margin: 0 0 0 3px;
}

.community-badge-achievements img {
  width: 40px;
  height: 40px;
}

.community-badge-titles img {
  width: 20px;
  height: 20px;
}

.profile-info .community-badge-achievements img {
  width: 40px;
  height: 40px;
}

.community-badge.comment-badge {
  margin-top: 0;
  margin-bottom: 0;
  justify-content: flex-start;
}

.community-badge-titles.comment-badge {
  margin-left: 5px;
}

/* End of Community Badge */
.container {
  padding-right: 40px;
  padding-left: 40px;
}

.my-activities-page {
  padding-top: 60px;
}

.request-container {
  padding-top: 40px;
}

.container-wrapper {
  max-width: 1200px;
  margin: 0 auto;
}

header .container-wrapper {
  max-width: unset;
  padding: 8px 0;
}

.row {
  margin-right: calc(15px * -1);
  margin-left: calc(15px * -1);
}

/* PADDING CONTROL */
.right-col {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  z-index: 2;
  padding-top: 40px;
  padding-bottom: 40px;
}

.left-col {
  position: relative;
  width: 100%;
}

[dir="ltr"] .left-col {
  padding: 40px 20px 0 30px;
}

[dir="rtl"] .left-col {
  padding: 40px 30px 0 20px;
}

/* END OF PADDING CONTROL */
/* COLUMN CUSTOMIZATION */
.col {
  position: relative;
  width: 100%;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
  margin-top: 10px;
}

[dir="ltr"] .col {
  float: left;
}

[dir="rtl"] .col {
  float: right;
}

.col-xs-1 {
  width: 8.33333%;
}

.col-xs-2 {
  width: 16.66667%;
}

.col-xs-3 {
  width: 25%;
}

.col-xs-4 {
  width: 33.33333%;
}

.col-xs-5 {
  width: 41.66667%;
}

.col-xs-6 {
  width: 50%;
}

.col-xs-7 {
  width: 58.33333%;
}

.col-xs-8 {
  width: 66.66667%;
}

.col-xs-9 {
  width: 75%;
}

.col-xs-10 {
  width: 83.33333%;
}

.col-xs-11 {
  width: 91.66667%;
}

.col-xs-12 {
  width: 100%;
}

.col-xs-offset-0 {
  margin-left: 0%;
}

.col-xs-offset-1 {
  margin-left: 8.33333%;
}

.col-xs-offset-2 {
  margin-left: 16.66667%;
}

.col-xs-offset-3 {
  margin-left: 25%;
}

.col-xs-offset-4 {
  margin-left: 33.33333%;
}

.col-xs-offset-5 {
  margin-left: 41.66667%;
}

.col-xs-offset-6 {
  margin-left: 50%;
}

.col-xs-offset-7 {
  margin-left: 58.33333%;
}

.col-xs-offset-8 {
  margin-left: 66.66667%;
}

.col-xs-offset-9 {
  margin-left: 75%;
}

.col-xs-offset-10 {
  margin-left: 83.33333%;
}

.col-xs-offset-11 {
  margin-left: 91.66667%;
}

.col-xs-offset-12 {
  margin-left: 100%;
}

@media (min-width: 769px) {
  .col-sm-1 {
    width: 8.33333%;
  }
  .col-sm-2 {
    width: 16.66667%;
  }
  .col-sm-3 {
    width: 25%;
  }
  .col-sm-4 {
    width: 33.33333%;
  }
  .col-sm-5 {
    width: 41.66667%;
  }
  .col-sm-6 {
    width: 50%;
  }
  .col-sm-7 {
    width: 58.33333%;
  }
  .col-sm-8 {
    width: 66.66667%;
  }
  .col-sm-9 {
    width: 75%;
  }
  .col-sm-10 {
    width: 83.33333%;
  }
  .col-sm-11 {
    width: 91.66667%;
  }
  .col-sm-12 {
    width: 100%;
  }
  .col-sm-offset-0 {
    margin-left: 0%;
  }
  .col-sm-offset-1 {
    margin-left: 8.33333%;
  }
  .col-sm-offset-2 {
    margin-left: 16.66667%;
  }
  .col-sm-offset-3 {
    margin-left: 25%;
  }
  .col-sm-offset-4 {
    margin-left: 33.33333%;
  }
  .col-sm-offset-5 {
    margin-left: 41.66667%;
  }
  .col-sm-offset-6 {
    margin-left: 50%;
  }
  .col-sm-offset-7 {
    margin-left: 58.33333%;
  }
  .col-sm-offset-8 {
    margin-left: 66.66667%;
  }
  .col-sm-offset-9 {
    margin-left: 75%;
  }
  .col-sm-offset-10 {
    margin-left: 83.33333%;
  }
  .col-sm-offset-11 {
    margin-left: 91.66667%;
  }
  .col-sm-offset-12 {
    margin-left: 100%;
  }
}

@media (min-width: 992px) {
  .col-md-1 {
    width: 8.33333%;
  }
  .col-md-2 {
    width: 16.66667%;
  }
  .col-md-3 {
    width: 25%;
  }
  .col-md-4 {
    width: 33.33333%;
  }
  .col-md-5 {
    width: 41.66667%;
  }
  .col-md-6 {
    width: 50%;
  }
  .col-md-7 {
    width: 58.33333%;
  }
  .col-md-8 {
    width: 66.66667%;
  }
  .col-md-9 {
    width: 75%;
  }
  .col-md-10 {
    width: 83.33333%;
  }
  .col-md-11 {
    width: 91.66667%;
  }
  .col-md-12 {
    width: 100%;
  }
  .col-md-offset-1 {
    margin-left: 8.33333%;
  }
  .col-md-offset-2 {
    margin-left: 16.66667%;
  }
  .col-md-offset-3 {
    margin-left: 25%;
  }
  .col-md-offset-4 {
    margin-left: 33.33333%;
  }
  .col-md-offset-5 {
    margin-left: 41.66667%;
  }
  .col-md-offset-6 {
    margin-left: 50%;
  }
  .col-md-offset-7 {
    margin-left: 58.33333%;
  }
  .col-md-offset-8 {
    margin-left: 66.66667%;
  }
  .col-md-offset-9 {
    margin-left: 75%;
  }
  .col-md-offset-10 {
    margin-left: 83.33333%;
  }
  .col-md-offset-11 {
    margin-left: 91.66667%;
  }
  .col-md-offset-12 {
    margin-left: 100%;
  }
}

@media (min-width: 1200px) {
  .col-lg-1 {
    width: 8.33333%;
  }
  .col-lg-2 {
    width: 16.66667%;
  }
  .col-lg-3 {
    width: 25%;
  }
  .col-lg-4 {
    width: 33.33333%;
  }
  .col-lg-5 {
    width: 41.66667%;
  }
  .col-lg-6 {
    width: 50%;
  }
  .col-lg-7 {
    width: 58.33333%;
  }
  .col-lg-8 {
    width: 66.66667%;
  }
  .col-lg-9 {
    width: 75%;
  }
  .col-lg-10 {
    width: 83.33333%;
  }
  .col-lg-11 {
    width: 91.66667%;
  }
  .col-lg-12 {
    width: 100%;
  }
  .col-lg-pull-0 {
    right: auto;
  }
  .col-lg-pull-1 {
    right: 8.33333%;
  }
  .col-lg-pull-2 {
    right: 16.66667%;
  }
  .col-lg-pull-3 {
    right: 25%;
  }
  .col-lg-pull-4 {
    right: 33.33333%;
  }
  .col-lg-pull-5 {
    right: 41.66667%;
  }
  .col-lg-pull-6 {
    right: 50%;
  }
  .col-lg-pull-7 {
    right: 58.33333%;
  }
  .col-lg-pull-8 {
    right: 66.66667%;
  }
  .col-lg-pull-9 {
    right: 75%;
  }
  .col-lg-pull-10 {
    right: 83.33333%;
  }
  .col-lg-pull-11 {
    right: 91.66667%;
  }
  .col-lg-pull-12 {
    right: 100%;
  }
  .col-lg-push-0 {
    left: auto;
  }
  .col-lg-push-1 {
    left: 8.33333%;
  }
  .col-lg-push-2 {
    left: 16.66667%;
  }
  .col-lg-push-3 {
    left: 25%;
  }
  .col-lg-push-4 {
    left: 33.33333%;
  }
  .col-lg-push-5 {
    left: 41.66667%;
  }
  .col-lg-push-6 {
    left: 50%;
  }
  .col-lg-push-7 {
    left: 58.33333%;
  }
  .col-lg-push-8 {
    left: 66.66667%;
  }
  .col-lg-push-9 {
    left: 75%;
  }
  .col-lg-push-10 {
    left: 83.33333%;
  }
  .col-lg-push-11 {
    left: 91.66667%;
  }
  .col-lg-push-12 {
    left: 100%;
  }
  .col-lg-offset-0 {
    margin-left: 0%;
  }
  .col-lg-offset-1 {
    margin-left: 8.33333%;
  }
  .col-lg-offset-2 {
    margin-left: 16.66667%;
  }
  .col-lg-offset-3 {
    margin-left: 25%;
  }
  .col-lg-offset-4 {
    margin-left: 33.33333%;
  }
  .col-lg-offset-5 {
    margin-left: 41.66667%;
  }
  .col-lg-offset-6 {
    margin-left: 50%;
  }
  .col-lg-offset-7 {
    margin-left: 58.33333%;
  }
  .col-lg-offset-8 {
    margin-left: 66.66667%;
  }
  .col-lg-offset-9 {
    margin-left: 75%;
  }
  .col-lg-offset-10 {
    margin-left: 83.33333%;
  }
  .col-lg-offset-11 {
    margin-left: 91.66667%;
  }
  .col-lg-offset-12 {
    margin-left: 100%;
  }
}

/* END OF COLUMN CUSTOMIZATION */
/* HEADER LOGO */
.logo-wrapper {
  width: 270px;
  height: 70px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.logo img {
  vertical-align: middle;
  max-height: 80px !important;
  height: calc(46 * 1px);
}

@media (min-width: 1025px) {
  .logo img:last-of-type {
    display: none;
  }
}

.logo-header {
  display: none;
}

@media (max-width: 1024px) {
  .logo-sidebar {
    display: none;
  }
  .logo-header {
    display: flex;
    margin-left: auto;
    margin-right: auto;
  }
  .logo-header img {
    height: calc(46 * 0.75px);
  }
}

/* END OF HEADER LOGO */
.wrapper {
  display: -webkit-box;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  flex-direction: row;
  background-color: rgba(255, 255, 255, 1);
  position: relative;
  min-height: 100%;
}

#main {
  width: calc(100% - 270px);
}

@media (max-width: 1024px) {
  #main {
    width: 100%;
    margin-left: 0;
    margin-right: 0 !important;
  }
}

.wrapper-head {
  width: calc(100% - 270px);
  height: 70px;
  position: fixed;
  z-index: 100;
}

.wrapper-main {
  margin-top: 70px;
  margin-bottom: 100px;
}

@media (max-width: 768px) {
  .wrapper-main {
    margin-bottom: 120px;
  }
}

.wrapper-main:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\00a0";
}

.wrapper-header,
.wrapper-footer {
  -webkit-box-flex: 0;
  flex: none;
}

.header {
  background-color: rgba(255, 255, 255, 1);
  height: 100%;
  transition: 0.3s ease-out;
}

.header.scrolled {
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.25);
}

@media (max-width: 1024px) {
  .wrapper-head {
    width: 100%;
  }
}

.header a,
.header span {
  color: rgba(42, 47, 69, 1);
  font-weight: 500;
}

.header-col {
  width: 32.5%;
  display: flex;
}

.header-col.header-menu {
  width: 100%;
}

@media (max-width: 767px) {
  .header .submit-a-request,
  .header .login {
    margin-bottom: 6px;
  }
}

.header-wrapper {
  display: flex;
  align-items: center;
  height: 100%;
  justify-content: space-between;
}

@media (min-width: 768px) {
  .header-controls {
    float: right;
  }
}

@media (max-width: 768px) {
  .header-collapse {
    display: none;
    padding-top: calc(16px * 1.5 / 2);
    padding-bottom: calc(16px * 1.5);
  }
}

@media (min-width: 769px) {
  .header-collapse {
    display: block !important;
    width: 100%;
  }
}

@media (max-width: 767px) {
  .header-menu {
    padding: 0;
  }
}

/* stylelint-disable */
#user-menu {
  margin: 0 !important;
  border: 0 !important;
}

#user-menu [role="menuitem"] {
  white-space: nowrap;
}

#user > .btn {
  padding-right: 0;
  padding-left: 0;
  font-weight: 400;
  text-transform: none;
  letter-spacing: 0;
}

@-webkit-keyframes bounce {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -25px, 0);
    transform: translate3d(0, -25px, 0);
  }
  25% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, -6px, 0);
    transform: translate3d(0, -6px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 2px, 0);
    transform: translate3d(0, 2px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@keyframes bounce {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, -25px, 0);
    transform: translate3d(0, -25px, 0);
  }
  25% {
    -webkit-transform: translate3d(0, 10px, 0);
    transform: translate3d(0, 10px, 0);
  }
  50% {
    -webkit-transform: translate3d(0, -6px, 0);
    transform: translate3d(0, -6px, 0);
  }
  75% {
    -webkit-transform: translate3d(0, 2px, 0);
    transform: translate3d(0, 2px, 0);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
}

@media (max-width: 767px) {
  #user-dropdown {
    position: static;
    display: inline;
    float: none;
    background: transparent !important;
    border: 0;
    box-shadow: none;
    opacity: 1 !important;
  }
  #user-dropdown:before,
  #user-dropdown:after {
    display: none;
  }
}

#user-dropdown [role="menuitem"] {
  padding: 10px 0;
}

@media (max-width: 767px) {
  #user-dropdown [role="menuitem"] {
    color: rgba(42, 47, 69, 1);
  }
  #user-dropdown [role="menuitem"]:hover {
    background-color: transparent;
  }
}

@media (min-width: 768px) {
  #user-dropdown [role="menuitem"] {
    padding-right: 16px;
    padding-left: 16px;
  }
}

#user-dropdown [role="separator"] {
  padding: 0;
  margin: 0;
}

@media (max-width: 767px) {
  #user-dropdown [role="separator"] {
    border-color: rgba(255, 255, 255, 0.15);
  }
}

@media (min-width: 768px) {
  #user-dropdown[aria-expanded="true"] {
    -webkit-animation: bounce 0.6s ease-out;
    animation: bounce 0.6s ease-out;
  }
}

#user-dropdown:before,
#user-dropdown:after {
  color: inherit;
}

#user {
  display: block;
}

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

#user .dropdown-toggle {
  padding-right: 0;
  padding-left: 0;
  font-size: calc(16px - 2px);
  color: inherit;
}

#user .dropdown-toggle,
#user .dropdown-toggle:active,
#user .dropdown-toggle:hover {
  border-color: transparent;
}

#user .dropdown-toggle:before,
#user .dropdown-toggle:after {
  color: rgba(42, 47, 69, 1);
}

@media (max-width: 767px) {
  #user .dropdown-toggle:before,
  #user .dropdown-toggle:after {
    display: none;
  }
}

#user-password,
#user-profile {
  color: rgba(84, 88, 90, 1);
}

@media (max-width: 767px) {
  #user-password {
    min-width: 1px !important;
    padding: calc(16px * 1.5 / 4) 12px !important;
    margin-top: calc(16px * 1.5 / 4);
    background-color: #fff;
    border-radius: 4px;
  }
  #user-profile {
    min-width: 1px !important;
    padding: calc(16px * 1.5 / 4) 12px !important;
    margin-top: calc(16px * 1.5 / 4);
    background-color: #fff;
    border-radius: 4px;
  }
}

#user-password [role="separator"] {
  padding: calc(16px * 1.5 / 4) 12px !important;
}

#user-profile [role="separator"] {
  padding: calc(16px * 1.5 / 4) 12px !important;
}

#user-password form {
  padding: calc(16px * 1.5 / 4) 12px !important;
}

#user-profile form {
  padding: calc(16px * 1.5 / 4) 12px !important;
}

#user-profile {
  font-size: calc(16px - 2px) !important;
}

#user-profile dt {
  padding: 8px 4px !important;
}

#user-profile dt label {
  margin-bottom: 0 !important;
}

#user-profile input[type="text"] {
  font-size: calc(16px - 2px) !important;
}

#password-form label {
  font-size: calc(16px - 2px) !important;
}

#password-submit {
  float: none !important;
  margin: 0 !important;
  background: auto !important;
}

.avatar {
  position: relative;
  display: inline-block;
  margin-right: 5px;
}

.avatar .icon-agent {
  color: #0072ef;
  border: 2px solid #fff;
  border-radius: 50%;
  bottom: -4px;
  background-color: #ffffff;
  font-size: 17px;
  height: 17px;
  line-height: 17px;
  position: absolute;
  right: -2px;
  text-align: center;
  width: 17px;
}

.avatar-agent:before {
  position: absolute;
  right: 0;
  bottom: 0;
  display: inline-block;
  margin-right: -4px;
  margin-bottom: -4px;
  font-family: "Font Awesome 5 Free";
  font-size: calc(16px * 0.75);
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  content: "\f19d";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.user-avatar {
  border-radius: 100%;
  width: 40px;
}

#user .user-avatar {
  width: 30px;
  height: 30px;
  margin-right: 5px;
}

/* LINES BUTTON */
.lines-button {
  padding: 15px 7.5px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  z-index: 9999;
  border: 0;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

@media (max-width: 768px) {
  .lines-button {
    float: right;
  }
}

@media (min-width: 769px) {
  .lines-button {
    display: none;
  }
}

.lines-button:hover {
  opacity: 1;
}

.lines-button:active {
  outline: 0;
  box-shadow: none;
  -webkit-transition: 0;
  transition: 0;
}

.lines-button:focus {
  outline: 0;
}

.lines,
.lines:before,
.lines:after {
  display: inline-block;
  width: 24px;
  height: 2px;
  background: rgba(42, 47, 69, 1);
  border-radius: 2px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.lines {
  position: relative;
}

.lines:before,
.lines:after {
  position: absolute;
  left: 0;
  content: "";
  -webkit-transform-origin: calc(30px / 14) center;
  transform-origin: calc(30px / 14) center;
}

.lines:before {
  top: 7.5px;
}

.lines:after {
  top: -7.5px;
}

.lines-button.is-active .lines {
  background: transparent;
}

.lines-button.is-active .lines:before,
.lines-button.is-active .lines:after {
  top: 0;
  width: 30px;
  -webkit-transform-origin: 50% 50%;
  transform-origin: 50% 50%;
}

.lines-button.is-active .lines:before {
  -webkit-transform: rotate3d(0, 0, 1, 45deg);
  transform: rotate3d(0, 0, 1, 45deg);
}

.lines-button.is-active .lines:after {
  -webkit-transform: rotate3d(0, 0, 1, -45deg);
  transform: rotate3d(0, 0, 1, -45deg);
}

.hc-name {
  display: inline-block;
  margin: auto 0;
  vertical-align: middle;
  border-left: 1px solid rgba(84, 88, 90, 1);
  margin-left: 5px;
  padding-left: 5px;
}

[dir="rtl"] .hc-name {
  border-left: unset;
  border-right: 1px solid rgba(84, 88, 90, 1);
  margin-left: unset;
  margin-right: 5px;
  padding-left: unset;
  padding-right: 5px;
}

.hc-name a {
  color: rgba(84, 88, 90, 1);
}

/* END LINES BUTTON */
/* Sidebar */
.sidebar {
  position: relative;
  width: 100%;
  max-width: 270px;
  color: rgba(84, 88, 90, 1);
  height: auto;
  min-height: 100%;
  z-index: 124;
  transition: transform 0.4s cubic-bezier(0.93, 0.29, 0.74, 0.97);
  -webkit-transition: transform 0.4s cubic-bezier(0.93, 0.29, 0.74, 0.97);
  -o-transition: transform 0.4s cubic-bezier(0.93, 0.29, 0.74, 0.97);
}

/* Exceptions */
.article-body div.sidebar {

  position: auto;
  width: 100%;
  max-width: 100%;
  color: rgba(84, 88, 90, 1);
  height: auto;
 min-height: 10%;
  z-index: auto;
  transition: none;
  -webkit-transition: none;
  -o-transition: none;
}

.article-body div.sidebar span {
  color: rgba(84, 88, 90, 1);
  
}

.article-body div.sidebar li {
  list-style: square;
}

[dir="ltr"] .sidebar {
  border-right: 0px no rgba(158, 162, 162, 1);
}

[dir="rtl"] .sidebar {
  border-left: 0px no rgba(158, 162, 162, 1);
}

[dir="ltr"] .sidebar-wrapper i {
  margin-right: 5px;
}

[dir="rtl"] .sidebar-wrapper i {
  margin-left: 5px;
}

.sidebar-container }
  height: 100%;
  width: 100%;
  max-width: 970px;
}

@media (max-width: 1024px) {
  .sidebar {
    position: fixed;
    width: 100%;
    height: 100%;
  }
  [dir="ltr"] .sidebar {
    left: 0;
    transform: translateX(-110%);
  }
  [dir="rtl"] .sidebar {
    right: 0;
    transform: translateX(110%);
  }
}

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

.sidebar-toggle {
  position: fixed;
  z-index: 99;
  margin-top: 89px;
  left: 0;
  width: 100%;
  height: 60px;
  background-color: rgba(255, 255, 255, 1);
  border-bottom: 1px solid rgba(169, 169, 169, 1);
}

/* MENU TREE */
.menu-tree-category {
  margin-bottom: 20px;
}

.menu-tree-category-parent > li > a {
  display: block;
  font-size: 20px;
  font-weight: 700;
  margin-bottom: 5px;
}

.menu-tree-section-parent {
  margin-bottom: 10px;
}

.menu-tree-section-parent > li > a {
  display: block;
  font-size: 16px;
  font-weight: 500;
  margin-bottom: 5px;
}

.menu-tree-section-link,
.menu-tree-sub-section-link,
.menu-tree-category-link[data-toggle="collapse"] {
  display: flex;
  position: relative;
  line-height: 1.5em;
  width: 100%;
  cursor: pointer;
  transition: all 0.2s;
  margin-bottom: 1em;
}

.menu-tree-section-link:hover > span {
  color: rgba(5, 5, 5, 1);
}

.menu-tree-section-link > .fa,
.menu-tree-sub-section-link > .fa,
.menu-tree-category-link[data-toggle="collapse"] > .fa {
  display: flex;
  height: 10%;
  margin: 7px 0 0 10px;
  position: relative;
  transition: transform 0.3s ease-out;
}

.menu-tree-section-link[aria-expanded="true"] > .fa,
.menu-tree-sub-section-link[aria-expanded="true"] > .fa,
.menu-tree-category-link[data-toggle="collapse"][aria-expanded="true"] > .fa {
  transform: rotate(-180deg);
}

.menu-tree-section-link > .fa:before,
.menu-tree-sub-section-link > .fa:before,
.menu-tree-category-link[data-toggle="collapse"] > .fa::before {
  content: "\f107";
}

.menu-tree-section-link > span,
.menu-tree-sub-section-link > span,
.menu-tree-category-link[data-toggle="collapse"] > span {
  width: 90%;
  transition: all 0.2s;
}

.menu-tree-section-link span span {
  line-height: 20px;

}

.menu-tree-article-link {
  font-size: calc(18px - 4px);
}

.menu-tree-article-parent {
  margin: 0;
}

[dir="ltr"] .menu-tree-article-parent {
  padding-left: 2px;
  margin-left: 0px;
  border-left: 0px solid rgba(0, 168, 93, 1);
}

[dir="rtl"] .menu-tree-article-parent {
  padding-right: 10px;
  margin-right: 5px;
  border-right: 1px solid rgba(0, 168, 93, 1);
}

.menu-tree-article-parent > li {
  margin-bottom: 0.65em;
  padding-left: 15px;
  line-height: 1.2em;
}

.menu-tree-article-parent > li:last-child {
  margin-bottom: 0.65em;
}

.sidebar.moved {
  //transform: translateX(-100%);
  display:none;
}

.non-collapsible-category .menu-tree-category-link .fa-angle-down {
  display: none;
}

/* SIDEBAR NAV ICON */
@media (min-width: 1025px) {
  .nav-icon {
    display: none;
  }
  .searchbar-mobile {
    display: none !important;
  }
}

.searchbar-mobile {
  display: block;
  font-size: 25px;
  width: 25px;
  height: 25px;
  position: absolute;
  top: 35%;
  color: rgba(169, 169, 169, 1);
}

[dir="ltr"] .searchbar-mobile {
  right: 20px;
}

[dir="rtl"] .searchbar-mobile {
  left: 20px;
}

.nav-icon {
  width: 25px;
  height: 25px;
  position: absolute;
  top: 35%;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.5s ease-in-out;
  -moz-transition: 0.5s ease-in-out;
  -o-transition: 0.5s ease-in-out;
  transition: 0.5s ease-in-out;
  cursor: pointer;
}

[dir="ltr"] .nav-icon {
  left: 20px;
}

[dir="rtl"] .nav-icon {
  right: 20px;
}

.nav-icon span {
  display: block;
  position: absolute;
  height: 3px;
  width: 100%;
  background: rgba(169, 169, 169, 1);
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: 0.25s ease-in-out;
  -moz-transition: 0.25s ease-in-out;
  -o-transition: 0.25s ease-in-out;
  transition: 0.25s ease-in-out;
}

.nav-icon span:nth-child(1) {
  top: 0px;
}

.nav-icon span:nth-child(2),
.nav-icon span:nth-child(3) {
  top: 9px;
}

.nav-icon span:nth-child(4) {
  top: 18px;
}

.nav-icon.open span:nth-child(1) {
  top: 9px;
  width: 0%;
  left: 50%;
}

.nav-icon.open span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}

.nav-icon.open span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.nav-icon.open span:nth-child(4) {
  top: 9px;
  width: 0%;
  left: 50%;
}

/* END OF NAV ICON */
.sidebar-toggle .button-wrapper {
  padding: 18px 0;
}

.sidebar:before {
  width: 100vw;
  top: 0;
  bottom: 0;
  z-index: -1;
  position: absolute;
  background-color: rgba(253, 253, 253, 1);
  content: "";
}

[dir="ltr"] .sidebar:before {
  right: 0;
}

[dir="rtl"] .sidebar:before {
  left: 0;
}

.category {
  margin-bottom: 30px;
}

.sidebar .sidebar-wrapper span,
.sidebar .sidebar-wrapper .h1 .h2 .h3,
.sidebar .sidebar-wrapper a {
 color: rgba(84, 88, 90, 1) !important;
}

.article-body .sidebar a
{
   color: rgba(70, 103, 177, 1);
}

.sidebar a:hover,
.sidebar span:hover {
  color: rgba(5, 5, 5, 1);
}

.sidebar nav > ul > li {
  font-size: 12px;
  font-weight: normal;
}

.sidebar li {
  list-style: none;
}

.sidebar h2 {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 5px;
  font-family: Proxima Nova, sans-serif !important;
}


.sidebar h3 {
  text-transform: capitalize;
  font-size: calc(18px - 2px);
  font-weight: 500;
  margin-bottom: 0;
  font-family:  Proxima Nova, sans-serif!important;
}
}

.sidebar-wrapper {
  position: absolute;
  top: 70px;
  bottom: 100px;
  width: 100%;
  max-width: 270px;
  display: flex;
  overflow-y: auto;
  overflow-x: hidden;
}

.sidebar-wrapper::-webkit-scrollbar {
  width: 5px;
}

.sidebar-wrapper::-webkit-scrollbar-thumb {
  background-color: rgba(84, 88, 90, 1);
}

.sidebar-wrapper::-webkit-scrollbar-thumb:hover {
  background-color: rgba(84, 88, 90, 1);
}

.sidebar-wrapper > .left-col > nav {
  margin-bottom: 40px;
}

.sidebar-wrapper > .left-col > nav > ul > li {
  margin-bottom: 20px;
}

.sidebar-header {
  position: absolute;
  top: 0;
  left: 0;
  height: 70px;
  border-bottom: 1px solid rgba(158, 162, 162, 1);
}

.sidebar-header .fa {
  display: none;
  font-size: 25px;
}

@media (max-width: 1024px) {
  .sidebar-header .fa {
    display: block;
    grid-column-start: none;
  }
  .sidebar-header {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    align-items: center;
    padding: 0 20px;
  }
}

.sidebar-footer {
  position: absolute;
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  width: 270px;
  height: 100px;
  text-align: center;
  border-top: 1px solid rgba(158, 162, 162, 1);
  padding: 36px 0;
  z-index: 103;
}

@media (max-width: 1024px) {
  .sidebar-footer {
    width: 100%;
  }
}

[dir="ltr"] .sidebar-footer {
  left: 0;
}

[dir="rtl"] .sidebar-footer {
  right: 0;
}

.sidebar-footer-content {
  flex-basis: 50%;
  text-align: center;
  height: 100%;
  flex-grow: 1;
}

[dir="ltr"] .sidebar-footer-content + .sidebar-footer-content {
  border-left: 1px solid rgba(158, 162, 162, 1);
}

[dir="rtl"] .sidebar-footer-content + .sidebar-footer-content {
  border-right: 1px solid rgba(158, 162, 162, 1);
}

.sidebar-footer-content > div {
  margin: auto 0;
}

.sidebar-footer-content a {
  font-size: 14px;
  line-height: normal;
  text-transform: unset;
  font-weight: 700;
  padding: 0;
}

.article-list {
  padding-bottom: 10px;
}

/* END OF Sidebar */
/* Homepage CSS */
.homepage-wrapper {
  width: 100%;
  display: flex;
}

@media (max-width: 1024px) {
  .homepage-wrapper {
    width: 100%;
    margin-top: 40px;
  }
}

.homepage-header h3 {
  font-size: 40px;
  font-weight: 700;
}

/* Homepage Content */
.content-wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 20px;
}

.content-block {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: space-between;
}

/* End of Homepage Content */
/* Recent Activity */
.recent-activity-header {
  margin-bottom: 30px;
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(158, 162, 162, 1);
  color: rgba(84, 88, 90, 1);
  font-size: 24px;
}

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

.recent-activity-item {
  border-bottom: 1px solid #ddd;
  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(84, 88, 90, 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: zass-#868b8e;
  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-accessibility-label {
  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;
}

.recent-activity-comment-icon svg {
  vertical-align: middle;
  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;
}

/* End of Recent Activity */
/* SEARCHBOX */
.search {
  position: relative;
}

.transparent input[type="search"] {
  background-color: transparent;
}

.search:before {
  position: absolute;
  top: 50%;
  display: inline-block;
  margin-top: -12px;
  color: zass-#868fb5;
  content: "";
  background-image: url(/hc/theming_assets/01KZF54HDQRGNY6V1PGB5985RM);
  width: 24px;
  height: 24px;
  background-size: 100%;
}

[dir="ltr"] .search:before {
  left: 10px;
}

[dir="rtl"] .search:before {
  right: 10px;
}

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

.hero-item .search:before {
  width: 30px;
  height: 30px;
  left: 20px;
}

.searchbox {
  margin-top: calc(16px * 1.5);
}

.searchbox-suggestions ul {
  padding-left: 0;
  margin-bottom: calc(16px * 1.5);
  list-style: none;
}

.searchbox-suggestions li {
  margin-bottom: calc(16px * 1.5 / 3);
}

.search-container {
  position: relative;
}

.search-container #query {
  padding-left: 35px;
  padding-top: 19px;
  padding-bottom: 19px;
  -webkit-transition: border 0.3s ease;
  transition: border 0.3s ease;
}

::-webkit-input-placeholder {
  color: white;
}

@media (max-width: 768px) {
  .search-container-hero-item .search:before {
    font-size: 20px;
  }
}

.search-container-hero-item #query {
  height: 50px;
  padding: 0 55px;
  font-size: 24px;
  font-family: Proxima Nova, sans-serif; 
  background-color: white;
  border-color: #fff;
  color: rgba(84, 88, 90, 1);
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.search-container-hero-item #query:focus {
  background-color: #fff;
}

@media (min-width: 992px) {
  .search-container-hero-item #query {
    height: 60px;
    color: black;
  }
}

.search-container-hero-item input[type="submit"] {
  display: inline-block;
  height: 60px;
  padding-right: calc(12px * 2);
  padding-left: calc(12px * 2);
  margin-left: 16px;
  flex-shrink: 0;
  display: none;
}

@media (max-width: 991px) {
  .search-container-hero-item input[type="submit"] {
    display: none;
  }
}

.search-container-small {
  margin-bottom: calc(16px * 1.5 * 2);
}

/* END OF SEARCHBOX */
@media (min-width: 480px) {
  .collapse-button {
    display: none;
  }
}

.category-tree-item-title-link {
  color: inherit;
}

.category-tree-item-title-link-accordion {
  pointer-events: none;
}

/* CATEGORY TREE ACCORDION */
.category-tree-item-accordion-item {
  margin-bottom: calc(16px * 1.5);
  border: 1px solid #eceeef;
  border-radius: 4px;
}

.category-tree-item-title-accordion-title {
  position: relative;
  padding: 20px 52px 20px 20px;
  margin-bottom: 0;
  font-size: calc(16px * 1.25);
  cursor: pointer;
  border: 0;
}

.category-tree-item-title-accordion-title:before {
  position: absolute;
  content: "";
}

.category-tree-item-title-accordion-title a {
  pointer-events: none;
}

.category-tree-item-sections-accordion-content {
  display: none;
  padding: 24px 10px;
  margin-right: 0;
  margin-left: 0;
  border-top: 1px solid #eceeef;
}

.category-tree-item-sections-accordion-content p:last-child {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .category-tree-accordion {
    margin-bottom: calc(16px * 1.5 * 3);
  }
}

.category-tree-accordion .category-tree-item-title-accordion-title:before {
  top: 50%;
  right: 22px;
  width: 8px;
  height: 8px;
  margin-top: -4px;
  border-bottom: 2px solid rgba(81, 198, 111, 1);
  border-left: 2px solid rgba(81, 198, 111, 1);
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.category-tree-accordion .category-tree-item-title-accordion-title-active:before {
  -webkit-transition: -webkit-transform 0.3s;
  transition: -webkit-transform 0.3s;
  transition: transform 0.3s;
  transition: transform 0.3s, -webkit-transform 0.3s;
  -webkit-transform: rotate(135deg);
  transform: rotate(135deg);
}

/* END OF CATEGORY TREE */
.article-list {
  padding-left: 0;
  list-style: none;
}

.article-lists li a {
  color: rgba(70, 103, 177, 1);
  display: block;
}

[dir="ltr"] .article-lists ul {
  margin-left: 20px;
}

[dir="rtl"] .article-lists ul {
  margin-right: 20px;
}

.section-tree-title {
  font-family: Proxima Nova, sans-serif; 
  font-size: 24px;
  margin-left: 20px;
}

[dir="ltr"] .subsection-article-lists.article-lists {
  margin-left: 40px;
}

[dir="rtl"] .subsectiop-article-lists.article-lists {
  margin-right: 40px;
}

.section-title-link {
  font-size: 24px !important;
}

.article-list > li > a {
  color: rgba(70, 103, 177, 1);
}

.article-list > li > a:hover {
  color: rgba(5, 5, 5, 1);
}

.sidebar .article-list {
  margin-bottom: 0;
}

.article-list-item {
  margin-bottom: calc(16px * 1.5 / 2);
}

.article-list-item-is-promoted span {
  font-size: 10px;
  color: #fbce0a;
  vertical-align: middle;
}

.subsection-list-item {
  margin-bottom: calc(16px * 1.5 / 2);
}

.subsection-list-link {
  font-size: 18px;
}

.community-recent-activity {
  padding: calc(16px * 1.5) 15px;
  margin-bottom: calc(16px * 1.5 * 2);
  border: 2px solid #eceeef;
  border-radius: 4px;
}

.community-recent-activity h4 {
  font-size: calc(16px * 1.75);
  font-weight: 400;
}

.community-recent-activity .recent-activity-header {
  display: none;
}

.community-recent-activity .recent-activity-list {
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

@media (min-width: 768px) {
  .community-recent-activity .recent-activity-list {
    margin-right: calc(15px * -1);
    margin-left: calc(15px * -1);
  }
}

@media (min-width: 768px) {
  .community-recent-activity .recent-activity-item {
    display: inline-block;
    width: 33.3333%;
    padding-right: 15px;
    padding-left: 15px;
    margin-bottom: calc(16px * 1.5);
    vertical-align: top;
  }
}

.community-recent-activity .recent-activity-item-meta {
  font-size: calc(16px * 0.75);
  color: #979797;
}

.community-recent-activity .recent-activity-item-comment span:before {
  display: inline-block;
  margin-right: 2px;
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  content: "\f075";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.community-recent-activity .recent-activity-item-parent {
  font-weight: 600;
  color: rgba(84, 88, 90, 1);
}

.footer-submit-ticket {
  padding: calc(16px * 1.5 * 2) calc(12px * 2) calc(16px * 1.5);
  margin-bottom: calc(16px * 1.5 * 2);
  text-align: center;
  background-color: #eceeef;
  border-radius: 4px;
}

.footer-submit-ticket-title {
  font-size: calc(16px * 1.5);
}

.footer-submit-ticket-subtitle {
  font-size: calc(16px * 1.5);
  color: zass-#868b8e;
}

.footer-submit-ticket-btn:empty {
  display: none;
}

.footer-submit-ticket-btn .btn {
  padding: 10px 18px;
}

.footer {
  padding-top: 10px;
  padding-bottom: 10px;
  font-size: 10.5px;
  line-height: 1.1;
  color: rgba(42, 47, 69, 1);
  width: 100%;
  bottom: 0;
  z-index: 97;
}

.footer .row {
  margin-left: 0;
  margin-right: 0;
}

.footer .d-flex {
  justify-content: space-between;
}

@media (max-width: 1024px) {
  .footer {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .footer .d-flex {
    flex-direction: column;
  }
}

.footer-bordered {
  border-top: 1px solid rgba(42, 47, 69, 1);
}

.footer-wrapper {
  width: 100%;
  margin: 0 auto;
}

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

.footer-col {
  position: relative;
}

@media (min-width: 769px) {
  .footer-col {
    display: table-cell;
    vertical-align: top;
    width: 40%;
  }
}

.footer-social-link:hover,
.footer-social-link:focus {
  opacity: 1;
  color: rgba(42, 47, 69, 1);
}

.footer-social-link {
  display: block;
  padding: 0;
  font-size: 16px !important;
  color: rgba(42, 47, 69, 1);
  width: 32px;
  height: 32px;
  border-radius: 50%;
  text-align: center;
  line-height: 32px !important;
  margin-right: 5px;
  opacity: 0.5;
}

.footer-social-link + .footer-social-link {
  margin-left: 5px;
}

.copyrights a {
  color: rgba(42, 47, 69, 1);
  text-transform: capitalize;
  min-width: 208px;
  text-align: left;
}

@media (max-width: 768px) {
  .copyrights a {
    text-align: center;
  }
}

@media (min-width: 769px) {
  .copyrights-col {
    display: flex;
    flex-direction: row;
  }
}

.copyrights p:last-of-type {
  margin-bottom: 5px;
  margin-top: 10px;
}

table {
  background-color: transparent;
}

.meta {
  font-size: 14px;
}

.meta-item {
  display: inline-block;
  margin-right: calc(12px / 2);
}

.meta-item + .meta-item:before {
  margin-right: calc(12px / 2);
  font-size: 10px;
  content: "\2022";
}

.meta-profile {
  margin-bottom: 0;
  color: rgba(84, 88, 90, 1);
}

.breadcrumbs {
  padding: 0;
  margin-bottom: 15px;
  list-style: none;
  background-color: transparent;
  border-radius: 4px;
  font-size: 14px !important;
}

@media (max-width: 480px) {
  .breadcrumbs {
    font-size: 12px !important;
  }
}

.breadcrumbs > li {
  display: inline-block;
  color: #8c9494;
}

.breadcrumbs > li + li:before {
  padding: 0 5px;
  color: #8c9494;
  content: "\00a0";
  content: "› ";
  font-size: 20px;
}

.breadcrumbs li a,
.breadcrumbs > li a {
  color: zass-#868b8e;
}

.breadcrumbs li a:hover,
.breadcrumbs > li a:hover {
  text-decoration: none;
  color: rgba(5, 5, 5, 1);
}

.search-result-breadcrumbs {
  padding: 0;
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: 14px;
}

.search-results-container {
  margin-bottom: 0;
  padding-top: 20px;
}

.search-results-count {
  font-size: 28px;
  font-weight: 600;
}

.search-result {
  margin-bottom: calc(16px * 1.5);
  border-bottom: 2px solid #eceeef;
}

@media (max-width: 768px) {
  .search-results div:first-child {
    order: 2;
  }
}

.search-result-title {
  margin-bottom: calc(16px * 1.5 / 2);
  font-weight: 600;
}

.search-result-description {
  margin-bottom: calc(16px * 1.5 / 2);
}

.search-result-description:empty {
  display: none;
}

.search-result-description em {
  padding: 0 3px;
  font-style: normal;
  font-weight: 600;
  background-color: rgba(255, 255, 255, 1);
  color: rgba(84, 88, 90, 1);
  border-radius: 3px;
}

.search-result-meta {
  margin-bottom: calc(16px * 1.5 / 2);
}

.search-result-votes {
  display: inline-block;
  padding: 2px 4px;
  font-size: 16px;
  color: rgba(255, 255, 255, 1);
  background-color: rgba(70, 103, 177, 1);
  border-radius: 4px;
}

.search-results a:hover {
  text-decoration: underline;
}

/* Search Results Filters */
.search-results-filters {
  padding: 16px;
  font-size: calc(16px - 2px);
  border: 2px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
}

@media (max-width: 767px) {
  .search-results-filters {
    margin-bottom: calc(16px * 1.5 * 2);
  }
}

.search-results-filter + .search-results-filter {
  margin-top: 24px;
}

@media (min-width: 768px) {
  .search-results-filter + .search-results-filter {
    margin-top: 32px;
  }
}

.search-results-filter-title {
  margin-bottom: 0;
  margin-left: 8px;
  font-weight: 600;
  font-size: 18px;
}

@media (max-width: 767px) {
  .search-results-filter-title {
    position: relative;
    font-size: calc(16px * 1);
    cursor: pointer;
  }
}

@media (max-width: 767px) {
  .search-results-filter-title:after {
    position: absolute;
    top: 50%;
    right: 0;
    display: block;
    margin-left: 5px;
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    line-height: 1.5;
    color: inherit;
    content: "\f107";
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }
  .search-results-filter.collapsible-sidebar[aria-expanded="true"] .search-results-filter-title:after {
    -webkit-transform: translateY(-50%) rotate(-180deg);
    transform: translateY(-50%) rotate(-180deg);
  }
  .search-results-filter.collapsible-sidebar[aria-expanded="false"] .search-results-filter-list {
    display: none;
  }
  .search-results-filter.collapsible-sidebar[aria-expanded="true"] .search-results-filter-list {
    display: block;
  }
}

.search-results-filter-list {
  margin-top: 24px;
  margin-bottom: 0;
}

@media (max-width: 767px) {
  .search-results-filter-list {
    display: none;
  }
}

@media (min-width: 768px) {
  .search-results-filter-list {
    display: block !important;
  }
}

.search-results-filter-item {
  display: block;
  margin-bottom: 4px;
  font-size: 16px;
}

.search-results-filter-item.is-active .search-results-filter-link {
  color: #fff;
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
}

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

.search-results-filter .search-result-subfilters-all li:nth-child(n + 6) {
  display: none;
}
.search-results-filter .see-all-filters {
  background: none;
  border: none;
  cursor: pointer;
  display: block;
  padding: 10px;
  color: rgba(70, 103, 177, 1);
}

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


.search-results-filter-link {
  display: block;
  padding: 6px 8px;
  color: rgba(84, 88, 90, 1);
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 4px;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.search-results-filter-link:hover {
  background-color: #f7f7f9;
  border-color: #f7f7f9;
}

.search-results-filter-link:focus {
  background-color: #f7f7f9;
  border-color: #f7f7f9;
}

.search-results-filter-link:active {
  background-color: #f7f7f9;
  border-color: #f7f7f9;
}

.search-results-filter-link:active {
  background-image: none;
  outline: none;
  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

.search-results-filter-count {
  opacity: 0.6;
}

.search-result-show-more {
  padding: 0;
  margin-left: 8px;
  color: #164237; /* Dark Green - the brand-approved green for text on White */
  background-color: transparent;
  border: 0;
}

/* End of Search Result */
.article {
  position: relative;
}

.article-title {
  font-size: calc(16px * 1.5);
  font-weight: 300;
}

@media (min-width: 768px) {
  .article-title {
    font-size: calc(16px * 1.75);
  }
}

@media (min-width: 992px) {
  .article-title {
    font-size: calc(16px * 2.5);
  }
}

.article-meta-parent {
  display: flex;
}

.article-meta {
  display: table;
  width: 100%;
}

.article-meta-controls {
  display: flex;
  align-items: center;
}

@media (max-width: 768px) {
  .article-meta-controls {
    margin-bottom: 10px;
  }
}

.article-meta-col {
  display: table-cell;
  vertical-align: top;
}

.article-meta-col-main {
  width: 100%;
  padding-right: 12px;
}

.article-body {
  margin-bottom: calc(16px * 1.5);
}

.article-body ul, .article-body ol {
  padding-inline-start: 0px;
  margin-block-start: 1em;
}

.article-body ul {
  list-style: outside;
}

.article-body ol {
  list-style: decimal;
}

.procedure ol > li::marker {
  font-weight: bold;
 
}



.article-body ul ul {
  margin-top: calc(16px * 1.5 / 4);
}

.article-body ul ol {
  margin-top: calc(16px * 1.5 / 4);
}

.article-body ol ul {
  margin-top: calc(16px * 1.5 / 4);
}

.article-body ol ol {
  margin-top: calc(16px * 1.5 / 4);
}

.article-body ul li,
.article-body ol li {
  margin-bottom: calc(16px * 1.5 / 4);
}

.article-vote {
  position: relative;
  padding: calc(16px * 1.5) 12px;
  border: 2px solid #eceeef;
  border-radius: 4px;
}

.article-vote-controls-item {
  color: rgba(84, 88, 90, 1);
  background-color: #eceeef;
  border-color: #eceeef;
}

.article-vote-controls-item:hover {
  color: zass-#36393a;
  background-color: zass-#cbd0d3;
  border-color: zass-#cbd0d3;
}

.article-vote-controls-item:focus {
  color: zass-#36393a;
  background-color: zass-#cbd0d3;
  border-color: zass-#cbd0d3;
}

.article-vote-controls-item:active {
  color: zass-#36393a;
  background-color: zass-#cbd0d3;
  border-color: zass-#cbd0d3;
}

.article-vote-controls-item:active {
  background-image: none;
}

.article-vote-controls-item-voted {
  color: zass-#3b3e40;
  border-color: zass-#3b3e40;
}

@media (max-width: 767px) {
  .article-vote-question {
    display: block;
    margin-bottom: calc(16px * 1.5 / 2);
  }
}

@media (min-width: 768px) {
  .article-vote-question {
    float: left;
    margin-right: 12px;
  }
}

.article-vote-controls {
  white-space: nowrap;
}

@media (max-width: 767px) {
  .article-vote-controls {
    display: block;
    margin-bottom: calc(16px * 1.5 / 2);
  }
}

.article-vote-count {
  display: block;
  font-size: calc((16px * 0.75) - 2);
  color: #979797;
}

.article-share {
  margin-bottom: calc(16px * 1.5);
}

.article-share ul {
  margin-top: 0;
}

.article-footer {
  margin-bottom: calc(16px * 1.5);
}

.article-attachments {
  margin-bottom: calc(16px * 1.5);
}

@media (max-width: 767px) {
  .article-sidebar {
    padding-top: calc(16px * 1.5);
    border-top: 2px;
  }
}

.article-container {
  display: -webkit-box;
  display: flex;
  margin-right: calc(15px * -1);
  margin-left: calc(15px * -1);
  flex-wrap: wrap;
}

.article-container-col {
  padding-right: 15px;
  padding-left: 15px;
}

.article-container-sidenav,
.article-container-toc {
  display: none;
}

.comments-callout {
  font-size: calc(16px * 0.75);
  color: #979797;
}

.comments-callout:empty {
  display: none;
}

.comments-list {
  padding-left: 0;
  list-style: none;
}

.comment-list-header {
  padding-bottom: calc(16px * 1.5 / 2);
  margin-bottom: calc(16px * 1.5);
  border-bottom: 2px solid #eceeef;
}

.comment-list-heading {
  margin-bottom: 0;
  font-size: calc(16px * 1.1);
  font-weight: 600;
}

.comment-sorter {
  padding-bottom: calc(16px * 1.5);
  margin-bottom: calc(16px * 1.5);
  border-bottom: 2px solid #eceeef;
}

.comment-sorter {
  display: table;
  width: 100%;
}

@media (min-width: 768px) {
  .comment-sorter-col {
    display: table-cell;
    vertical-align: middle;
  }
}

@media (max-width: 767px) {
  .comment-sorter-col-main {
    margin-bottom: calc(16px * 1.5 / 2);
  }
}

@media (min-width: 768px) {
  .comment-sorter-col-main {
    padding-right: 12px;
  }
}

@media (min-width: 768px) {
  .comment-sorter-col-filters {
    text-align: right;
  }
}

.comment-sorter-item.is-active {
  font-weight: 600;
}

.comment-sorter-item + .comment-sorter-item:before {
  margin: 0 calc(12px / 2);
  font-size: 10px;
  content: "\2022";
}

.comment {
  padding-bottom: calc(16px * 1.5);
  margin-bottom: calc(16px * 1.5);
  border-bottom: 1px solid #eceeef;
}

.comment-wrapper {
  position: relative;
}

.comments-content {
  position: relative;
  padding-right: 12px;
}

.comment-header {
  position: relative;
  margin-bottom: calc(16px * 1.5);
}



.comment-voting-and-actions {
  position: absolute;
  top: 0;
  right: 0;
  width: 40px;
  text-align: center;
}

.comment-voting-and-actions .dropdown-toggle {
  font-size: 0;
}

.comment-voting-and-actions .dropdown-toggle:after {
  display: inline-block;
  margin-left: 0;
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  content: "\f013";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.comment-official-heading {
  position: absolute;
  top: 0;
  right: calc(12px * 3);
  width: auto;
  padding: 1px calc(12px / 2);
  font-size: calc(16px * 0.75);
  color: #181818; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background-color: rgba(81, 198, 111, 1);
  border-radius: 0 0 5px 5px;
}

.comment-official .comment-wrapper {
  position: relative;
  padding: calc(16px * 1.5) calc(12px * 2);
  border: 2px solid rgba(84, 88, 90, 1);
  border-radius: 5px;
}

.comment-form {
  display: flex;
  position: relative;
  margin-bottom: calc(16px * 1.5);
}

.comment-form-request {
  padding-left: calc(40px + 12px);
  position: relative;
  margin-bottom: calc(16px * 1.5);
}

.comment-form-request .comment-avatar {
  position: absolute;
  top: 0;
  left: 0;
}

@media (max-width: 768px) {
  .comment-form-request {
    padding-left: unset;
    padding-right: unset;
  }
}

@media (max-width: 767px) {
  .comment-form-avatar {
    display: none;
  }
}

.comment-form-ccs {
  margin-bottom: 0;
}

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

.comment-form-ccs ul[data-hc-pills-container] {
  margin: 0;
  border: 2px solid #eceeef;
  border-bottom: 0;
  border-radius: 4px 4px 0 0;
}

.comment-form-ccs ul[data-hc-pills-container][data-hc-focus="true"] {
  border-color: #9ed5e7;
  box-shadow: inset 0 -2px 0 #9ed5e7;
}

.comment-form-body {
  margin-bottom: calc(16px * 1.5);
}

.comment-body {
  margin-bottom: calc(16px * 1.5);
}

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

.comment-body ul,
.comment-body ol {
  padding-left: 20px;
}

.comment-body ul ul {
  margin-top: calc(16px * 1.5 / 2);
}

.comment-body ul ol {
  margin-top: calc(16px * 1.5 / 2);
}

.comment-body ol ul {
  margin-top: calc(16px * 1.5 / 2);
}

.comment-body ol ol {
  margin-top: calc(16px * 1.5 / 2);
}

.comment-body ul li {
  margin-bottom: calc(16px * 1.5 / 2);
}

.comment-body ol li {
  margin-bottom: calc(16px * 1.5 / 2);
}

.comment-form-mark-as-solved {
  position: relative;
}

.comment-form-comment-ccs ul {
  margin-bottom: 0;
}

.my-activities-nav {
  margin-bottom: calc(16px * 1.5);
}

.my-activities-lists {
  margin-bottom: calc(16px * 1.5 * 2);
}

.my-activities-lists button {
  text-transform: unset;
}

@media (min-width: 768px) {
  .my-activities-lists {
    display: table;
    width: 100%;
  }
}

.my-activities-lists-head {
  display: none;
  color: rgba(84, 88, 90, 1);
}

@media (min-width: 768px) {
  .my-activities-lists-head {
    display: table-header-group;
    font-size: calc(16px * 0.75);
    font-weight: 600;
    text-transform: uppercase;
  }
}

@media (min-width: 768px) {
  .my-activities-lists-body {
    display: table-row-group;
  }
}

.my-activities-lists-row {
  display: block;
}

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

.my-activities-lists-col {
  display: block;
  text-align: start;
}

@media (min-width: 768px) {
  .my-activities-lists-col {
    display: table-cell;
    padding-top: calc(16px * 1.5 / 2);
    padding-bottom: calc(16px * 1.5 / 2);
    border-bottom: 1px solid #eceeef;
  }
  .my-activities-lists-col + .my-activities-lists-col {
    padding-left: 12px;
  }
}

@media (max-width: 767px) {
  .my-activities-lists-request-id {
    display: inline;
  }
}

@media (min-width: 768px) {
  .my-activities-lists-request-id {
    display: none;
  }
}

.my-activities-dropdown ul {
  padding-left: 0;
  list-style: none;
}

.my-activities-dropdown-lists {
  margin-bottom: 0;
}

.my-activities-dropdown-item {
  margin-bottom: 0;
}

.my-activities-dropdown-item a {
  display: block;
}

@media (min-width: 768px) {
  .my-activities-dropdown-item {
    float: left;
  }
}

@media (min-width: 768px) {
  .my-activities-dropdown-item + .my-activities-dropdown-item {
    margin-left: 12px;
  }
}

.my-activities-dropdown-main {
  padding-bottom: calc(16px * 1.5);
  margin-bottom: calc(16px * 1.5);
}

.my-activities-dropdown-main .my-activities-dropdown-item {
  padding: calc(12 / 2px) 0;
  background-color: rgba(255, 255, 255, 1);
}

@media (max-width: 767px) {
  .my-activities-dropdown-main .my-activities-dropdown-item {
    margin-bottom: calc(16px * 1.5 / 3);
  }
}

.my-activities-dropdown-main .my-activities-dropdown-item.is-active {
  font-weight: 600;
  color: rgba(84, 88, 90, 1);
  border-bottom: 2px solid rgba(5, 5, 5, 1);
}

.my-activities-dropdown-sub {
  margin-bottom: calc(16px * 1.5);
}

.my-activities-dropdown-sub .my-activities-dropdown-item.is-active {
  font-weight: 600;
}

.my-activities-dropdown-sub .my-activities-dropdown-item a {
  display: inline-block;
}

@media (min-width: 768px) {
  .my-activities-dropdown-sub .my-activities-dropdown-item + .my-activities-dropdown-item:before {
    margin-right: calc(12px / 2);
    font-size: 10px;
    content: "\2022";
  }
}

@media (max-width: 767px) {
  .my-activities-list {
    padding: calc(16px * 1.5 / 2) 12px;
    margin-bottom: calc(16px * 1.5);
    border: 2px solid #eceeef;
    border-radius: 4px;
  }
}

.my-activities-list-meta {
  font-size: 14px;
  color: rgba(84, 88, 90, 1);
}

@media (max-width: 767px) {
  .my-activities-list-meta {
    display: inline-block;
    margin-right: calc(12px / 2);
  }
  .my-activities-list-meta + .my-activities-list-meta:before {
    margin-right: calc(12px / 2);
    content: "\2022";
  }
}

.my-activities-list-title {
  font-weight: 400;
}

@media (max-width: 767px) {
  .my-activities-list-title {
    font-size: calc(16px * 1.25);
  }
}

@media (max-width: 767px) {
  .my-activities-list-icon {
    display: inline-block;
  }
}

@media (min-width: 768px) {
  .my-activities-list-icon {
    display: none;
  }
}

.request-table-toolbar {
  padding-top: 12px;
  padding-bottom: calc(12px / 2);
  margin-bottom: calc(16px * 1.5);
  background-color: 53;
  border-radius: 4px;
}

@media (min-width: 768px) {
  .request-table-toolbar {
    padding-top: calc(12px / 2);
    padding-bottom: 12px;
  }
}

.request-table-toolbar label {
  font-size: calc(16px * 0.75);
  text-transform: uppercase;
}

@media (min-width: 768px) {
  .request-table-filters {
    display: table;
    width: 100%;
  }
}

.request-table-filters-item {
  padding-right: 12px;
  padding-left: 12px;
}

@media (max-width: 767px) {
  .request-table-filters-item {
    margin-bottom: calc(16px * 1.5 / 2);
  }
}

@media (min-width: 768px) {
  .request-table-filters-item {
    display: table-cell;
    width: 33%;
    vertical-align: bottom;
  }
}

.request-table {
  display: table;
  width: 100%;
}

.request-table-col {
  display: table-cell;
  vertical-align: middle;
}

.request-table-col-main {
  width: 100%;
}

.request-table-col-button {
  padding-left: calc(12px / 2);
}

.request-table-col-button [role="button"] {
  height: calc(16px * 1.5 + 12px + 2px);
  padding-top: 0;
  padding-bottom: 0;
  line-height: calc(16px * 1.5 + 12px + 2px);
}

.requests-sort-symbol {
  display: inline-block;
  font-size: 0;
  vertical-align: middle;
}

.requests-sort-symbol:after {
  display: inline-block;
  margin-bottom: 2px;
  margin-left: 5px;
  font-family: "Font Awesome 5 Free";
  font-size: 14px;
  font-weight: 900;
  color: #979797;
  content: "\f0d7";
}

.requests-link {
  white-space: nowrap;
}

.requests-link[href*="asc"] .requests-sort-symbol:after {
  content: "\f0d8";
}

.request-container {
  margin-bottom: calc(16px * 1.5 * 2);
}

.request {
  position: relative;
}

.request-id {
  margin-bottom: calc(16px * 1.5 / 2);
  font-weight: 600;
}

.request-subject {
  font-size: calc(16px * 1.5);
}

@media (min-width: 992px) {
  .request-subject {
    font-size: calc(16px * 1.75);
    font-weight: 300;
  }
}

.request-follow-up:empty {
  display: none;
}

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

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

.request-col .comments {
  border-top: none;
}

.request-sidebar {
  padding: 10px 0;
  margin-bottom: calc(16px * 1.5);
  font-size: 14px;
  border-top: 1px solid rgba(84, 88, 90, 1);
  border-bottom: 1px solid rgba(84, 88, 90, 1);
  order: 0;
}

.request-sidebar .collapsible-sidebar-title {
  display: block;
  position: relative;
  font-weight: 700;
  font-size: 20px;
  margin: 10px 0;
}

.request-sidebar .collapsible-sidebar-title:after {
  position: absolute;
  font-family: fontAwesome;
  content: "\f107";
  right: 10px;
  transition: transform 0.3s ease-out;
}

.request-sidebar .collapsible-sidebar-title[aria-expanded="true"]:after {
  transform: rotate(-180deg);
}

@media (min-width: 769px) {
  .request-container {
    flex-direction: row;
  }
  .request-col {
    flex: 0 0 66%;
    order: 0;
    min-width: 0;
  }
  .request-col .comments {
    border-top: 1px solid rgba(84, 88, 90, 1);
  }
  .request-sidebar {
    flex: 0 0 auto;
    padding: calc(16px * 1.5) 12px;
    width: 30%;
    border: 1px solid rgba(84, 88, 90, 1);
    border-radius: 5px;
  }
  .request-sidebar .collapse {
    display: block;
  }
  .request-sidebar a[data-toggle="collapse"] {
    display: none;
  }
}

.request-sidebar dd {
  margin-bottom: calc(16px * 1.5 / 2);
}

.request-status-label {
  display: inline-block;
  padding: 1px calc(12px / 2);
  font-size: 12px;
  color: #fff;
  background-color: #038153;
  white-space: nowrap;
  border-radius: 5px;
}

.request-status-label-closed {
  background-color: #e9ebed;
  color: zass-#868b8e;
}

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

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

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

.request-container {
  margin-bottom: calc(16px * 1.5 * 2);
}

.request-title {
  font-size: calc(16px * 1.5);
}

@media (min-width: 768px) {
  .request-title {
    font-size: calc(16px * 1.75);
  }
}

@media (min-width: 992px) {
  .request-title {
    font-size: calc(16px * 2.5);
  }
}

.request-form {
  margin-bottom: calc(16px * 1.5);
}

.form-field {
  margin-bottom: 10px;
}

/* Inline form-validation errors.

   Zendesk renders these as
   <div class="notification notification-error notification-inline">
   under the field that failed, but this theme had no rule for any of those
   classes, so "Subject: cannot be blank" arrived as plain body text in the
   same colour and weight as the field labels above it - indistinguishable
   from the rest of the form at the exact moment a user needs to see it.

   Ported from Copenhagen, which styles the same three classes. Colours,
   border and icon are Copenhagen's; font-family and font-size are
   deliberately NOT taken, so the message inherits Proxima Nova rather than
   introducing a second typeface into the form.

   Scoped to .notification-inline only. Page-level .notification banners are
   left alone - they were not part of what was observed, and styling markup
   sight-unseen is how dormant rules get switched on by accident.

   VISUAL CHANGE - see PR description. Only the error state is affected;
   nothing changes while a form is being filled in normally. */
.notification-inline {
  border-radius: 4px;
  line-height: 1.4;
  margin-top: 5px;
  padding: 5px 8px;
  position: relative;
  text-align: left;
}

.notification-inline[aria-hidden="true"] {
  display: none;
}

.notification-inline.notification-error {
  background-color: #fff0f1;
  border: 1px solid #e35b66;
  color: #cc3340;
}

.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");
  background-size: cover;
  content: "";
  display: inline-block;
  height: 14px;
  width: 14px;
  margin: -2px 5px 0 0;
  vertical-align: middle;
}

.upload-dropzone {
  padding: calc(16px * 1.5) 16px;
  border-color: rgba(158, 162, 162, 1);
  border-width: 1px;
  border-radius: 4px;
  color: #55595c;
  background-color: #fff;
}

.upload-item .upload-remove {
  border: none;
  background: none;
}

.upload-item .notification-alert {
  display: none;
}

.upload-dropzone {
  font-size: calc(16px * 0.75);
}

.upload-dropzone a {
  font-size: calc(16px * 0.75);
}

.upload-pool {
  margin-top: calc(16px * 1.5);
  margin-bottom: calc(16px * 1.5);
}

/* DROPDOWN MENU */
.dropdown-toggle {
  cursor: pointer;
  background: none;
  border: 0;
  border: 1px solid rgba(81, 198, 111, 1);
  display: inline-block;
  padding: 5px 10px;
  text-align: initial;
  vertical-align: middle;
}

.dropdown-toggle:hover {
  text-decoration: none;
}

.dropdown-toggle > * {
  display: inline-block;
}

.dropdown-toggle:after {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-size: 10px;
  font-weight: 900;
  line-height: 1.5;
  color: inherit;
  content: "\f107";
}

[dir="ltr"] .dropdown-toggle:after {
  margin-left: 5px;
}

[dir="rtl"] .dropdown-toggle::after {
  margin-right: 5px;
}

.language-dropdown {
  border: 1px solid rgba(0, 168, 93, 1);
  margin-bottom: 20px;
  width: 100%;
}

@media (max-width: 768px) {
  .language-dropdown {
    padding-left: unset;
  }
}

.language-dropdown .dropdown-toggle {
  border: 0;
  width: 100%;
  text-align: center;
}

.language-dropdown .dropdown-toggle:after {
  content: "\f107";
}

[dir="ltr"] .language-dropdown .dropdown-toggle:after {
  margin-left: 5px;
}

[dir="rtl"] .language-dropdown .dropdown-toggle:after {
  margin-right: 5px;
}

.dropdown-menu[aria-expanded="true"] {
  display: block;
}

.dropdown-menu [role="menuitem"],
.dropdown-menu [role="menuitemradio"] {
  margin-bottom: 0px;
  margin-left: 0;
  /* padding: calc(16px * 1.5 / 2)
      12px; */
  padding: 8px 12px;
  white-space: normal;
  left: 20px;
}

.dropdown-menu [role="menuitemradio"][aria-checked="true"]:after {
  position: absolute;
  top: 16px;
  right: 12px;
  display: inline-block;
  margin-left: 10px !important;
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  content: "\f00c";
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

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

.dropdown-menu {
  background: #fff;
  border: 1px solid #d8d8d8;
  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;
  right: 0;
  margin-top: 1px;
  min-width: 170px;
  padding: 10px 10px;
  position: absolute;
  text-align: left;
  z-index: 1000;
}

[dir="rtl"] .dropdown-menu {
  text-align: right;
  right: unset;
  left: 0;
}

.dropdown-menu[aria-expanded="true"] {
  display: block;
}

[dir="ltr"] .dropdown-footer {
  left: 0;
  right: unset;
}

[dir="rtl"] .dropdown-footer {
  right: 0;
  left: unset;
}

.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"],
.dropdown-menu [role="menuitemradio"] {
  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%;
  outline: 0;
  font-size: inherit;
  font-weight: inherit;
  text-transform: none;
}

[dir="rtl"] .dropdown-menu [role="menuitem"],
[dir="rtl"] .dropdown-menu [role="menuitemradio"] {
  padding: 7px 20px 7px 40px;
}

.dropdown-menu [role="menuitem"]:hover,
.dropdown-menu [role="menuitem"]:focus,
.dropdown-menu [role="menuitemradio"]:hover,
.dropdown-menu [role="menuitemradio"]:focus {
  text-decoration: none;
  background: #efefef;
  box-shadow: none;
  color: black;
  border-radius: 0;
}

.dropdown-menu [role="menuitemradio"][aria-checked="true"] {
  cursor: default;
  width: 80%;
}

.dropdown-menu [role="menuitemradio"][aria-checked="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="menuitemradio"][aria-checked="true"]::after {
  margin-left: 0;
  margin-right: 10px;
  float: left;
}

.dropdown-menu [role="menuitem"][hidden],
.dropdown-menu [role="menuitem"][aria-hidden="true"],
.dropdown-menu [role="menuitemradio"][hidden],
.dropdown-menu [role="menuitemradio"][aria-hidden="true"] {
  display: none !important;
}

.dropdown-menu-end {
  left: auto;
  right: 0;
}

.dropdown-menu-top {
  bottom: 100%;
  margin-bottom: 15px;
}

.dropdown-menu-bottom {
  top: 100%;
  margin-top: 15px;
}

[dir="rtl"] .dropdown-menu {
  left: auto;
  right: 0;
  text-align: right;
}

[dir="rtl"] .dropdown-menu-end {
  left: 0;
  right: auto;
}

.btn-footer span {
  padding: 10px 50px;
}

/* END OF DROPDOWN */
.error-page {
  padding: 10%;
  text-align: center;
}

@media (max-width: 768px) {
  .error-page {
    margin: 100px auto;
  }
}

.error-page-title {
  color: rgba(84, 88, 90, 1);
  text-transform: capitalize;
  margin: 0 0 calc(16px * 1.5);
}

.note {
  position: relative;
  padding-left: 12px;
  margin: calc(16px * 1.5) 0;
  color: zass-#232425;
  border-left: calc(2px * 2) solid transparent;
  border-left: 2px solid #177ee6 !important;
  border: 1px solid #ccc;
  margin-bottom: 2rem;
  padding: 20px 15px 15px 15px;
}

.note p:last-child {
  margin-bottom: 0;
}

.note-title {
  margin-bottom: calc(16px * 1.5 / 2);
  font-weight: 600;
}

.note-default {
  border-color: #818a91;
}

.note-default {
  border-color: #818a91;
}

.note-default .note-title {
  color: #818a91;
}

.note-default .note-title {
  color: #818a91;
}

.pagination ul {
  display: inline-block;
  padding-left: 0;
  margin: 0 0 calc(16px * 1.5 / 2);
}

.pagination ul > li {
  display: inline-block;
  margin-right: 6px;
  margin-bottom: calc(16px * 1.5 / 2);
}

.pagination ul > li > a {
  position: relative;
  display: block;
  padding: calc(12px / 2) 16px;
  line-height: 1.5;
  color: zass-#bbbebf;
  text-decoration: none;
  background-color: rgba(255, 255, 255, 1);
  border: 1px solid #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
  border-radius: 4px;
}

.pagination ul > li > span {
  position: relative;
  display: block;
  padding: calc(12px / 2) 16px;
  line-height: 1.5;
  color: rgba(84, 88, 90, 1);
  text-decoration: none;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 4px;
  border: 1px solid #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
}

.pagination ul > li > a:hover {
  color: rgba(255, 255, 255, 1);
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
}

.pagination ul > li > a:focus {
  color: rgba(255, 255, 255, 1);
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
}

.pagination ul > li > span:hover {
  color: rgba(255, 255, 255, 1);
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
}

.pagination ul > li > span:focus {
  color: rgba(255, 255, 255, 1);
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
}

.pagination ul > .pagination-current > span,
.pagination ul > .pagination-current > span:hover,
.pagination ul > .pagination-current > span:focus {
  z-index: 2;
  color: rgba(84, 88, 90, 1);
  cursor: pointer;
  background-color: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
}

/* SCROLL TO TOP BUTTON */
.back-to-top {
  /* Deliberately NOT position: fixed. Floating it bottom-right overlapped the
     footer social icons; bottom-left would be worse, because .sidebar is
     position: relative with z-index 124 and occupies the left ~270px as a flex
     column, so a lower-z-index button would render behind it and vanish on
     desktop. Left inline in the footer instead, below the social row.
     Consequence: .is-active's bottom offset and the bottom transition below
     stay inert, as they have been for years. The button still works — its click
     handler is restored by the ga() fix in script.js, not by positioning. */
  z-index: 3;
  width: 35px;
  height: 35px;
  /* Sits above the copyright row in footer.hbs; keeps it off the text. */
  margin-bottom: 8px;
  font-size: 16px !important;
  color: #164237; /* Dark Green - the brand-approved green for text on White */
  padding: 4px 8px;
  cursor: pointer;
  text-align: center;
  border: 2px solid rgba(81, 198, 111, 1);
  border-radius: 4px;
  -webkit-transition: bottom 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), border-radius 1s ease-out;
  background: rgba(255, 255, 255, 1);
}

@media (max-width: 768px) {
  .back-to-top {
    /* width was 135px, which stretched the icon button into a wide bar.
       Harmless while it sat inline; very visible now that it floats. */
    width: 35px;
    height: 35px;
    font-size: 20px !important;
  }
}

.back-to-top:focus,
.back-to-top:active {
  outline: 0;
  color: #164237; /* Dark Green - the brand-approved green for text on White */
  background: rgba(255, 255, 255, 1);
  box-shadow: none;
}

.back-to-top.is-active {
  bottom: 90px;
  z-index: 99999999999999999;
}

.back-to-top:hover {
  color: #181818; /* Carbon - brand matrix pairs Accent Green with dark text, not white */
  background: rgba(81, 198, 111, 1);
  border-color: rgba(81, 198, 111, 1);
  box-shadow: none;
}

/* END OF SCROLL TO TOP */
.embed,
.embed-responsive {
  position: relative;
  z-index: 1;
  display: block;
  height: 0;
  padding: 0;
  padding-bottom: 56.25%;
  margin-bottom: 30px;
  overflow: hidden;
}

.embed img,
.embed-responsive img {
  width: 100%;
}

.embed iframe,
.embed embed,
.embed object,
.embed video,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.embed:focus,
.embed-responsive:focus {
  outline: none !important;
}

.embed-responsive-16by9 {
  padding-bottom: 56.25%;
}

.embed-responsive-4by3 {
  padding-bottom: 75%;
}

@-ms-viewport {
  width: device-width;
}

.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: block !important;
}

@media (max-width: 767px) {
  .visible-xs {
    display: block;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .visible-sm {
    display: block;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .visible-md {
    display: block;
  }
}

@media (min-width: -screen-lg) {
  .visible-lg {
    display: block;
  }
}

@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .hidden-sm {
    display: none !important;
  }
}

@media (min-width: 992px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}

@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

.visible-print {
  display: none !important;
}

@media print {
  .visible-print {
    display: block;
  }
}

.visible-print-block {
  display: none !important;
}

@media print {
  .visible-print-block {
    display: block !important;
  }
}

.visible-print-inline {
  display: none !important;
}

@media print {
  .visible-print-inline {
    display: inline !important;
  }
}

.visible-print-inline-block {
  display: none !important;
}

@media print {
  .visible-print-inline-block {
    display: inline-block !important;
  }
}

@media print {
  .hidden-print {
    display: none !important;
  }
}

.page-header {
  margin-bottom: calc(16px * 1.5);
}

.promoted-articles-side {
  margin-top: 20px;
  padding: 16px;
  font-size: calc(16px - 2px);
  border: 1px solid rgba(158, 162, 162, 1);
  border-radius: 4px;
}

.promoted-articles-side li {
  margin-bottom: 10px;
}

.promoted-articles h2,
.related-articles h2 {
  font-size: 16px;
  margin-top: 0;
  padding-bottom: 5px;
  margin-bottom: 5px;
  text-transform: uppercase;
  line-height: 28px;
  font-family: Proxima Nova, sans-serif; 
  font-weight: 700;
}

.recent-articles ul,
.related-articles ul {
  padding-left: 0;
  list-style: none;
}

.recent-articles h3 {
  font-size: calc(16px * 1.25);
}

.section-articles {
  margin-bottom: calc(16px * 1.5);
}

@media (max-width: 768px) {
  .section-articles {
    margin-bottom: unset;
  }
}

.section-articles-title {
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: calc(16px * 1.25);
}

.section-articles-list {
  padding-left: 0;
  list-style: none;
}

.section-articles-item {
  margin-bottom: calc(16px * 1.5 / 2);
}

.profile-header {
  display: flex;
  padding: calc(16px * 1.5) 15px;
  margin-bottom: calc(16px * 1.5);
  margin-top: 15px;
  color: rgba(84, 88, 90, 1);
  text-align: center;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 5px;
}

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

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

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

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

.profile-header-avatar img {
  width: 80px;
}

.profile-header-name {
  margin: 0;
  line-height: 25px;
  font-size: calc(16px * 1.5);
}

.profile-header-name a {
  color: rgba(84, 88, 90, 1);
}

@media (min-width: 768px) {
  .profile-header-name {
    font-size: calc(16px * 1.75);
    font-weight: 300;
  }
}

.profile-header-info {
  display: flex;
  flex-direction: column;
  word-break: break-word;
  justify-content: center;
  flex-grow: 1;
  flex-basis: 0px;
}

.profile-header-options {
  display: flex;
  flex-basis: 100%;
  margin-top: 2em;
  margin-bottom: 2em;
  align-self: flex-start;
  flex-wrap: wrap;
  justify-content: center;
}

@media (min-width: 768px) {
  .profile-header-options {
    flex-wrap: nowrap;
    flex-basis: auto;
    margin-top: 0;
    margin-left: 15px;
    justify-content: start;
  }
  [dir="rtl"] .profile-header-options {
    margin-right: 15px;
    margin-left: 0;
  }
}

.profile-header-private-badge {
  display: inline-block;
  margin-bottom: calc(16px * 1.5);
  background-color: rgba(255, 255, 255, 1);
}

.profile-header-description {
  word-break: break-all;
  word-break: break-word;
}

.profile-stats {
  margin-bottom: calc($font_size_base * 1.5 / 2);
  font-size: 0.9em;
  color: zass-#606567;
  list-style: none;
}

@media (max-width: 768px) {
  .profile-stats {
    display: flex;
    flex-direction: column;
  }
}

.profile-stats-container {
  display: flex;
  flex-direction: column;
}

@media (min-width: 769px) {
  .profile-stats-container {
    flex-basis: 100%;
  }
}

.profile-stats-counter {
  flex-direction: column;
  display: flex;
  flex: 1 0 200px;
  text-align: start;
  margin-top: 0;
  margin-bottom: 0;
}

.profile-stats-counter::before {
  display: none;
}

@media (min-width: 769px) {
  .profile-stats-counter {
    margin-left: 2em;
  }
  [dir="rtl"] .profile-stats-counter {
    margin-right: 2em;
    margin-left: 0;
  }
  .profile-stats-counter .profile-stats-stat::before {
    display: none;
  }
}

.profile-stats-stat {
  margin-right: 12px;
  margin-bottom: calc(16px * 1.5 / 4);
}

@media (max-width: 768px) {
  .profile-stats-stat {
    display: flex;
    width: 250px;
  }
  .profile-stats-stat:before {
    display: none;
  }
}

.profile-stats-label {
  margin-right: calc(12px / 2);
}

.profile-stats-value {
  color: rgba(84, 88, 90, 1);
}

@media (max-width: 768px) {
  .profile-stats-label {
    display: flex;
    width: 50%;
  }
}

.profile-badges-items {
  margin-top: 25px;
}

.profile-badges-item {
  border-top: 1px solid #ddd;
  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;
}

[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: zass-#868b8e;
  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;
}

.profile-nav {
  margin-bottom: calc(16px * 1.5);
  overflow: hidden;
  font-size: 16px;
  font-weight: 600;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 5px;
}

.profile-nav-items {
  padding-left: 0;
  margin: 0;
  list-style: none;
}

.profile-nav-item {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .profile-nav-item {
    display: inline-block;
    vertical-align: middle;
  }
}

.profile-nav-item a {
  display: block;
  color: rgba(84, 88, 90, 1);
}

.profile-nav-item.is-active {
  color: rgba(5, 5, 5, 1);
  background-color: rgba(255, 255, 255, 1);
}

.profile-nav-item.is-active {
  padding: calc(16px * 1.5 / 1.5) 12px;
  line-height: 1;
}

.profile-nav-item a {
  padding: calc(16px * 1.5 / 1.5) 12px;
  line-height: 1;
}

.profile-nav-item:after {
  right: 12px !important;
}

.profile-section {
  width: 100%;
}

.profile-section-header {
  margin-bottom: calc(16px * 1.5);
}

.profile-section-title {
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: calc(16px * 1.5);
}

.profile-section-description {
  font-size: calc(16px * 0.75);
  color: zass-#868b8e;
}

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

.profile-section-sorter {
  font-size: calc(16px * 0.75);
}

.profile-section-sorter .dropdown {
  display: inline-block;
}

@media (min-width: 768px) {
  .profile-section-sorter {
    display: table;
    width: 100%;
  }
}

@media (min-width: 768px) {
  .profile-section-sorter {
    padding-top: 0;
    border-top: 0;
  }
}

@media (min-width: 768px) {
  .profile-section-sorter-col {
    display: table-cell;
    vertical-align: middle;
  }
}

@media (max-width: 767px) {
  .profile-section-sorter-col-main {
    margin-bottom: calc(16px * 1.5 / 2);
  }
}

@media (min-width: 768px) {
  .profile-section-sorter-col-main {
    padding-right: 12px;
  }
}

@media (min-width: 768px) {
  .profile-section-sorter-col-btn {
    text-align: right;
  }
}

.profile-contribution {
  position: relative;
  padding: calc(16px * 1.5 / 2) 15px;
  word-wrap: break-word;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 5px;
}

.profile-contribution-header {
  margin-bottom: calc(16px * 1.5 / 4);
}

.profile-contribution-status {
  margin-bottom: calc(16px * 1.5 / 4);
}

.profile-contribution-title {
  margin-bottom: calc(16px * 1.5 / 4);
  font-size: 16px;
  font-weight: 600;
}

.profile-contribution-body {
  margin-bottom: calc(16px * 1.5 / 2);
}

.profile-contribution-list .profile-contribution-title:before {
  display: inline-block;
  margin-right: 2px;
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.profile-contribution-breadcrumbs {
  padding: 0;
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: calc(16px * 0.75);
}

.profile-no-activity {
  color: zass-#bbbebf;
  text-align: center;
}

.profile-private-activity {
  color: zass-#bbbebf;
  text-align: center;
}

.profile-activity-list {
  padding-left: 0;
  list-style: none;
}

.profile-activity {
  position: relative;
  margin-bottom: calc(16px * 1.5 * 1.5);
}

.profile-activity-header {
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: calc(16px * 0.75);
  font-weight: 600;
}

.profile-activity-header:before {
  display: inline-block;
  margin-right: 2px;
  font-family: "Font Awesome 5 Free";
  font-style: normal;
  font-weight: 900;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.profile-activity-avatar {
  width: 30px;
  height: 30px;
  margin-right: calc(12px / 2);
}

.profile-activity-list-articles .profile-contribution-title:before,
.profile-activity[class$="-article"] .profile-activity-header:before {
  content: "\f15c";
}

.profile-activity-list-posts .profile-contribution-title:before,
.profile-activity[class$="-post"] .profile-activity-header:before {
  content: "\f086";
}

.profile-activity-list-comments .profile-contribution-title:before,
.profile-activity[class$="-comment"] .profile-activity-header:before {
  font-weight: 400;
  content: "\f075";
}

.meta-info {
  display: -webkit-box;
  display: flex;
  font-size: calc(16px * 0.75);
}

.meta-info-avatar {
  padding-right: 12px;
}

.status-label {
  padding: 2px calc(12px / 2);
  font-size: 12px;
  color: rgba(84, 88, 90, 1);
  border-radius: 4px;
}

.status-label-with-ticket:hover,
.status-label-with-ticket:focus,
.status-label-with-ticket:active {
  color: #fff;
}

.status-label-not-planned {
  color: rgba(84, 88, 90, 1);
  background-color: #eceeef;
}

.attachment-list {
  padding-left: 0;
  margin: 0;
  font-size: calc(16px * 0.75);
  list-style: none;
}

.attachment-items {
  position: relative;
  padding-left: calc(12px * 1.5);
  margin-bottom: calc(16px * 1.5 / 2);
}

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

.promoted-articles-list {
  display: -webkit-box;
  display: flex;
  padding-left: 0;
  list-style: none;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  flex-flow: row wrap;
}

.promoted-articles-title {
  font-weight: 400;
}

.promoted-articles-item-title {
  display: block;
  margin-bottom: calc(16px * 1.5 / 4);
  font-size: calc(16px * 1);
}

.list-colored,
.list-bullet {
  padding-left: 0 !important;
  list-style-type: none;
  counter-reset: list;
}

.list-colored li {
  position: relative;
  padding-left: calc(30px + 12px);
  margin-bottom: calc(16px * 1.5 / 1.5) !important;
  counter-increment: list;
}

.list-colored li:before {
  position: absolute;
  top: -3px;
  left: 0;
  z-index: 1;
  width: 30px;
  height: 30px;
  font-size: calc(16px * 0.75);
  line-height: 30px;
  color: #fff;
  text-align: center;
  content: counter(list);
  border-radius: 50%;
}

.list-colored ol {
  margin-bottom: 14px;
  list-style-type: none;
  counter-reset: list;
}

.list-bullet li {
  position: relative;
  padding-left: 30px;
  margin-bottom: 10px;
}

.list-bullet li:before {
  position: absolute;
  top: -3px;
  left: 0;
  width: auto;
  height: auto;
  font-family: "Font Awesome 5 Free";
  font-size: 20px;
  font-style: normal;
  font-weight: 400;
  content: "\f058";
  background-color: transparent;
}

.list-bullet ul {
  margin-bottom: 14px;
  list-style: none;
}

.hidden {
  display: none;
}

/* Community */
.community-nav-item {
  float: left;
}

.community-nav-item + .community-nav-item {
  margin-left: 12px;
}

.community-nav-item.is-active {
  font-weight: 600;
}

.community-nav-item-button {
  float: right;
}

.vote {
  display: flex;
  justify-content: center;
}

.vote [aria-selected="true"] {
  z-index: 2;
}

[dir="ltr"] .vote-down {
  margin-right: 5px;
}

[dir="rtl"] .vote-down {
  margin-left: 5px;
}

.vote-sum {
  display: block;
  font-weight: 600;
  text-align: center;
}

.vote-wrapper {
  display: flex;
  justify-content: flex-end;
}

.vote-control {
  position: relative;
  z-index: 1;
  display: block !important;
  font-size: 16px !important;
  line-height: 1.5 !important;
  border-color: #164237; /* Dark Green - .btn gives these a real border and there is no fill, so this outline IS the boundary: was 2.17:1 against the 3:1 floor */
}

.vote-control:hover,
.vote-control:active {
  z-index: 2;
}

.vote-control-active {
  border-color: #474747;
}

/* COMMUNITY TOPIC PAGES */
.topic-list-item:nth-child(2n + 1) {
  clear: left;
}

.topic-list-item-box {
  padding: calc(16px * 1.5) 12px;
  margin-bottom: calc(16px * 1.5);
  border: 2px solid #eceeef;
  border-radius: 4px;
}

.topic-list-item-title {
  margin-bottom: calc(16px * 1.5 / 2);
}

.topic-list-item-meta {
  color: rgba(84, 88, 90, 1) !important;
}

.topic {
  display: table;
  width: 100%;
  padding-bottom: calc(16px * 1.5 / 2);
  margin-bottom: calc(16px * 1.5);
  border-bottom: 2px solid #eceeef;
}

.topic-col {
  display: table-cell;
  vertical-align: inherit;
}

@media (min-width: 480px) {
  .topic-col {
    vertical-align: top;
  }
}

.topic-col-new-post {
  text-align: right;
}

.topic-title {
  width: 100%;
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: calc(16px * 1.75);
}

[dir="ltr"] .topic-filters-item {
  float: left;
  margin-right: 20px;
}

[dir="rtl"] .topic-filters-item {
  float: right;
  margin-right: 20px;
}

.topic-filters-item {
  margin-bottom: calc(16px * 1.5 / 2);
}

.topic-menu {
  margin-bottom: calc(16px * 1.5 * 2);
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  flex-direction: column;
}

@media (max-width: 767px) {
  .topic-menu {
    flex-direction: column;
  }
}

[dir="ltr"] .topic-menu-item {
  float: left;
}

[dir="rtl"] .topic-menu-item {
  float: right;
}

@media (min-width: 768px) {
  [dir="ltr"] .topic-menu-item-subscribe {
    float: right;
    text-align: right;
    white-space: nowrap;
  }
  [dir="rtl"] .topic-menu-item-subscribe {
    float: left;
    text-align: left;
    white-space: nowrap;
  }
}

.topic-menu-item-subscribe .dropdown {
  display: inline-block;
  vertical-align: middle;
}

.topic-menu-item-subscribe .dropdown-menu {
  right: 0;
  left: initial;
}

/* END OF COMMUNITY TOPIC PAGES */
/* COMMUNITY POST PAGES */
.post-container,
.post-list-container,
.topic-list-container,
.topic-container,
.content-card {
  background-color: rgba(255, 255, 255, 1);
  width: 100%;
  border-radius: 8px;
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12);
  padding: 20px 30px;
}

.post {
  position: relative;
  margin-bottom: calc(16px * 1.5);
}

.post-title {
  padding-right: calc(12px * 1.5);
}

.post-meta {
  display: table;
  width: 100%;
  margin-bottom: calc(16px * 1.5);
}

.post-meta-col {
  display: table-cell;
  vertical-align: top;
}

.post-meta-col-main {
  width: 100%;
}

.post-text {
  word-wrap: break-word;
}

@media (max-width: 768px) {
  .post_body {
    padding-right: 0;
  }
}

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

.post-body ul,
.post-body ol {
  padding-left: 20px;
}

.post-body ul ul {
  margin-top: calc(16px * 1.5 / 2);
}

.post-body ul ol {
  margin-top: calc(16px * 1.5 / 2);
}

.post-body ol ul {
  margin-top: calc(16px * 1.5 / 2);
}

.post-body ol ol {
  margin-top: calc(16px * 1.5 / 2);
}

.post-body ul li {
  margin-bottom: calc(16px * 1.5 / 2);
}

.post-body ol li {
  margin-bottom: calc(16px * 1.5 / 2);
}

.post-voting-and-actions {
  position: relative;
  display: flex;
  align-items: center;
}

.post-voting-and-actions .dropdown-toggle {
  font-size: 0;
}

.post-voting-and-actions .dropdown-toggle:after {
  margin-left: 0;
  font-size: 16px;
  content: "\f013";
}

[dir="ltr"] .post-actions {
  margin-left: 1em;
}

[dir="rtl"] .post-actions {
  margin-right: 1em;
}

.post-actions .dropdown-menu {
  width: auto;
}

.post-actions .dropdown-menu [role="menuitem"],
.post-actions .dropdown-menu [role="menuitemradio"] {
  white-space: nowrap;
}

.post-suggest {
  padding: calc(16px * 1.5 / 2) 15px;
  background-color: rgba(255, 255, 255, 1);
  border-radius: 4px;
}

.site-icon svg,
.site-icon img {
  max-width: 100px;
  width: calc(53 * 1px);
  height: auto;
}

@media (max-width: 767px) {
  .post-suggest {
    margin-bottom: 25px;
  }
}

.post-suggest-title {
  font-size: calc(16px * 1.1);
  font-weight: 600;
  color: rgba(84, 88, 90, 1);
  margin-bottom: 0;
}

.post-list-item {
  padding-bottom: calc(16px * 1.5);
  margin-bottom: calc(16px * 1.5);
  border-bottom: 2px solid #eceeef;
}

@media (min-width: 768px) {
  .post-list-item {
    display: table;
    width: 100%;
  }
}

.post-list-item-title {
  margin-bottom: calc(16px * 1.5 / 2);
  font-size: calc(16px * 1.5);
}

.post-list-item-title .fa-star {
  position: relative;
  top: -4px;
  font-size: 50%;
}

@media (min-width: 768px) {
  .post-list-item-col {
    display: table-cell;
    vertical-align: top;
  }
}

@media (min-width: 768px) {
  .post-list-item-col-main {
    width: 60%;
  }
}

@media (min-width: 768px) {
  .post-list-item-col-side {
    width: 40%;
    text-align: right;
  }
}

.post-info {
  font-size: 14px;
  color: rgba(84, 88, 90, 1);
}

@media (min-width: 768px) {
  .post-info {
    float: right;
    min-width: 90px;
    padding: calc(12px / 2) 12px;
    text-align: center;
    background-color: rgba(255, 255, 255, 1);
    border-radius: 4px;
  }
}

@media (min-width: 768px) {
  .post-info-count {
    display: block;
    font-weight: 600;
    color: rgba(84, 88, 90, 1);
  }
}

.post-info + .post-info {
  margin-right: 12px;
}

@media (max-width: 767px) {
  .post-info + .post-info:before {
    margin-right: calc(12px / 2);
    font-size: 10px;
    content: "\2022";
  }
}

.post-status-label {
  display: inline-block;
  padding: 1px calc(12px / 2);
  font-size: 12px;
  color: #fff;
  border-radius: 4px;
}

.post-status-label-not-planned {
  color: rgba(84, 88, 90, 1);
  background-color: #eceeef;
}

@media (min-width: 768px) {
  .new-post-container {
    margin-top: 30px;
    margin-bottom: calc(16px * 1.5 * 2);
  }
}

.post-title {
  font-size: calc(16px * 1.5);
}

@media (min-width: 768px) {
  .post-title {
    font-size: calc(16px * 1.75);
  }
}

@media (min-width: 992px) {
  .post-title {
    font-size: calc(16px * 2.5);
  }
}

.post-form {
  margin-bottom: calc(16px * 1.5);
}

/* END OF COMMUNITY POST PAGES */
.header-col.header-menu {
  justify-content: flex-end;
  align-items: center;
}

.searchbar-top {
  width: 70%;
}

@media (max-width: 1024px) {
  .site-wrapper {
    margin-left: 0;
  }
  .searchbar-top {
    display: none;
  }
}

.site-wrapper:after {
  clear: both;
}

/* solafid */
/* CUSTOM BLOCK */
.site-block {
  width: 31%;
  flex-grow: 1;
  margin: 0 15px 30px 15px;
  background-color: rgba(255, 255, 255, 1);
  transition: all 0.4s;
  box-shadow: 2px 2px 8px 2px rgba(20, 23, 26, 0.1);
}

[dir="ltr"] .site-block {
  text-align: left;
}

[dir="rtl"] .site-block {
  text-align: right;
}

.site-div {
  background: 53;
  border-radius: 6px;
  padding: 25px 20px;
  display: flex;
  height: 100%;
}

.site-block:hover {
  box-shadow: 0px 8px 12px rgba(79, 86, 107, 1);
  -webkit-transform: translateY(-4px);
  transform: translateY(-4px);
}

.site-icon {
  width: auto;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  margin: auto 0;
  font-size: 50px;
  transition: all 0.2s;
}

.site-div:hover > .site-icon {
  transform: scale(1.1);
}

.site-icon:before {
  position: absolute;
  width: 45px;
  height: 45px;
  content: "";
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-repeat: no-repeat;
  background-size: cover !important;
}

[dir="ltr"] .site-block-text {
  margin-left: 30px;
}

[dir="rtl"] .site-block-text {
  margin-right: 30px;
}

.site-div span {
  color: #00857e;
  font-size: 16px;
}

.site-div p {
  color: rgba(84, 88, 90, 1);
  letter-spacing: 0.25px;
  line-height: 22px;
}

.site-block h4 {
  font-size: 24px;
  line-height: 28px;
  color: rgba(84, 88, 90, 1);
  margin-bottom: 15px;
  font-family: Proxima Nova, sans-serif; 
  font-weight: 700;
}

/* END OF CUSTOM BLOCK */
.light-background {
  background: rgba(255, 255, 255, 1);
  display: block;
  height: auto;
}

aside.site-sidebar ul,
.site-body ul,
.site-related ul {
  padding: 0;
  margin: 0;
}


/*.article-body ul, .article-body ol {
  padding-inline-start: 40px;
  margin-block-start: 1em;
}*/

.article-body ul {
  list-style: outside;
}

.article-body ol {
  list-style: decimal;
}

.content-sub-menu {
  border-left: 1px solid white;
}

aside.site-sidebar ul li,
.site-related ul li {
  list-style: none;
}

aside.site-sidebar.light-background::before {
  width: 80%;
  height: 100%;
  left: 100%;
  content: "";
  top: 0;
  position: absolute;
}

aside.site-sidebar.light-background {
  position: relative;
  height: 100%;
  padding-left: 30px;
  z-index: 99;
  background: unset;
}

.py-6 {
  padding-bottom: 20px;
  margin-top: 15px;
}

.site-header h1 {
  font-family:  Proxima Nova, sans-serif;  
  font-size: 26px;
  margin: 0;
  margin-bottom: 10px;
}

.site-body li a:hover {
  text-decoration: none;
  color: rgba(5, 5, 5, 1);
}

.site-primary {
  padding-top: 15px;
}

.d-flex {
  display: flex;
  flex-wrap: wrap;
}

.site-sidebar.site-article li a {
  font-size: 16px;
}

.category-block {
  width: 100%;
  margin-bottom: 60px;
  margin-right: auto;
  margin-left: auto;
}

.category-block h4 {
  font-size: 20px !important;
}

.container.category-container.py-6 {
  padding-bottom: 120px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family:  Proxima Nova, sans-serif;
  color: $body_color;
}



.quick-block {
  border-top: 8px solid rgba(81, 198, 111, 1);
  z-index: 100;
  display: block;
  position: absolute;
  top: 70px;
  left: 0;
  width: 100%;
  background-color: rgba(255, 255, 255, 1);
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.25);
}

@media (min-width: 1025px) {
  .quick-block {
    display: block;
    position: absolute;
    border: none;
    width: 20%;
    height: 70%;
    top: 100px;
    right: 40px;
    left: unset;
    padding: 10px 0;
    box-shadow: none;
    background-color: unset;
  }
}

#toc-mobile {
  display: none;
}

.toc-mobile-link {
  display: none;
  width: 100%;
  padding-left: 15px;
  padding-right: 15px;
}

.toc-mobile-link > span {
  width: 100%;
}

.toc-mobile-link > .fa {
  position: relative;
  display: flex;
  height: 10%;
  margin: 7px 0 0;
}

.toc-mobile-link > .fa:before {
  content: "\f107";
}

@media (max-width: 1024px) {
  #toc-mobile {
    border-top: 8px solid rgba(81, 198, 111, 1);
    z-index: 100;
    display: block;
    top: 70px;
    left: 0;
    width: 100%;
    height: 52px;
    background-color: rgba(255, 255, 255, 1);
  }
  .toc-mobile-link {
    display: flex;
  }
  #toc-mobile h3 {
    margin: 0;
    padding: 5px 20px;
    border-bottom: 1px solid rgba(158, 162, 162, 1);
  }
}

.toc-wrapper {
  padding: 10px;
  max-height: 60vh;
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12);
  border-top: 8px solid rgba(81, 198, 111, 1);
  background-color: rgba(255, 255, 255, 1);
  border-radius: 8px;
}

.toc-wrapper::-webkit-scrollbar {
  width: 5px;
}

.toc-wrapper::-webkit-scrollbar-thumb {
  background-color: rgba(84, 88, 90, 1);
}

.toc-wrapper::-webkit-scrollbar-thumb:hover {
  background-color: rgba(84, 88, 90, 1);
}

@media (max-width: 1024px) {
  .toc-wrapper.mobile {
    border-radius: unset;
    overflow-y: scroll;
    box-shadow: unset;
    border-top: unset;
    border-bottom: 1px solid rgba(158, 162, 162, 1);
    list-style: none;
    padding: 10px 20px;
  }
}

.toc-wrapper.mobile li {
  margin-bottom: 8px;
}

.quick-block h6 {
  text-transform: uppercase;
  font-size: 16px;
  margin: 0 0 10px;
  font-family: Proxima Nova, sans-serif; 
  font-weight: bold;
}

.quick-block ul {
  margin: 0;
}

.quick-block li a {
  font-size: 14px;
  margin-top: 6px;
  display: flex;
  padding-right: 5px;
  color: $body_color;
}

.quick-block li a.is-active {
  color: rgba(5, 5, 5, 1);
}

.quick-block ul {
  overflow-y: scroll;
}

.quick-block li a::before {
  content: "• ";
  color: rgba(84, 88, 90, 1);
  margin-right: 5px;
}

.quick-block li a:hover {
  text-decoration: none;
}

.site-footer {
  text-align: left;
  justify-content: flex-start;
  margin: 20px 0 40px;
  display: flex;
}

.site-footer-vote {
  display: flex;
  flex-direction: row;
}

@media (max-width: 480px) {
  .site-footer-vote {
    flex-direction: column;
  }
  .site-vote {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
}

[dir="ltr"] .site-vote {
  margin-left: 5px;
}

[dir="rtl"] .site-vote {
  margin-right: 5px;
}

.site-footer li {
  list-style: none;
  display: flex;
  font-weight: 300;
}

.site-footer h3 {
  margin: 0;
  font-weight: 400;
  margin-bottom: 10px;
  font-size: 14px;
  float: left;
}

.site-footer h3 a {
  color: rgba(84, 88, 90, 1);
  text-decoration: underline;
}

.site-footer h3 a:hover {
  text-decoration: underline;
  color: rgba(5, 5, 5, 1);
}

.site-footer span {
  font-size: 14px;
}

.site-footer p {
  justify-content: center;
  display: flex;
}

[dir="ltr"] .article-subscribe {
  margin-left: 10px;
}

[dir="rtl"] .article-subscribe {
  margin-right: 10px;
}

.site-related {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  position: relative;
  justify-content: space-between;
}

.related-articles {
  flex-basis: 50%;
  order: 2;
  padding-left: 5px;
}

.promoted-articles {
  flex-basis: 50%;
  padding-right: 5px;
}

.promoted-articles_homepage {
  padding: 20px 0;
  width: 100%;
  border-radius: 8px;
}

.promoted-articles_homepage h3 {
  padding-bottom: 5px;
  border-bottom: 1px solid rgba(158, 162, 162, 1);
  color: rgba(84, 88, 90, 1);
}

.promoted-articles_homepage h3 > .fas {
  margin-right: 5px;
  font-size: 21px;
}

.promoted-articles_homepage > ul > li {
  width: 50%;
  padding: 0 10px 10px 0;
}

@media (max-width: 768px) {
  .promoted-articles_homepage > ul > li {
    width: 100%;
    padding-right: 0;
  }
}

.promoted-articles_homepage > ul > li > a {
  margin-bottom: 5px;
}

.promoted-articles_homepage > ul > li > p {
  color: rgba(84, 88, 90, 1);
}

@media (max-width: 480px) {
  .related-articles,
  .promoted-articles {
    padding-top: 30px;
  }
  .related-articles h2,
  .promoted-articles h2 {
    display: flex;
    justify-content: flex-start;
  }
  .site-related {
    flex-direction: column;
  }
}

.site-related:before {
  left: auto;
  right: 100%;
  width: 200px;
}

.site-related.py-6 .row {
  overflow: hidden;
}

.site-related h4 {
  text-transform: uppercase;
  margin-bottom: 15px;
}

.site-related li a:hover,
.related-articles li a:hover {
  color: rgba(5, 5, 5, 1);
}

.site-related li a,
.related-articles li a {
  font-size: 14px;
  line-height: 24px;
  margin-top: 7px;
  display: block;
}

em {
  /*color: rgba(70, 103, 177, 1);*/
}

.category-container,
.section-page {
  background-color: rgba(255, 255, 255, 1);
  overflow: hidden;
  width: 100%;
  border-radius: 8px;
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12);
  padding: 0 30px;
  z-index: 1;
}

.article-page {
  background-color: rgba(255, 255, 255, 1);
  width: 75%;
  border-radius: 8px;
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12);
  padding: 0 35px;
}

@media only screen and (min-width: 1920px) {
  .article-page {
   width: 60%;
}
}

.container-card {
  padding: 40px;
}

@media (max-width: 768px) {
  .container-card {
    padding: 40px 20px;
  }
}

@media (max-width: 1024px) {
  .category-container,
  .article-page,
  .section-page {
    width: 100%;
  }
}

/* Header controller */
.header-controls {
  display: flex;
  width: 100%;
  justify-content: space-between;
  align-items: center;
}

.header-controls a {
  margin-left: 23px;
}

.header-controls a:hover {
  color: rgba(169, 169, 169, 1);
}

.user-info {
  position: relative;
  display: block;
}

.user-info_sidebar {
  display: none;
}

.user-info_sidebar > button span::after {
  display: none !important;
}

.user-info > .dropdown-toggle > span {
  font-size: 12px;
}

.user-info > button,
.sign-in {
  border-radius: 5px;
  border: 1px solid rgba(169, 169, 169, 1);
  background-color: transparent;
  outline: none;
  padding: 7px 5px;
  white-space: nowrap;
  text-transform: none;
  transition: all 0.3s ease;
}

[dir="ltr"] .user-info > button, [dir="ltr"]
.sign-in {
  margin-left: 23px;
}

[dir="rtl"] .user-info > button, [dir="rtl"]
.sign-in {
  margin-right: 23px;
}

.user-info > button:hover,
.user-info > button:focus {
  border: 1px solid rgba(169, 169, 169, 1);
  color: rgba(70, 103, 177, 1);
  background-color: transparent;
}

.sign-in:hover,
.sign-in:focus {
  color: rgba(255, 255, 255, 1) !important;
  background-color: rgba(169, 169, 169, 1);
}

.user-info > button::after {
  display: none;
}

.user-info > button > span::after {
  display: inline-block;
  font-family: "Font Awesome 5 Free";
  font-size: 10px;
  font-weight: 900;
  line-height: 1.5;
  content: "\f107";
  color: rgba(42, 47, 69, 1);
}

[dir="ltr"] .user-info > button > span::after {
  padding-right: 5px;
}

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

@media (max-width: 1024px) {
  .user-info,
  .sign-in {
    display: none;
  }
  .dropdown-sidebar {
    left: 50px;
  }
  .sign-in_sidebar {
    border-radius: 5px;
    border: 1px solid #164237; /* Dark Green for consistency, but INERT today - this rule lives inside max-width:1024px where the .user-info_sidebar child rule below sets border 0 with !important and wins. Kept correct in case that is ever lifted; do not restore the border without design agreement. */
    background-color: transparent;
    outline: none;
    padding: 7px 5px;
    white-space: nowrap;
    text-transform: none;
    margin-left: 23px;
    transition: all 0.3s ease;
  }
  .user-info_sidebar {
    display: block;
    height: 100%;
    padding: 10px 0;
  }
  .user-info_sidebar > button,
  .user-info_sidebar > a {
    margin-left: 0 !important;
    margin-top: 15px;
    border: 0 !important;
    padding: 0 !important;
  }
  .user-info_sidebar > button:hover,
  .user-info_sidebar > a:hover,
  .user-info_sidebar > button:hover > span,
  .user-info_sidebar > button > span:hover {
    color: rgba(0, 168, 93, 1) !important;
    outline: 0;
    box-shadow: unset !important;
    background-color: unset;
  }
  .user-info_sidebar img {
    width: 30px !important;
  }
  [dir="ltr"] .user-info_sidebar img {
    margin-right: 5px;
  }
  [dir="rtl"] .user-info_sidebar img {
    margin-left: 5px;
  }
  .user-info_sidebar > button::after {
    color: rgba(0, 168, 93, 1);
  }
  .user-info_sidebar > .dropdown-toggle > span {
    font-size: 16px;
  }
  .user-info_sidebar > button:after {
    margin-left: 5px;
  }
}

.dropdown-header {
  margin-left: 23px;
}

@media (max-width: 1025px) {
  .dropdown-header {
    margin-left: 0;
  }
}

.user-info img {
  width: 20px;
}

.dropdown-toggle {
  background: none;
}

.dropdown-toggle.btn-default {
  background: rgba(81, 198, 111, 1);
}

@media (max-width: 1025px) {
  .hc-name {
    display: none;
  }
}

/* END OF Header controller */
.site-body ul,
.site-body ol {
  margin-bottom: 0 0 calc((16px * 1.5) * 0.8);
}

.site-body ul li,
.site-body ol li {
  margin-bottom: 0 0 calc((16px * 1.5) * 0.8);
}

/* Article body */
.article-body {
  padding-top: 40px;
  border-top: 1px solid rgba(158, 162, 162, 1);
  border-bottom: 1px solid rgba(158, 162, 162, 1);
  word-wrap: break-word;
}

/* Contain floated content (e.g. an image floated beside text) so it cannot
   overflow the body it sits in. Mirrors the same fix Zendesk applied to the
   Copenhagen reference theme. VISUAL CHANGE - see PR description. */
.article-body,
.post-body,
.comment-body {
  display: flow-root;
}

.article-body iframe {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 768px) {
  .article-body iframe {
    width: 100%;
    height: calc(100vw / 1.77);
  }
}

.article-body li {
  padding-left: 0px;
  list-style-position: outside;
  margin: 0px 0 20px 20px;
}

.article-body img {
  padding-top: 15px;
  cursor: pointer;
}

@media (max-width: 1024px) {
  .article-body img {
    pointer-events: none;
  }
}

.article-body pre {
  background: zass-#f7f7f7;
  border: 1px solid #ddd;
  border-radius: 3px;
  padding: 10px 15px;
  overflow: auto;
  font-size: 12px;
  white-space: pre;
  margin: 0px 25px;
  background-color: #f5f5f5;
}

<div class="article-body">
  <pre id="codeSnippet">
    <!-- Your code goes here -->
  </pre>
  <button id="copyButton">Copy</button>
</div>

.quick-block ul li {
  margin: 0;
}

.category-block ul {
  padding: 0;
  margin: 0;
}

/* Article comments CSS */
.article-author {
  display: flex;
  justify-content: space-between;
  flex-direction: row;
  padding-top: 5px;
}

.article-author ul {
  list-style: none;
}

[dir="ltr"] .article-author img {
  margin-right: 20px;
}

[dir="rtl"] .article-author img {
  margin-left: 20px;
}

@media (max-width: 480px) {
  .article-author {
    flex-direction: column;
  }
}

.meta-group {
  font-size: calc(16px - 3px);
}

.comment {
  list-style: none;
  word-break: break-word;
}

.comments {
  padding-top: 40px;
  border-top: 1px solid rgba(158, 162, 162, 1);
}

.comment-heading {
  margin-bottom: 5px;
}

@media (max-width: 767px) {
  .comment-form .comment-avatar {
    display: none;
  }
}

.comment-avatar {
  margin-right: 10px;
  list-style: none;
  margin-bottom: auto;
}

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

.comment-container {
  width: 100%;
}

.comment-form-controls {
  margin-top: 10px;
}

.comment-callout {
  color: zass-#868b8e;
  font-size: 14px;
}

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

.comment-author ul {
  list-style: none;
}

.comment-meta {
  vertical-align: middle;
  margin-right: 10px;
}

.comment-badge img {
  width: 20px;
  height: 20px;
}

.comment-sorter button {
  outline: none;
  border: 1px solid #164237; /* Dark Green - outline border IS the component boundary; Accent Green was 2.17:1 vs WCAG 1.4.11's 3:1 */
  padding: 2px 15px;
  color: #164237; /* Dark Green - the brand-approved green for text on White */
}

.comment-sorter button > svg {
  display: none;
}

.comment-sorter button:focus,
.comment-sorter button:hover {
  border-color: rgba(5, 5, 5, 1);
  color: rgba(255, 255, 255, 1);
}

[dir="rtl"] .comment-sorter .dropdown-menu {
  left: 0;
  right: unset;
}

[dir="ltr"] .comment-sorter .dropdown-menu {
  right: 0;
  left: unset;
}

.comment-actions-container {
  width: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
}

.comment-vote {
  width: auto;
  padding-right: 10px;
  display: flex;
  max-width: none;
}

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

.vote-sum {
  margin: 0 10px;
}

.comment-actions.actions span {
  padding: 0 15px;
}

/* End of Article comments */
.category-block ul li {
  list-style-position: outside;
  margin-left: 20px;
}

.category-block ul li a:hover {
  font-weight: normal;
}

.site-sidebar ul ul li a {
  padding-left: 10px;
}

.site-body p a {
text-decoration-line: none;
text-decoration-style: initial;
  color: rgba(70, 103, 177, 1);
}

.site-body p a:hover {
  text-decoration: none;
  color: rgba(5, 5, 5, 1);
}

.searchbar-top-mobile {
  display: none;
}

.searchbar-top-mobile .search:before {
  color: #ccc;
}

form.search input {
  height: 32px;
  line-height: 48px;
}

.category-block .all-article {
  font-size: 20px;
  font-style: italic;
  margin-left: 20px;
  color: zass-lighten rgba(70, 103, 177, 1), 10%;
}

.category-block a:hover {
  text-decoration: underline;
}

.ftr-logo {
  margin-bottom: 20px;
}

.footer-col.copyrights.col.col-sm-8 p {
  font-size: 12px;
  color: #00302d;
}

.mobile-logo {
  display: none;
}

.copyrights-col div img {
  height: calc($footer_logo_height * 1px);
  max-height: 64px;
  margin-right: 5px;
}

.footer-logo {
  margin: auto 0;
}

.footer-logo img {
  max-height: 120px !important;
  height: calc($footer_logo_height * 1px);
}

@media (max-width: 480px) {
  .footer-col.copyrights p img {
    display: none;
  }
  .copyrights-col div img {
    display: none;
  }
  .mobile-logo {
    display: inline-block;
    height: calc($footer_logo_height * 1px);
  }
  .footer-logo img {
    display: none;
  }
}

footer span {
  color: rgba(42, 47, 69, 1);
}

.footer-col.footer-col-social-links {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

@media (min-width: 769px) {
  .footer-col.footer-col-social-links {
    width: 60%;
  }
}

.footer-col.footer-col-social-links span {
  margin-right: 15px;
  font-size: 14px;
}

@media (max-width: 768px) {
  .copyrights-col,
  .custom-link-col,
  .social-col {
    margin-bottom: 10px;
  }
  .copyrights-col {
    order: 3;
  }
  .custom-link-col {
    text-align: center;
    order: 2;
  }
  .social-col {
    text-align: center;
    order: 1;
  }
}

.custom-link {
  font-size: 16px;
  color: rgba(42, 47, 69, 1);
  margin: 0 10px;
  font-weight: 700;
  white-space: nowrap;
}

@media (max-width: 480px) {
  .custom-link {
    display: block;
    margin-bottom: 10px;
  }
}

.wrapper-footer {
  background-color: rgba(255, 255, 255, 1);
  height: 100px;
  margin-top: auto;
  position: absolute;
  bottom: 0;
  width: calc(100% - 270px);
}

@media (max-width: 1024px) {
  .wrapper-footer {
    width: 100%;
    height: 120px;
  }
}

blockquote h3,
blockquote h2,
blockquote h4,
blockquote h5 {
  margin: 0 0 10px;
}

h3.h5.search-result-title a {
  font-size: 22px;
}

ol.breadcrumbs.search-result-breadcrumbs li {
  font-size: 14px;
}

.footer .row.d-flex {
  align-items: center;
}

.ftr-logo img {
  height: 26px;
}

button.lines-button.x:focus,
span.lines:focus {
  outline: none;
}

/*** media query***/
@media (max-width: 1200px) {
  .site-primary,
  .site-related {
    padding-left: 0px;
  }
}

@media (max-width: 768px) {
  aside.site-sidebar.light-background {
    display: none;
  }
}

@media (max-width: 1024px) {
  .site-div {
    padding: 20px;
  }
  h1 {
    font-size: 28px;
  }
  h3,
  .h3 {
    font-size: 20px;
    line-height: 34px;
  }
  .related-articles h3,
  h4 {
    font-size: 18px;
  }
  .promoted-articles h3 {
    font-size: 18px;
  }
  .site-sidebar.site-article li a {
    font-size: 16px;
  }
  aside.site-sidebar.light-background {
    position: relative;
    height: 100%;
    padding-right: 50px;
    z-index: 99;
  }
  .site-related li a {
    font-size: 17px;
    line-height: 26px;
    color: rgba(84, 88, 90, 1);
  }
  .site-icon {
    height: 80px;
  }
  .site-block h4 {
    font-size: 20px;
  }
}

.site-vote > button {
  font-weight: unset;
  text-transform: unset;
  font-size: unset;
  padding: 0 15px;
  vertical-align: unset;
}

.searchform {
  display: none;
}

@media (max-width: 1024px) {
  .searchbar-top-mobile {
    display: block;
    margin: 32px;
  }
  .header-col {
    padding: 5px 0;
    display: flex;
  }
  .header-col.header-menu {
    padding: 0;
  }
  .container.category-container.py-6 {
    padding-top: 15px;
  }
  .site-wrapper {
    padding: 60px 0 20px 0;
  }
  .site-div p {
    font-size: 14px;
  }
  .hero-item .search:before {
    background-size: contain;
    left: 8px !important;
    top: 28px;
  }
  .search-container-hero-item #query {
    height: 50px;
    padding: 0 40px;
    font-size: 16px;
  }
  .site-primary.py-6 {
    padding-top: 15px;
  }
  aside.site-sidebar.py-6.light-background.site-article {
    display: none;
  }
  .site-related .col.col-sm-6 {
    margin: 15px 0;
  }
  .site-related.py-6 {
    padding: 40px 0;
  }
}

@media (max-width: 1024px) and (max-width: 480px) {
  .site-block {
    flex: 100%;
    margin: 20px 15px 0;
  }
}

@media (max-width: 1024px) and (max-width: 1025px) {
  .searchform {
    display: flex;
    flex-direction: row;
    position: fixed;
    -webkit-transition: all 350ms cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -moz-transition: all 350ms cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -ms-transition: all 350ms cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -o-transition: all 350ms cubic-bezier(0.665, 0.165, 0.13, 0.715);
    transition: all 350ms cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -webkit-transition-timing-function: cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -moz-transition-timing-function: cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -ms-transition-timing-function: cubic-bezier(0.665, 0.165, 0.13, 0.715);
    -o-transition-timing-function: cubic-bezier(0.665, 0.165, 0.13, 0.715);
    transition-timing-function: cubic-bezier(0.665, 0.165, 0.13, 0.715);
    z-index: 122;
    width: 100%;
    border: none;
    border-bottom: 1px solid rgba(158, 162, 162, 1);
    box-shadow: none;
    margin-top: -100px;
    height: 70px;
    text-align: center;
    background: #ffffff;
  }
  .searchform input[type="search"] {
    border: none;
    height: 100%;
    padding: 34px 0;
    padding-left: 8px;
    box-shadow: none;
    background: transparent;
  }
  .searchform form {
    width: 90%;
  }
  .searchform.moved {
    margin-top: 0px;
  }
  .searchform-icon {
    margin: auto 10px;
  }
}

@media (max-width: 1024px) and (max-width: 1025px) and (min-width: 1024px) {
  .searchform-icon {
    display: none !important;
  }
}

@media (max-width: 1024px) and (max-width: 1025px) {
  #closeSearch {
    margin: auto;
    margin-right: 20px;
    margin-left: 20px;
    font-size: 25px;
    color: #ccc;
    width: 10%;
  }
}

@media (max-width: 1024px) {
  .hero-title {
    font-size: calc($font_size_hero * 0.8);
  }
  .search-container-hero-item .search {
    display: -webkit-box;
    display: flex;
    max-width: 460px;
    margin: 25px auto;
  }
  h1 {
    font-size: 30px;
  }
  h2 {
    font-size: 26px;
  }
  .footer-col.copyrights.col.col-sm-7.col-md-8 {
    order: 2;
    margin-top: 15px;
  }
  .footer-col.footer-col-social-links.col.col-sm-5.col-md-4 {
    order: 1;
  }
  .container {
    padding-right: 20px;
    padding-left: 20px;
  }
  .request-container {
    margin-bottom: calc(16px * 1.5 * 2);
  }
  .searchbar-top-mobile input {
    border: 1px solid #c0c8c8;
    box-shadow: none;
    border-radius: 4px;
  }
}

@media (max-width: 1440px) {
  .site-block {
    width: 47%;
  }
}

[dir="ltr"] .optional {
  margin-left: 5px;
}

[dir="rtl"] .optional {
  margin-right: 5px;
}

@media (max-width: 640px) {
  .py-6 {
    padding-top: 40px;
    padding-bottom: 40px;
  }
  .quick-block li {
    width: 100%;
  }
  .site-footer.light-background h3 {
    line-height: 26px;
    font-size: 16px;
  }
  .site-footer.light-background li {
    font-size: calc(16px - 2px);
  }
}

@media (max-width: 768px) {
  footer.footer.container {
    text-align: center;
  }
}

@media (max-width: 480px) {
  .footer-col.footer-col-social-links span {
    display: none;
  }
  .hero-item {
    height: 350px;
    padding-top: 120px;
  }
  .footer-col.footer-col-social-links {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
    margin: 20px 0 10px;
  }
  .category-block {
    margin-bottom: 30px;
    border-bottom: 2px solid #e9ecec;
    padding-bottom: 30px;
  }
  .col.col-xs-6.col-sm-4.col-md-3:last-child .category-block {
    border: none;
    padding-bottom: none;
  }
  /* solafid solutions */
  h1 {
    font-size: 28px;
  }
  h2 {
    font-size: 24px;
  }
  .hero-title {
    font-size: 25px;
  }
  .site-div {
    padding: 20px 25px;
  }
  .col.col-xs-6.col-sm-4.col-md-3 {
    width: 100%;
  }
}

.post-list-container.post-container.topic-list.topic-list-container.new-community-post-container {
  padding-top: 60px;
}

section:empty {
  display: none;
}

.collapse {
  display: none;
}

.collapse.in {
  display: block;
}

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  -webkit-transition-property: height, visibility;
  -o-transition-property: height, visibility;
  transition-property: height, visibility;
  -webkit-transition-duration: 0.35s;
  -o-transition-duration: 0.35s;
  transition-duration: 0.35s;
  -webkit-transition-timing-function: ease;
  -o-transition-timing-function: ease;
  transition-timing-function: ease;
}

.is-overflow {
  overflow: hidden;
}

.blackout::before {
  content: "";
  position: fixed;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: black;
  z-index: 9999999;
  transition: all 0.9s ease-out;
  /* margin-left: 270px; */
}

.is-overflow.blackout:before {
  opacity: 0.8;
}

.current-item {
  color: rgba(5, 5, 5, 1) !important;
}

.current-item span {
  color: rgba(5, 5, 5, 1) !important;
}

#loading {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: fixed;
  display: block;
  opacity: 1;
  background-color: rgba(255, 255, 255, 1);
  z-index: 101;
  text-align: center;
}

#loading-image {
  position: absolute;
  width: 50px;
  top: 50%;
  left: 50%;
  z-index: 100;
  transform: translateX(-50%);
}

.spinner {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  display: block;
  opacity: 1;
  z-index: 99;
  text-align: center;
}

.spinner img {
  position: absolute;
  width: 50px;
  top: 50%;
  left: 50%;
  z-index: 100;
  transform: translateX(-50%) translateY(50%);
}

@media (min-width: 1025px) {
  #toc.collapse {
    display: block;
  }
}

/***** Info *****/
.info-header {
  position: fixed;
  bottom: 0;
  z-index: 1002;
  width: 100%;
  display: none;
  background-color: rgba(0, 168, 93, 1);
}

@media (min-width: 1025px) {
  .info-header {
    width: calc(100% - 270px);
  }
}

.info-header.show {
  display: block;
}

.info-banner {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: center;
  padding: 15px 0 10px;
}

.info-banner .banner-header {
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
}

.info-banner .banner-header h2 {
  font-weight: 600;
  font-size: 24px;
  line-height: 20px;
  margin-bottom: 5px;
  align-items: center;
  color: rgba(8, 0, 0, 1);
}

.info-banner .banner-header #banner-close {
  position: absolute;
  right: 5%;
  cursor: pointer;
}

.info-banner .banner-body {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: center;
  width: 100%;
}

.info-banner .banner-body p {
  margin: 10px 0;
  color: rgba(8, 0, 0, 1);
  font-size: 14px;
}

.info-banner .banner-body a {
  text-transform: none;
  font-weight: normal;
  padding: 5px 10px;
  font-size: 0.8em;
  color: rgba(8, 0, 0, 1);
  border-color: rgba(8, 0, 0, 1);
}

.info-banner .banner-body a:hover {
  color: rgba(0, 168, 93, 1);
  background-color: rgba(8, 0, 0, 1);
  border-color: rgba(0, 168, 93, 1);
}

/* Formatting Component */
/* Tab */
.tabs {
  margin-bottom: calc(1.5 * 16px);
}

.tabs-nav {
  display: flex;
  flex-direction: row;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}

@media (max-width: 1024px) {
  .tabs-nav {
    flex-direction: column;
  }
}

.tabs-nav a {
  display: inline-block;
  top: 1px;
  position: relative;
  font-weight: 700;
  font-size: 16px;
  color: rgba(84, 88, 90, 1);
  cursor: pointer;
  padding: 5px 20px;
  border: 1px solid transparent;
}

@media (max-width: 1024px) {
  [dir="ltr"] .tabs-nav a,
  [dir="rtl"] .tabs-nav a {
    display: block;
    float: none;
    border-color: #ddd;
  }
}

.tabs-nav a.is-active {
  border: 1px solid #ddd;
  pointer-events: none;
  border-bottom: 1px solid rgba(255, 255, 255, 1);
  color: rgba(5, 5, 5, 1);
}

@media (max-width: 1024px) {
  .tabs-nav a.is-active {
    border-bottom: 1px solid rgba(5, 5, 5, 1);
  }
}

@media (max-width: 1024px) {
  .tabs-nav a:first-child {
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
  }
}

.tabs-nav a:hover {
  opacity: 0.6;
}

.tabs-content div {
  display: none;
  padding: 16px 20px;
  border: 1px solid #ddd;
}

.tabs-content div.active {
  display: block;
}

@media (max-width: 1024px) {
  .tabs-content div {
    border-radius: 5px;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
  }
}

@media (max-width: 1024px) {
  .tabs.colored-1 .tabs-nav a.is-active {
    border-bottom-color: transparent;
  }
}

.tabs.colored-1 .tabs-nav a,
.tabs.colored-2 .tabs-content div {
  background-color: rgba(255, 255, 255, 1);
}

.tabs.colored-1 .tabs-nav a.is-active {
  background-color: rgba(255, 255, 255, 1);
}

.tabs.colored-2 .tabs-nav a.is-active {
  background-color: rgba(255, 255, 255, 1);
  color: rgba(84, 88, 90, 1);
  border-bottom-color: rgba(255, 255, 255, 1);
}

/* End of Tabs */
/* Callout */
.callout {
  padding: 20px 20px;
  border-left: 5px solid rgba(84, 88, 90, 1);
  background-color: rgba(255, 255, 255, 1);
  margin-bottom: calc(16px * 1.5);
}

.callout-title {
  font-size: calc(16px * 1.5);
  font-weight: 700;
  color: inherit;
}

.callout-dashed {
  border-width: 1px;
  border-style: dashed;
}

.callout-transparent {
  background-color: transparent;
  box-shadow: 0px 8px 16px 0 rgba(0, 0, 0, 0.12);
}

.callout-success {
  background-color: rgba(70, 219, 120, 0.3);
  border-color: #46db78;
}

.callout-info {
  background-color: rgba(74, 164, 224, 0.3);
  border-color: #4aa4e0;
}

.callout-warning {
  background-color: rgba(227, 163, 79, 0.3);
  border-color: #e3a34f;
}

.callout-alert {
  background-color: rgba(232, 51, 51, 0.3);
  border-color: #e83333;
}

.accordion {
  box-shadow: none;
  outline: 0;
  background-color: rgba(255, 255, 255, 1);
  color: rgba(84, 88, 90, 1);
  padding-right: 12px;
  padding-left: 12px;
  cursor: pointer;
  width: 100%;
	border: 1px solid #ddd;
  text-align: left;
  outline: none;
  font-size: 15px;
  transition: 0.4s;
  border-radius: 5px;
  margin-bottom: 1.5em;
}

.sidebar.accordion
{
  padding-top: 0.55em;
  padding-bottom: 0.55em;
  padding-right: 1em;
  font-size: 1em;
}
 
.sidebar.accordion.active
{
    max-height: none !important;
}

.sidebar.accordion::before
{
  width: auto;
  content: "\f107";
  font-family: "Font Awesome 5 Free";
  color: rgba(84, 88, 90, 1);
  font-weight: bold;
  transition: all 0.4s ease;
  float: right;
  font-size: 1.7em;
	position: relative;
  /*top: -0.45em;*/
  z-index: 1;
  background: transparent;
}

.accordion::before {
  content: "\f107";
  font-family: "Font Awesome 5 Free";
  color: rgba(84, 88, 90, 1);
  font-weight: bold;
  transition: all 0.4s ease;
  float: right;
  font-size: 1.7em;
	position: relative;
  top: 0.2em;
}

[dir="rtl"] .accordion::before {
  float: left;
}

.accordion.active::before {
  transform: rotate(-180deg);
}


.accordion-panel
{
  padding: 0 10px;
  background-color: white;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  border-left: 1px solid rgba(255, 255, 255, 1);
  border-right: 1px solid rgba(255, 255, 255, 1);
}


.panel-heading h1, 
.panel-heading h2,
.panel-heading h3,
.panel-heading h4,
.panel-heading h5,
.panel-heading h6
{
  margin-top: 1.2em;
	margin-bottom: 1.2em;
  margin-right: auto;
  margin-left: auto;
}

#lightbox {
  display: none;
  position: fixed;
  z-index: 1080;
  left: 0;
  top: 0;
  padding-top: 50px;
  padding-bottom: 50px;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: black;
  /* Fallback color */
  background-color: rgba(0, 0, 0, 0.9);
  /* Black w/ opacity */
}

#lightbox .lightbox-body {
  position: relative;
  max-width: 900px;
  width: 90%;
  margin: auto;
}

#lightbox .lightbox-content {
  display: block;
  margin: auto;
}

.close {
  position: absolute;
  right: -30px;
  top: 0;
  z-index: 999;
  font-size: 2rem;
  font-weight: normal;
  color: #fff;
  opacity: 1;
  cursor: pointer;
}

.print-wrapper {
  display: flex;
  justify-content: flex-end;
}

@media print {
  body * {
    visibility: hidden;
  }
  .print-wrapper,
  .related-articles,
  .promoted-articles,
  .site-footer,
  .article-subscribe {
    display: none;
  }
  .site-primary,
  .site-primary * {
    visibility: visible;
  }
  .site-primary {
    position: absolute;
    margin-top: -100px;
    left: 20px;
    top: 20px;
    padding-top: 30px;
    padding-bottom: 30px;
  }
}

@media (min-width: 1025px) {
  .wrapper.collapsible.collapsible-hidden .sidebar {
    width: 73px;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-wrapper {
    overflow-y: hidden;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-wrapper .dropdown {
    display: none;
    border: none;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-wrapper .dropdown .btn {
    padding: 0;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-wrapper .dropdown .btn::after {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-wrapper .dropdown .btn span {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-header .logo-wrapper {
    width: 70px;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-header .logo-wrapper img {
    height: auto;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar nav span {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-container {
    width: 70px;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-footer {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden #menu-tree {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden #main {
    width: 100%;
  }
  .wrapper.collapsible.collapsible-hidden .wrapper-head {
    width: calc(100% - 70px);
  }
  .wrapper.collapsible.collapsible-hidden .info-header {
    width: calc(100% - 70px);
  }
  .wrapper.collapsible.collapsible-hidden .spinner {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden .logo img:first-of-type {
    display: none;
  }
  .wrapper.collapsible.collapsible-hidden .logo img:last-of-type {
    display: block;
  }
  .wrapper.collapsible.collapsible-hidden .sidebar-collapse-button .fas {
    transform: rotate(-180deg);
  }
}

.wrapper.collapsible .sidebar-collapse-button {
  display: none;
  cursor: pointer;
}

@media (min-width: 1024px) {
  .wrapper.collapsible .sidebar-collapse-button {
    display: block;
    position: absolute;
    top: 50%;
    padding: 5px 3px;
    border: 1px solid rgba(158, 162, 162, 1);
    margin: 0;
    background-color: rgba(253, 253, 253, 1);
  }
  [dir="ltr"] .wrapper.collapsible .sidebar-collapse-button {
    right: -14px;
    border-top-right-radius: 6px;
    border-bottom-right-radius: 6px;
    border-left-color: rgba(253, 253, 253, 1);
  }
  [dir="rtl"] .wrapper.collapsible .sidebar-collapse-button {
    left: -14px;
    transform: rotate(-180deg);
  }
}

.sidebar-collapse-button {
  display: none;
}

.mediaobject {
  margin: 2rem 0px;
}

  /* Step 1: Common Properties
  These styles are required to make icons render reliably 
  .icon::before {
    display: inline-block;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
  }

.tip::before {
    font-family: "Font Awesome 5 Free";
    content: "\f05a";
  }
*/

div.informaltable
{
  margin-top: 1em;
}

.menu-tree-category-header
{
  margin-top: auto;
}

/*aside.sidebar h2,
aside.sidebar h3,
aside.sidebar h4,
aside.sidebar h5,
aside.sidebar h6
{
  margin-top: auto;
  margin-bottom: auto;
}*/


.example {
  position: relative;
  padding-left: 12px;
  margin: calc(16px * 1.5) 0;
  color: zass-#232425;
  border-left: calc(2px * 2) solid transparent;
  border-left: 2px solid rgb(84, 88, 90) !important;
  border: 1px solid #ccc;
  margin-bottom: 2rem;
  padding: 10px;
}

.example p:last-child {
  margin-bottom: 0;
}

.example .title
{
  font-weight: bold !important;
  font-size: 18px;
  line-height: 10px !important;
  color: rgba(84, 88, 90, 1);
  margin: 0 0 calc((18px * 1.5) * 0.8);
}

/*styles for the tables on the Expel integrations page*/
.article-body .integrations-table table td
{
  padding-left: 16px !important;
  padding-right: 10px !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
  vertical-align: middle !important;
}

.integrations-table th
{
  background-color: var(--zd-color-grey-100);
  border-bottom: solid 2px var(--zd-color-grey-200);
  text-align: left;
  padding-left: 16px !important;
  padding-bottom: 0 !important;
  padding-top: 0 !important;
  vertical-align: middle !important;
}

.integrations-table > table td + td,
.integrations-table > table th + th
{
  border-left:1px solid var(--zd-color-grey-200);
}

.integrations-table th > p,
.integrations-table td > p
{
  margin-bottom: 0;
}

.integrations-table th > p + p,
.integrations-table td > p + p
{
 margin: calc((18px * 1.5) * 0.3) 0 calc((18px * 1.5) * 0.3);
}

.integrations-table td:nth-child(1)
{
  	font-weight: bold;
}
/*end of the integrations table styles*/

div.integrations-topic h2
{
  padding-top: 40px;
  color: rgb(0, 168, 93);
}

/*inline items display for checklists*/
div.checklist-checkbox-wrapper,
input.checklist-checkbox,
div.check-item-content,
div.check-item-content > p
{
  display: inline;
}

/*hide checklist refresh button that did nothing*/
div.checklist-reset-wrapper
{
  display: none;
}

/*fix bullets in procedure*/
ol.procedure > li.step
{
  list-style: decimal;
}

/*unify font weight in integrations table header*/
.integrations-table th sup
{
  font-weight: bold !important;
}

/*temporary style for the old integrations page*/
.td-footnote
{
  font-weight: 300 !important;
  font-size: 0.8em;
}

.td-internalth
{
    background-color: var(--zd-color-grey-100);
  	text-align: center;
}

thead p .phrase
{
  background-color: unset;
}

.article-body div.sidebar span.label-default
{
  font-weight: bold;
  color: #1D1C1D;
}

.article-body div.sidebar span.label-danger
{
  font-weight: bold;
  color: #ff0000;
}

.article-body div.sidebar span.label-warning
{
  font-weight: bold;
  color: #FF9900;
}

.article-body div.sidebar span.label-info
{
  font-weight: bold;
  color: #0B5394;
}

.article-body div.sidebar span.label-success
{
  font-weight: bold;
  color: #368564;
}

.article-body .inlinemediaobject img
{
  padding-top: 0;
}

ol[type=a]
{
  list-style-type: lower-alpha;
}

ol[type=i]
{
  list-style-type: lower-roman;
}

th p
{
  margin-top: 0;
}

div#menu-tree h3.menu-tree-section-header
{
  margin-top: 0;
}

/*Copy to clipboard styles*/
/*For the position of the button, see style.js >   // Create and position the copy button*/
.copy-button {
    cursor: pointer;
    background-color: rgba(0, 168, 93, 1);
    color: white;
    padding: 3px 5px;
    border-radius: 5px;
  font-size: 0.7em;
  font-weight: unset;
}

/*Hide the copy button on mobiles*/
/*@media screen and (max-device-width: 640px) { 
.copy-button {
display:none;
}
}*/

.code-sample {
    display: block;
    position: relative;
}

/*Skip-navigation link, ported from Copenhagen v4.50.4.*/
/*Off-screen until focused; the modal container hides it while a modal is open.*/
.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;
}

#zd-modal-container ~ .skip-navigation {
  display: none;
}

/* Templating API v4 - put the React request form's Submit on brand.
   Garden derives #337d46 from brand_color, which is in no Expel palette tier.
   The brand accessibility matrix pairs Accent Green with DARK text (8.17:1), so
   fill and text are set together - either alone would be wrong.

   Specificity, measured 2026-08-21: the button carries no inline style and
   Garden uses styled-components classes (.StyledButton-sc-... = 0,2,0). This
   selector is (1,1,1), so an id beats class-only regardless of source order and
   no !important is needed.

   These rules are NOT given the exclusion suffix - unlike the ~33 legacy rules,
   this one is meant to reach into the form.

   Hover/focus/active keep the fill and borrow the theme's own hover idiom
   (opacity, per the .btn rules above) rather than a shade the palette does not
   contain. A base-only override would snap back to Garden's green on hover.
   :disabled is deliberately left to Garden's grey. */
#new-request-form button[type="submit"] {
  background-color: #51C66F;
  border-color: #51C66F;
  color: #181818;
  font-weight: 700;
}

#new-request-form button[type="submit"]:hover,
#new-request-form button[type="submit"]:focus,
#new-request-form button[type="submit"]:active {
  background-color: #51C66F;
  border-color: #51C66F;
  color: #181818;
  font-weight: 700;
  opacity: 0.9;
}