/* -------------------------------------------------------------------------------- /
    THEME NAME: Matrix Framework
    VERSION: 1.0.0  (26-09-2025)
    DESCRIPTION: Custom framework for Jimdo Creator websites
    AUTHOR: Serhiy Hembarevskyy
    URI: https://www.matrix-framework.com/
    +----------------------------------------------------+
        TABLE OF CONTENTS
    +----------------------------------------------------+
    [01] COLOR SETTINGS
    [02] TYPOGRAPHY
    [03] LAYOUT
    [04] WIDGETS AND CUSTOM ELEMENTS
    [05] HELPER CLASSES
    [06] MEDIA QUERIES
    [07] ADMIN MENU
    [08] ADDITIONAL LIBRARIES
    [09] THEME UPDATES   
    [10] STYLE EDITOR      
    

/ -------------------------------------------------------------------------------- */

/* -------------------------------------------------------------------------------- /
    [1] COLOR SETTINGS
/ -------------------------------------------------------------------------------- */

:root {
  --bg-primary: #404040;
  --bg-primary-light: #f0f0f0;
  --bg-primary-dark: #000;
  --bg-secondary: #2e2e2e;
  --bg-secondary-dark: #111;
  --bg-gradient: linear-gradient(to right, var(--bg-primary), var(--bg-secondary));
  --bg-body: transparent;
  --bg-top-header: #000;
  --bg-top-header-inner: transparent;
  --bg-header: #fff;
  --bg-header-inner: transparent;
  --bg-nav-inner: transparent;
  --bg-content: #fff;
  --bg-footer: #000;
  --bg-footer-btm: #000;
  --bg-btn-01: #404040;
  --bg-btn-02: #404040;
  --bg-btn-03: #404040;
  --text-btn: #fff;
  --bg-social: #fff;
  --bg-border-color: transparent;
  --nav-color: #000;
  --bg-subnav: #fff;
  --bg-overlay: #000;
  --mobile-nav-color: #fff;
  --bg-top-header-border-color: transparent;
  --bg-header-border-color: transparent;
  --bg-nav-inner-border-color: transparent;
  --stack-font:
    -apple-system, system-ui, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial,
    sans-serif;
}

#cc-inner .bg-gradient {
  background-image: var(--bg-gradient) !important;
  border: none;
}

/* default theme colors */
#cc-inner #hs-container .bg-primary {
  background: var(--bg-primary);
}

#cc-inner #hs-container .bg-primary-dark {
  background: var(--bg-primary-dark);
}

#cc-inner #hs-container .bg-primary-light {
  background: var(--bg-primary-light);
}

#cc-inner #hs-container .bg-secondary {
  background: var(--bg-secondary);
}

#cc-inner #hs-container .bg-secondary-dark {
  background: var(--bg-secondary-dark);
}

/* template sections */

#cc-inner .hs-top-header {
  background: var(--bg-top-header);
}

#cc-inner .bg-top-header-inner > div {
  background: var(--bg-top-header-inner);
}

#cc-inner #hs-container .hs-header,
#cc-inner .is-sticky.max-inner {
  background: var(--bg-header);
}

#cc-inner .bg-header-inner > div {
  background: var(--bg-header-inner);
}

#cc-inner .bg-nav-inner > div {
  background: var(--bg-nav-inner);
}

#cc-inner .hs-content {
  background: var(--bg-content);
}

#cc-inner .hs-footer > div {
  background: var(--bg-footer);
}

#cc-inner .footer-btm {
  background: transparent !important;
}

#cc-inner .hs-footer {
  color: var(--footer-color);
}

#cc-inner .footer-btm {
  color: var(--footer-color);
}

#cc-inner .footer-options a:link:not(.cc-bs a:link),
#cc-inner .footer-options a:visited:not(.cc-bs a:visited) {
  color: var(--footer-link);
}

/* button styles */
.cc-pagemode-overlay #hs-container input[type='submit'].submitUser,
#cc-inner .j-downloadDocument .cc-m-download-link,
#cc-inner .commententry input[type='submit'],
#cc-inner .j-calltoaction-link.j-calltoaction-link-style-1,
#cc-inner .hs-button:not(.ghost-white):not(.bg-white):not(.cd-btn.hs-button):not(.ghost-dark),
#cc-inner .j-formnew input[type='submit'],
#cc-inner a.blogreadmore {
  background: var(--bg-btn-01);
  color: var(--text-btn) !important;
}

#cc-inner .j-calltoaction-link.j-calltoaction-link-style-2 {
  background: var(--bg-btn-02);
  color: var(--text-btn) !important;
}

#cc-inner .j-calltoaction-link.j-calltoaction-link-style-3 {
  background: var(--bg-btn-03);
  color: var(--text-btn) !important;
}

/* cookie message styles */
.cc-page
  .cc-individual-cookie-settings.ui-dialog
  .cc-individual-cookie-settings-actions
  .btn-primary {
  background-color: var(--bg-btn-01) !important;
  color: var(--text-btn) !important;
  border: 2px solid transparent !important;
}

.cc-page .cc-individual-cookie-settings button.toggle span.fill {
  background: var(--bg-btn-01) !important;
}

/* nav elements */
.jmd-nav__toggle-button,
#cc-inner .hs-mega nav a,
.more:after,
#cc-inner .hs-menu nav a,
.snip-nav ul li a:not(.snip-nav ul li ul li a),
#cc-inner .onepager .hs-menu nav a {
  color: var(--nav-color) !important;
}

#cc-inner .hs-social a {
  background: var(--bg-social);
}

#cc-inner .hs-menu nav ul ul,
#cc-inner .hs-mega .j-nav-variant-nested > ul > li > ul {
  background: var(--bg-subnav);
}

#cc-inner .overlay,
#cc-inner ul.slimmenu.collapsed {
  background: var(--bg-overlay);
}

#cc-inner .nav-mobile-options a,
#cc-inner .slicknav_nav a,
ul.slimmenu li a {
  color: var(--mobile-nav-color);
}

#cc-inner .hs-footer .color-hr .hr,
#cc-inner .hs-footer .color-hr-2 .hr,
#cc-inner .hs-footer .color-hr-3 .hr {
  background: var(--bg-hr);
}

#cc-inner .has-header-border-color {
  border-color: var(--bg-header-border-color);
}

#cc-inner .hs-top-header .has-top-header-border-color {
  border-color: var(--bg-top-header-border-color);
}

#cc-inner .bg-header-inner > .has-header-border-color {
  border-color: var(--bg-header-border-color);
}
#cc-inner .bg-header-inner .has-nav-inner-border-color {
  border-color: var(--bg-nav-inner-border-color);
}

/* custom button's active and hover bg */
#cc-inner #hs-container a.--hover\:bg-custom:hover:not(.cc-m-download-file-link),
#cc-inner #hs-container .--hover\:bg-custom a:hover,
#cc-inner #hs-container input.--hover\:bg-custom:hover {
  background: #ffeb3b !important;
  color: #222 !important;
}

/* -------------------------------------------------------------------------------- /
    [2] TYPOGRAPHY
/ -------------------------------------------------------------------------------- */

/* Apply the CSS variable to the elements */
#cc-inner .g-font,
#cc-inner h1.g-font,
#cc-inner h2.g-font,
#cc-inner h3.g-font,
#hs-container.g-font,
#cc-inner .g-font h1,
#hs-container.g-font h2,
#hs-container.g-font h3,
#hs-container.g-font h4,
#hs-container.g-font span.fn,
#hs-container.g-font p,
#hs-container .g-font p,
#hs-container.g-font table,
#hs-container.g-font td,
#hs-container.g-font .hs-menu .nav li a,
#hs-container.g-font .j-nav-variant-nested,
#hs-container.g-font .j-nav-variant-standard,
#hs-container.g-font .j-nav-variant-breadcrumb,
#hs-container.g-font .slicknav_nav a,
#hs-container.g-font ul.slimmenu li a,
#hs-container.g-font .j-formnew input,
#hs-container.g-font .hs-button,
#hs-container.g-font a.j-calltoaction-link,
#hs-container.g-font .cc-shop-addtocard,
#cc-inner nav.g-font a,
#cc-inner .j-formnew input.g-font,
#cc-inner a.j-calltoaction-link.g-font,
#cc-inner .hs-button.g-font {
  font-family: var(--primary-font, var(--stack-font));
}

#cc-inner #hs-container .g-font-2,
#hs-container .g-font-2 h1,
#hs-container .g-font-2 h2,
#hs-container .g-font-2 h3,
#hs-container .g-font-2 p,
#hs-container .g-font-2 table,
#hs-container.g-font .g-font-2 h1,
#hs-container.g-font .g-font-2 h2,
#hs-container.g-font .g-font-2 h3,
#hs-container.g-font .g-font-2 p,
#hs-container.g-font .g-font-2 table,
#cc-inner h1.g-font-2,
#cc-inner h2.g-font-2,
#cc-inner h3.g-font-2,
#hs-container.g-font-2,
#hs-container.g-font-2 h1,
#hs-container.g-font-2 h2,
#hs-container.g-font-2 h3,
#hs-container.g-font-2 h4,
#hs-container.g-font-2 span.fn,
#hs-container.g-font-2 p,
#hs-container.g-font-2 table,
#hs-container.g-font-2 td,
#hs-container.g-font-2 .hs-menu .nav li a,
#hs-container.g-font-2 .j-nav-variant-nested,
#hs-container.g-font-2 .j-nav-variant-standard,
#hs-container.g-font-2 .j-nav-variant-breadcrumb,
#hs-container.g-font-2 .slicknav_nav a,
#hs-container.g-font-2 ul.slimmenu li a,
#hs-container.g-font-2 .j-formnew input,
#hs-container.g-font-2 .hs-button,
#hs-container.g-font-2 a.j-calltoaction-link,
#hs-container.g-font-2 .cc-shop-addtocard,
#cc-inner nav.g-font-2 a,
#cc-inner .j-formnew input.g-font-2,
#cc-inner a.j-calltoaction-link.g-font-2,
#cc-inner .hs-button.g-font-2 {
  font-family: var(--secondary-font, var(--stack-font));
}

/* custom font only for global text */
body .has-custom-text,
.has-custom-text p,
.has-custom-text table,
.has-custom-text td {
  font-weight: 400;
}

.has-custom-text strong {
  font-weight: bold;
}

/* headings styles */
#cc-inner h1 {
}

#cc-inner h2,
#cc-inner .j-blog-post--headline {
}

#cc-inner h3 {
}

/* btn styles */
#cc-inner .j-calltoaction-link-style-1,
#cc-inner .j-calltoaction-link-style-2,
#cc-inner .j-calltoaction-link-style-3,
#cc-inner .j-formnew input[type='submit'],
#cc-inner .cc-m-download-file-link,
#cc-inner .hs-button {
}

/* nav styles */
#cc-inner .j-nav-variant-nested,
#cc-inner .j-nav-variant-standard,
#cc-inner .j-nav-variant-breadcrumb {
}

#cc-inner a:link,
#cc-inner a:visited {
  text-decoration: none;
}

/* -------------------------------------------------------------------------------- /
    [3] LAYOUT
/ -------------------------------------------------------------------------------- */

/*** template tweaks ***/
#cc-inner #hs-container .j-formnew input[type='submit'],
#cc-inner #hs-container input.submitUser,
#cc-inner .hs-button,
#cc-inner .j-calltoaction-link {
  padding: 17px 45px !important;
}

/*** end template tweaks ***/

/*** template styles ***/
.body {
  margin: 0;
}

#cc-inner {
  overflow: hidden;
}

#hs-container {
  width: 100%;
  padding: 0;
  margin: 0;
}

.inner {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  position: relative;
}

.max-inner {
  width: 100%;
  margin: 0 auto;
  position: relative;
  padding: 0;
}

#cc-inner .hs-top-header {
  width: 100%;
  display: flex !important;
  z-index: 203006;
}

.hs-content .draggable-top-header,.hs-footer .draggable-top-header {
  display:none;
}

.draggable-top-header {
  padding: 5px;
}

.g-header-section {
  position: relative;
}

.hs-header {
  background: #2e2e2e;
  position: relative;
  width: 100%;
  padding: 0;
  z-index: 203002;
}

.fixed,
.fixed-mobile {
  z-index: 203005 !important;
}

.matrix .fixed,
.matrix .fixed-mobile {
  position: relative !important;
}

/* sticky */
.is-sticky .max-inner {
  background: #111;
}

.has-sticky-logo .hs-logo img {
  max-height: 200px;
  height: auto;
  width: auto;
  transition: max-height 0.25s ease-in-out;
  object-fit: contain;
}

.has-sticky-logo .is-sticky .hs-logo img {
  max-height: 50px;
  object-position: left;
}

.sticky-wrapper:not(.sticky-wrapper.is-sticky) {
  height: auto !important;
}

.hs-logo {
  display: table-cell;
  vertical-align: middle;
  margin: 0;
  padding: 15px 0;
  z-index: 203001;
  position: relative;
}

.hs-logo img {
  border-radius: unset !important;
}

.bg-top-header-inner > div:after,
.bg-nav-inner > div:after {
  content: '';
  display: table;
  clear: both;
}

.hs-content {
  float: left;
  width: 100%;
  padding: 0;
  margin: 0;
  min-height: 300px;
  background: #fff;
}

.cc-pagemode-overlay .hs-content {
  padding: 20px 0;
}

.hs-footer {
}

.footer-btm {
}

.footer-btm #contentfooter div.leftrow,
.footer-btm #contentfooter div.rightrow {
  float: right;
  text-align: right;
  width: 100%;
}

.footer-btm .inline {
  display: none;
}

.footer-btm #contentfooter {
  padding: 5px 0;
}

/*** Gutter ***/
.hs-content .gutter {
  padding: 30px 0 0;
}

.hs-footer .gutter {
  padding: 45px 0 10px 0;
}

.footer-btm .gutter {
  padding: 15px 0;
}

/*** end template styles ***/

/* mobile menu */
.button_container {
  position: relative;
  height: 26px;
  width: 30px;
  display: flex;
  border: none !important;
  border-radius: 2px !important;
  cursor: pointer;
  z-index: 1999999;
  background-color: rgba(255, 255, 255, 0.6);
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

/* since version1.3 */
.button_container.nav-toggle {
  position: relative;
  top: unset;
  right: unset;
}

.button_container.active {
  background-color: rgba(255, 255, 255, 0.8);
  height: 27px;
}

.button_container:hover,
.button_container:focus {
  opacity: 0.9;
}

.button_container.active .top {
  -webkit-transform: translateY(9px) translateX(0) rotate(45deg);
  transform: translateY(9px) translateX(0) rotate(45deg);
  background: #000;
  top: 4px;
  width: 21px;
}

.button_container.active .middle {
  opacity: 0;
  background: #fff;
}

.button_container.active .bottom {
  -webkit-transform: translateY(-9px) translateX(0) rotate(-45deg);
  transform: translateY(-9px) translateX(0) rotate(-45deg);
  background: #000;
  top: 22px;
  width: 21px;
}

.button_container span {
  background: #000;
  border: none;
  height: 2px;
  width: 20px;
  position: absolute;
  top: 5px;
  left: 5px;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
  cursor: pointer;
}

.button_container span:nth-of-type(2) {
  top: 12px;
}

.button_container span:nth-of-type(3) {
  top: 19px;
}

.overlay {
  position: fixed;
  z-index: 1999998;
  background: #000;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  -webkit-transition:
    opacity 0.35s,
    visibility 0.35s,
    height 0.35s;
  transition:
    opacity 0.35s,
    visibility 0.35s,
    height 0.35s;
  overflow-x: none;
  overflow-y: auto;
}

.overlay.open {
  opacity: 0.98;
  visibility: visible;
  height: 100%;
}
/*** end mobile menu ***/

/*** Jimdo navigation ***/
ul.mainNav1,
ul.mainNav2,
ul.mainNav3 {
  padding: 0 !important;
  list-style: none;
  margin: 0;
}

ul.mainNav1 li,
ul.mainNav2 li,
ul.mainNav3 li {
  margin: 0 !important;
  padding: 0;
  list-style: none;
  display: inline;
}

/*** 2nd nav wrapper - breadcrumb ***/
.cc-indexpage .hs-subnav,
.hide-subnav .hs-subnav {
  display: none;
}

.hs-subnav ol {
  list-style-type: none;
  margin: 0;
  padding: 0;
}

.hs-subnav li {
  display: inline-flex;
}

.hs-subnav li:last-child a:after {
  content: '';
}

.hs-subnav li:only-child {
  display: none;
}

.hs-subnav a {
  padding: 10px 5px;
  float: left;
}

.hs-subnav a:link,
.hs-subnav a:visited {
  color: inherit;
}

.hs-subnav a:after {
  content: '\f105';
  font-family: FontAwesome;
  padding-left: 5px;
}

.hs-subnav .j-nav-current:link,
.hs-subnav .j-nav-current:visited,
.hs-subnav a:active,
.hs-subnav a:focus,
.hs-subnav a:hover {
  opacity: 0.8;
}

/* hidden menu links in admin mode */
li.cc-invisible {
  text-decoration: line-through;
}

#cc-nav {
  top: 10px !important;
  z-index: 203005;
}

/*** dropdown menu ***/
.hs-menu,
.hs-menu nav {
}

.hs-menu nav {
  float: left;
}

.hs-menu nav ul {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  position: relative;
  display: block;
  z-index: 203001;
}

.hs-menu nav ul li {
  display: inline-block;
  position: relative;
}

.hs-menu nav ul ul {
  opacity: 0;
  visibility: hidden;
}

.hs-menu nav ul li:hover > ul {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
}

/* used flexbox here */
.hs-menu nav ul li {
}

/* Main nav style */
.hs-menu nav ul li a:link,
.hs-menu nav ul li a:visited {
  display: block;
  color: #333;
  line-height: 100%;
  margin: 0;
  padding: 10px 20px;
  text-decoration: none !important;
  -webkit-font-smoothing: subpixel-antialiased !important;
  /* fix bug for Safari browser */
}

.hs-menu nav ul li.cc-nav-parent > a:link,
.hs-menu nav ul li.cc-nav-parent > a:visited,
.hs-menu nav ul li.cc-nav-current > a:link,
.hs-menu nav ul li.cc-nav-current > a:visited,
.hs-menu nav ul li a:link:hover,
.hs-menu nav ul li a:link:active,
.hs-menu nav ul li a:link:focus,
.hs-menu nav ul li a:visited:hover,
.hs-menu nav ul li a:visited:active,
.hs-menu nav ul li a:visited:focus {
  opacity: 0.6;
}

/* change the last item in main menu */
.has-custom-nav__ .hs-menu nav ul :last-of-type > ul,
.has-custom-nav
  .hs-menu
  .jmd-nav__list-item-0:last-child
  ul.cc-nav-level-1:not(
    .has-left-nav.has-center-logo .hs-menu .jmd-nav__list-item-0:last-child ul.cc-nav-level-1
  ) {
  right: 0;
  left: auto;
}

.has-custom-nav
  .hs-menu
  nav
  ul
  :last-child
  ul
  ul:not(.has-left-nav.has-center-logo .hs-menu ul :last-child ul ul) {
  position: absolute;
  left: -210px;
  max-width: 210px;
  top: 0;
}

/* Sub-nav style */
.hs-menu nav ul ul {
  background: #fff;
  box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  top: 100%;
  left: 0;
  margin: 0;
  color: #222;
  position: absolute;
  box-sizing: border-box;
  min-width: 210px;
  transform: translateY(-0.5em);
  transition:
    visibility 0.2s ease,
    transform 0.2s ease;
}

.hs-menu nav ul ul li {
  display: flex;
  position: relative;
  clear: both;
}

.hs-menu nav ul ul li a:link,
.hs-menu nav ul ul li a:visited {
  padding: 12px 20px;
  font-size: 90%;
  text-align: left;
  line-height: 100%;
  color: inherit;
  /* min-width: 200px; */
  box-sizing: border-box;
}

.hs-menu nav ul ul li.cc-nav-parent > a:link,
.hs-menu nav ul ul li.cc-nav-parent > a:visited,
.hs-menu nav ul ul li.cc-nav-current > a:link,
.hs-menu nav ul ul li.cc-nav-current > a:visited,
.hs-menu nav ul ul li a:link:hover,
.hs-menu nav ul ul li a:link:active,
.hs-menu nav ul ul li a:link:focus,
.hs-menu nav ul ul li a:visited:hover,
.hs-menu nav ul ul li a:visited:active,
.hs-menu nav ul ul li a:visited:focus {
  background: transparent !important;
}

.hs-menu nav ul ul ul {
  position: absolute;
  left: 100%;
  top: 0;
}

/* nav alignment */
#hs-container.has-right-nav .hs-header .is--center:not(.has-right-nav .hs-top-header .is--center) {
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  text-align: right;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0;
  flex: 3;
  margin: 0;
}

.has-right-nav .hs-header .is--right {
  flex-shrink: 0;
  -webkit-box-flex: 0;
  -ms-flex: 1 1 0;
  flex: inherit;
}

.has-center-nav .hs-header .is--center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  text-align: center;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0;
  flex: 3;
  margin: 0;
}

.has-left-nav .hs-header .is--center {
  -webkit-box-pack: left;
  -ms-flex-pack: left;
  justify-content: flex-start;
  text-align: left;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -webkit-box-flex: 1;
  -ms-flex: 1 1 0;
  flex: 3;
  margin: 0;
}

.has-left-nav .hs-header .is--flex1 {
  flex: unset;
}

.has-center-nav .hs-header .is--right {
  flex: unset;
}

.has-center-nav .is-eq {
  flex-grow: 1 !important;
  flex-basis: 0 !important;
}

@media only screen and (max-width: 1023px) {
  .has-center-nav .is-eq {
    flex-basis: auto !important;
  }
}

/*** sidebar menu ***/
.has-sidebar-menu {
  display: none;
}

.sidebar-nav .has-sidebar-menu {
  display: block;
}

.sidebar-nav {
  float: left;
  margin: 30px 0;
  padding: 0px;
  width: 100%;
  overflow: hidden;
}

.sidebar-nav ul.mainNav2 li a,
.sidebar-nav ul.mainNav2 li a:link,
.sidebar-nav ul.mainNav2 li a:active,
.sidebar-nav ul.mainNav2 li a:visited {
  display: block;
  float: left;
  color: #888;
  border-bottom: 1px solid rgba(85, 85, 85, 0.15);
  text-decoration: none;
  width: 100%;
  margin: 1px 0 !important;
  padding: 5px 0px 5px 0px;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.sidebar-nav ul.mainNav2 li a:hover,
.sidebar-nav ul.mainNav2 li a.current,
.sidebar-nav ul.mainNav2 li a.parent:hover,
.sidebar-nav ul.mainNav2 li a.parent {
  color: #000;
}

.sidebar-nav ul.mainNav3 li a,
.sidebar-nav ul.mainNav3 li a:link,
.sidebar-nav ul.mainNav3 li a:active,
.sidebar-nav ul.mainNav3 li a:hover,
.sidebar-nav ul.mainNav3 li a:visited {
  font-size: 90%;
  padding: 5px 0px 5px 10px;
  width: calc(100% - 10px);
}

.sidebar-nav ul.mainNav4 li a,
.sidebar-nav ul.mainNav4 li a:link,
.sidebar-nav ul.mainNav4 li a:active,
.sidebar-nav ul.mainNav4 li a:hover,
.sidebar-nav ul.mainNav4 li a:visited {
  font-size: 90%;
  padding: 10px 0px 10px 20px;
  width: calc(100% - 20px);
}

/*** mega-dropdown menu ***/

.hs-mega .j-nav-variant-nested > ul {
  margin: 0 auto;
  width: 100%;
  list-style: none;
  padding: 0;
  box-sizing: border-box;
  z-index: 203001;
  position: unset;
}

.hs-mega .j-nav-variant-nested > ul:before,
.hs-mega .j-nav-variant-nested > ul:after {
  content: '';
  display: table;
}

.hs-mega .j-nav-variant-nested > ul:after {
  clear: both;
}

.hs-mega .j-nav-variant-nested > ul > li {
  padding: 0;
  margin: 0;
  display: inline-block;
  position: unset;
}

.hs-mega .j-nav-variant-nested > ul > li a {
  text-decoration: none;
  margin: 5px 20px;
  padding: 5px 0px;
  display: inline-block;
  color: inherit;
  line-height: 100%;
}

.hs-mega .j-nav-variant-nested > ul > li:hover > a {
  opacity: 0.6;
}

.brand-link .hs-mega .j-nav-variant-nested > ul > li > ul > li a.cc-nav-current {
  background: none !important;
}

#cc-inner .brand-link .hs-mega .j-nav-variant-nested ul li.cc-nav-parent > a,
#cc-inner .brand-link .hs-mega .j-nav-variant-nested > ul > li:hover > a,
#cc-inner .brand-link .hs-mega .j-nav-variant-nested > ul > li a.cc-nav-current,
#cc-inner .brand-link .hs-mega .j-nav-variant-nested > ul > li > ul > li a:hover,
#cc-inner .brand-link .hs-mega .j-nav-variant-nested > ul > li > ul > li a.cc-nav-current {
  opacity: 0.6;
}

.hs-mega .j-nav-variant-nested > ul > li > ul {
  opacity: 0;
  visibility: hidden;
  width: calc(100% - 20px);
  background: #fff;
  box-shadow: 0 4px 10px -2px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  padding: 20px;
  position: absolute;
  z-index: 203001;
  left: 0;
  margin: 0 10px;
  list-style: none;
  box-sizing: border-box;
  transform: translateY(-0.5em);
  transition:
    visibility 0.2s ease,
    opacity 0.2s ease,
    transform 0.2s ease;
}



.hs-mega .j-nav-variant-nested > ul > li > ul:before,
.hs-mega .j-nav-variant-nested > ul > li > ul:after {
  content: '';
  display: table;
}

.hs-mega .j-nav-variant-nested > ul > li > ul:after {
  clear: both;
}

.hs-mega .j-nav-variant-nested > ul > li > ul > li {
  margin: 0;
  padding-bottom: 0;
  list-style: none;
  width: 25%;
  background: none;
  float: left;
  text-align: left;
}

#cc-inner #hs-container .hs-mega .j-nav-variant-nested > ul > li > ul > li a {
  color: var(--nav-color) !important;
  padding: 5px 0;
  width: 95%;
  display: inline-block;
  margin: 5px 0 !important;
  text-align: left;
  line-height: 100%;
  width: auto;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.hs-mega .j-nav-variant-nested > ul > li > ul > li > ul {
  display: block;
  padding: 0;
  margin: 10px 0 0;
  list-style: none;
  box-sizing: border-box;
}

.hs-mega .j-nav-variant-nested > ul > li > ul > li > ul:before,
.hs-mega .j-nav-variant-nested > ul > li > ul > li > ul:after {
  content: '';
  display: table;
}

.hs-mega .j-nav-variant-nested > ul > li > ul > li > ul:after {
  clear: both;
}

.hs-mega .j-nav-variant-nested > ul > li > ul > li > ul > li {
  float: left;
  width: 100%;
  padding: 2px 0;
  margin: 0;
  font-size: 0.8em;
}

#cc-inner .hs-mega .j-nav-variant-nested > ul > li > ul > li > ul > li a {
  border: 0;
}

.hs-mega .j-nav-variant-nested > ul > li > ul.normal-sub {
  width: 210px;
  left: auto;
}

.hs-mega .j-nav-variant-nested > ul > li > ul.normal-sub > li {
  width: 100%;
}

.hs-mega .j-nav-variant-nested > ul > li > ul.normal-sub > li a {
  border: 0 !important;
  padding: 0.4em 0 !important;
  margin: 0;
}

.hs-mega nav ul li:hover > ul,
nav.hs-mega ul li:hover > ul {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease;
}
.hs-mega .has-icon-1 .more:after,
.hs-mega .has-icon-2 .more:after,
.hs-mega .has-icon-3 .more:after,
.hs-mega .has-icon-1 .jmd-nav__list-item-0 .jmd-nav__toggle-button:after,
.hs-mega .has-icon-2 .jmd-nav__list-item-0 .jmd-nav__toggle-button:after,
.hs-mega .has-icon-3 .jmd-nav__list-item-0 .jmd-nav__toggle-button:after {
  position: relative;
  right: 20px;
  top: 0px;
  padding: 5px;
}

.hs-mega .has-icon-1 .jmd-nav__list-item-1 .jmd-nav__toggle-button:after,
.hs-mega .has-icon-2 .jmd-nav__list-item-1 .jmd-nav__toggle-button:after,
.hs-mega .has-icon-3 .jmd-nav__list-item-1 .jmd-nav__toggle-button:after {
  display: none;
}

#cc-inner
  .has-left-nav.has-custom-logo
  .has-icon-1
  .jmd-nav__list-item-0
  .jmd-nav__toggle-button:not(
    .has-left-nav.has-custom-logo
      .is-sticky
      .has-icon-1
      .jmd-nav__list-item-0
      .jmd-nav__toggle-button
  ):not(
    #cc-inner
      .has-left-nav.has-custom-logo
      .has-icon-1
      .jmd-nav__list-item-1
      .jmd-nav__toggle-button
  ):after,
#cc-inner
  .has-left-nav.has-custom-logo
  .has-icon-2
  .jmd-nav__list-item-0
  .jmd-nav__toggle-button:not(
    .has-left-nav.has-custom-logo
      .is-sticky
      .has-icon-2
      .jmd-nav__list-item-0
      .jmd-nav__toggle-button
  ):not(
    #cc-inner
      .has-left-nav.has-custom-logo
      .has-icon-2
      .jmd-nav__list-item-1
      .jmd-nav__toggle-button
  ):after,
#cc-inner
  .has-left-nav.has-custom-logo
  .has-icon-3
  .jmd-nav__list-item-0
  .jmd-nav__toggle-button:not(
    .has-left-nav.has-custom-logo
      .is-sticky
      .has-icon-3
      .jmd-nav__list-item-0
      .jmd-nav__toggle-button
  ):not(
    #cc-inner
      .has-left-nav.has-custom-logo
      .has-icon-3
      .jmd-nav__list-item-1
      .jmd-nav__toggle-button
  ):after {
  right: 30px;
}

.has-icon-1 .jmd-nav__list-item-0 .jmd-nav__toggle-button:after,
.has-icon-1 .more:after {
  content: '\f107';
  font-family: FontAwesome;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  font-size: 80%;
}
.has-icon-1 .jmd-nav__list-item-1 .jmd-nav__toggle-button:after {
  right: 1em;
}

.has-icon-2 .jmd-nav__list-item-0 .jmd-nav__toggle-button:after,
.has-icon-2 .more:after {
  content: '\f0d7';
  font-family: FontAwesome;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  font-size: 80%;
}

.has-icon-2 .jmd-nav__list-item-1 .jmd-nav__toggle-button:after {
  right: 1em;
}

.has-icon-3 .jmd-nav__list-item-0 .jmd-nav__toggle-button:after,
.has-icon-3 .more:after {
  content: '\2b';
  font-family: FontAwesome;
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  font-size: 80%;
}

.has-icon-3 .jmd-nav__list-item-1 .jmd-nav__toggle-button:after {
  right: 0.8em;
}

/* mobile menu */
.jmd-nav {
  overflow-y: auto;
  box-sizing: border-box;
  padding: 80px 0;
  text-align: left;
  word-wrap: break-word;
}

.jmd-nav .jmd-nav__toggle-button {
  width: 22px;
  width: 2.2rem;
  height: 22px;
  height: 2.2rem;
  position: absolute;
  right: 0px;
  outline: 0;
  cursor: pointer;
  border: none;
  background-color: rgba(120, 120, 120, 0.3);
  -webkit-tap-highlight-color: transparent;
  text-align: center;
  display: block;
  border-radius: 0;
  top: 0;
}

.jmd-nav .jmd-nav__toggle-button:before {
  -webkit-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  transform: rotate(180deg);
}

.jmd-nav .jmd-nav__toggle-button:after {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.jmd-nav .jmd-nav__toggle-button:after,
.jmd-nav .jmd-nav__toggle-button:before {
  content: '';
  border-radius: 0.1rem;
  position: absolute;
  width: 14px;
  height: 1px;
  left: 10px;
  top: 16px;
  background-color: #fff;
  transition: all 0.3s ease-in-out;
}

.jmd-nav .jmd-nav__item--last-opened > .jmd-nav__toggle-button:after,
.jmd-nav .jmd-nav__item--last-opened > .jmd-nav__toggle-button:before {
  -webkit-transform: rotate(0);
  -ms-transform: rotate(0);
  transform: rotate(0);
}

.jmd-nav .jmd-nav__toggle-button {
  display: block;
}

.jmd-nav ul {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

.jmd-nav li {
  position: relative;
  display: block;
}

.jmd-nav a:link,
.jmd-nav a:visited,
.slicknav_nav a {
  background-color: transparent;
  box-sizing: border-box;
  color: inherit;
  display: block;
  padding: 10px 55px 10px 5px;
  margin: 5px 0;
  text-decoration: none;
  text-align: left;
  border-bottom: 0px solid rgba(100, 100, 100, 0.1);
  -webkit-transition: all 200ms linear;
  -o-transition: all 200ms linear;
  -moz-transition: all 200ms linear;
}

.jmd-nav__item--parent > a:link,
.jmd-nav .j-nav-current > a:link,
.jmd-nav .j-nav-current > a:visited,
.jmd-nav a:active,
.jmd-nav a:focus,
.jmd-nav a:hover {
  opacity: 0.6;
}

.jmd-nav .j-nav-has-children > ul {
  display: none;
}

.jmd-nav .jmd-nav__item--last-opened > ul {
  display: block;
}

.jmd-nav .j-nav-level-0 > li:last-child {
  margin-bottom: 45px;
}

.jmd-nav .j-nav-level-1 a:link,
.jmd-nav .j-nav-level-1 a:visited {
  padding-left: 30px;
}

.jmd-nav .j-nav-level-2 a:link,
.jmd-nav .j-nav-level-2 a:visited {
  padding-left: 50px;
}
.is-multilingual .jmd-nav .jmd-nav__list-item-0.jmd-nav__item--current > ul,
.is-multilingual .jmd-nav .jmd-nav__list-item-0.jmd-nav__item--parent > ul {
  display: block;
}

.is-multilingual
  .jmd-nav
  .jmd-nav__list-item-0.jmd-nav__item--current
  > .jmd-nav__toggle-button:after,
.is-multilingual
  .jmd-nav
  .jmd-nav__list-item-0.jmd-nav__item--current
  > .jmd-nav__toggle-button:before,
.is-multilingual
  .jmd-nav
  .jmd-nav__list-item-0.jmd-nav__item--parent
  > .jmd-nav__toggle-button:after,
.is-multilingual
  .jmd-nav
  .jmd-nav__list-item-0.jmd-nav__item--parent
  > .jmd-nav__toggle-button:before {
  -webkit-transform: rotate(0);
  -ms-transform: rotate(0);
  transform: rotate(0);
}

.cc-pagemode-overlay .multilingual-language-selector-container,
.cc-page-blog .multilingual-language-selector-container {
  display: none;
}

.multilingual-language-link {
  margin: 10px 5px;
  float: left;
}
.multilingual-language-active {
  opacity: 0.7;
}

/*** new matrix hero section ***/
.jtpl-background-area {
  height: auto;
  /* width: 100vw; */
  top: 0;
  left: 0;
  position: relative;
}

.jtpl-background-area,
#hs-video,
.matrix-hero {
  position: relative;
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .jtpl-background-area {
    position: absolute;
  }
}

/* matrix hero height for custom pages  */
.has-fullscreen-hero .jqbga-container,
.has-fullscreen-hero .matrix-hero {
  max-height: inherit !important;
  min-height: 100vh !important;
  /* width:100vw!important;*/
  height: auto;
  display: block;
}

.has-fullscreen-hero .hs-header {
  position: absolute;
}

/* hide matrix hero using body class */
.no-hero .matrix-hero,
.no-hero .cc-indexpage .matrix-hero,
.no-hero .main-page .matrix-hero,
.no-hero .matrix-hero {
  display: none !important;
}

.no-hero-overlay .matrix-hero .hs-overlay,
.no-hero-overlay .cc-indexpage .matrix-hero .hs-overlay,
.no-hero-overlay .main-page .matrix-hero .hs-overlay {
  display: none !important;
}

.is-matrix.has-btm-arrow:after,
.is-matrix-block.has-btm-arrow:after {
  content: '';
  position: absolute;
  bottom: 5em;
  left: 50%;
  width: 24px;
  height: 24px;
  margin-left: -12px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-animation: sdb05 1.5s infinite;
  animation: sdb05 1.5s infinite;
  box-sizing: border-box;
}

@-webkit-keyframes sdb05 {
  0% {
    -webkit-transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    -webkit-transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}

@keyframes sdb05 {
  0% {
    transform: rotate(-45deg) translate(0, 0);
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  100% {
    transform: rotate(-45deg) translate(-20px, 20px);
    opacity: 0;
  }
}

.no-btm-arrow.cc-indexpage .matrix-hero:after,
.no-btm-arrow.main-page .matrix-hero:after,
#downbutton:after,
.thumbnail-hover:after {
  display: none;
}

@media only screen and (max-width: 745px) {
  .has-btm-arrow:after:not(.has-fullscreen-hero),
  .matrix-hero:after {
    display: none !important;
  }
}

@media only screen and (min-width: 290px) and (max-width: 745px) {
  .rel-mobile-only {
    position: relative !important;
    top: 0 !important;
  }
}

.hs-content .is-header {
  display: none;
}

/* animated underlined nav */

.snip-nav {
  padding-top: 0;
}

.snip-nav * {
  box-sizing: border-box;
}

.snip-nav li {
  display: inline-block;
  list-style: outside none none;
  margin: 0;
  padding: 0;
}

.snip-nav a {
  line-height: 120%;
  opacity: 1 !important;
  position: relative;
}

.snip-nav a:before,
.snip-nav a:after {
  position: absolute;
  -webkit-transition: all 0.35s ease;
  transition: all 0.35s ease;
}

.snip-nav a:before {
  bottom: 0;
  display: block;
  height: 2px;
  width: 0%;
  content: '';
  background-color: currentcolor;
}

.snip-nav_ ul li ul a:before {
  background-color: #333;
}

.snip-nav a:after {
  left: 0;
  top: 0;
  padding: 0.5em 0;
  position: absolute;
  content: attr(data-hover);
  color: #444;
  white-space: nowrap;
  max-width: 0%;
  overflow: hidden;
}

ul.tabs-nav.snip-nav > li > a:hover,
ul.tabs-nav.snip-nav > li.active > a:before,
.snip-nav a:hover:before,
.snip-nav .current a:before,
.snip-nav ul li.cc-nav-current > a:before,
.snip-nav ul li.cc-nav-parent > a:before,
.cc-nav-current.multilingual-nav-link:before,
.cc-nav-parent.multilingual-nav-link:before,
.snip-nav .multilingual-language-active:before{
  opacity: 1;
  width: 100%;
  transform: scaleX(1);
  transform-origin: bottom left;
}

.snip-nav a:hover:after,
.snip-nav .current a:after {
  max-width: 100%;
}

#cc-inner .snip-nav ul li a:link,
#cc-inner .snip-nav ul li a:visited {
  padding: 5px 0;
  margin: 10px 20px;
}

nav.snip-nav ul ul li a:link,
nav.snip-nav ul ul li a:visited {
  padding: 5px 0;
  margin: 7px 20px;
  color: #333 !important;
  background: transparent !important;
}

.snip-nav ul ul a:before {
}

.has-custom-nav
  .snip-nav
  ul
  :last-child
  ul
  ul:not(.has-custom-nav .hs-mega .snip-nav ul:last-child ul):not(
    .has-left-nav.has-center-logo .snip-nav ul :last-child ul ul
  ) {
  position: absolute;
  left: -190px;
  max-width: 190px;
  top: 0;
}