@charset "UTF-8";
:root {
  --white: #FFFFFF;
  --black: #000000;
  --primary: #FFCE43;
  --secondary: #212121;
  --green-colorbar: #44c19b;
  --green-success: #14b8a5;
  --green-50: #ecf9f7;
  --green-100: #b6e2dd;
  --green-200: #bbf7d0;
  --red-error: #e6285b;
  --red-error-light: #fdedf1;
  --red-50: #fef2f2;
  --red-200: #fecaca;
  --orange-50: #fef3e7;
  --orange-100: #fad19e;
  --orange-500: #f59e0b;
  --blue-50: #eff6ff;
  --blue-100: #a7c1f1;
  --blue-200: #bfdbfe;
  --blue-500: #3b82f6;
  --grey-50: #f9fbff;
  --grey-100: #fafafa;
  --grey-200: #e9ecf1;
  --grey-300: #d0d3d7;
  --grey-400: #8a8e93;
  --grey-500: #52565b;
  --topbar-bg-color: #eeeff6;
  --body-font-family: "Source Sans Pro", sans-serif;
  --title-font-family: "Source Serif 4", serif;
  --title-font-weight: 700;
  --radius-rounded: 1000px;
  --shadow-light: 0px 2px 6px 0px rgba(0, 0, 0, 0.05), 0px 12px 24px 0px rgba(0, 0, 0, 0.05);
  --shadow-small: 0px 12px 24px rgba(0, 0, 0, 0.05), 0px 2px 6px rgba(0, 0, 0, 0.05), 0px 1px 1px rgba(0, 0, 0, 0.05);
  --shadow-medium: 0px 12px 24px rgba(0, 0, 0, 0.1), 0px 2px 6px rgba(0, 0, 0, 0.05), 0px 1px 1px rgba(0, 0, 0, 0.05);
  --shadow-float: 0px 2.8px 2.2px rgba(0, 0, 0, 0.02), 0px 6.7px 5.3px rgba(0, 0, 0, 0.028), 0px 12.5px 10px rgba(0, 0, 0, 0.035), 0px 22.3px 17.9px rgba(0, 0, 0, 0.042), 0px 41.8px 33.4px rgba(0, 0, 0, 0.05), 0px 100px 80px rgba(0, 0, 0, 0.07);
}

/* Title font */
@font-face {
  font-family: "Source Serif 4";
  font-display: swap;
  font-style: normal;
  font-stretch: normal;
  src: url("source-serif/WOFF2/TTF/SourceSerif4Display-Bold.ttf.woff2") format("woff2"), url("source-serif/WOFF/OTF/SourceSerif4Display-Bold.otf.woff") format("woff"), url("source-serif/OTF/SourceSerif4Display-Bold.otf") format("opentype"), url("source-serif/TTF/SourceSerif4Display-Bold.ttf") format("truetype");
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xK3dSBYKcSV-LCoeQqfX1RYOo3qNq7lujVj9_mf.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xK3dSBYKcSV-LCoeQqfX1RYOo3qOK7lujVj9w.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xK1dSBYKcSV-LCoeQqfX1RYOo3qPZ7psDJB9cme_xc.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xK1dSBYKcSV-LCoeQqfX1RYOo3qPZ7nsDJB9cme.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 600;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwmRdu3cOWxy40.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 600;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKydSBYKcSV-LCoeQqfX1RYOo3i54rwlxdu3cOWxw.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 600;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZY4lCdi18S0xR41YDw.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 600;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZY4lCds18S0xR41.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwmRdu3cOWxy40.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKydSBYKcSV-LCoeQqfX1RYOo3ig4vwlxdu3cOWxw.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZZclSdi18S0xR41YDw.woff2) format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: "Source Sans Pro";
  font-style: italic;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/sourcesanspro/v23/6xKwdSBYKcSV-LCoeQqfX1RYOo3qPZZclSds18S0xR41.woff2) format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
.hidden {
  display: none !important;
}

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

@media (min-width: 728px) and (max-width: 959px) {
  .hidden-tablet {
    display: none !important;
  }
}

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

@media (min-width: 728px) {
  .visible-mobile {
    display: none !important;
  }
}

.visible-tablet {
  display: none !important;
}
@media (min-width: 728px) and (max-width: 959px) {
  .visible-tablet {
    display: block !important;
  }
}

@media (max-width: 959px) {
  .visible-desktop {
    display: none !important;
  }
}

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

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

* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

*:focus {
  outline: none;
}

a:focus,
button:focus {
  outline: 2px solid var(--primary);
}

html {
  font-size: 16px;
}

body {
  color: var(--secondary);
  font-size: 16px;
  line-height: 1.5;
}

body, p, button {
  font-family: var(--body-font-family);
  font-style: normal;
  font-weight: 400;
  text-decoration: none;
}

label,
.label-text {
  font-family: var(--body-font-family);
  font-style: normal;
  font-size: 16px;
  font-weight: 600;
  text-decoration: none;
}

.o-header {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin: 32px auto 0;
  flex-wrap: nowrap;
  align-items: center;
  max-height: 100vh;
}

.page-content-container {
  max-width: 100%;
}

.main-container section.container {
  max-width: 728px;
  margin: 0 auto;
  padding: 24px;
}

ul, ol, .fa-ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

a {
  text-decoration: none;
  color: var(--secondary);
}
a:visited {
  color: var(--secondary);
}

body, .page-header {
  padding: 0;
  margin: 0;
  border: none;
}

.content-wrapper {
  max-width: none;
  margin: 0;
  padding: 0;
}

.dashboard {
  position: relative;
  max-width: 1140px;
  margin: 0 auto;
  padding-bottom: 140px;
}

img {
  max-width: 100%;
  display: block;
  height: auto;
}

hr {
  height: 1px;
  margin: 16px 0;
  border: none;
  background: var(--grey-200);
}

h1, h2, h3, h4, h5, h6 {
  margin: 16px auto;
  line-height: 1.2;
}

h1,
h2 {
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  line-height: 1.2;
}

h1 {
  font-size: clamp(36px, 5vw, 56px);
}

h2 {
  font-size: clamp(28px, 4vw, 40px);
}

h3 {
  font-size: clamp(22px, 3vw, 30px);
}

h4 {
  font-size: clamp(18px, 2.4vw, 24px);
}

h5 {
  font-size: clamp(16px, 2vw, 20px);
}

h6 {
  font-size: clamp(14px, 1.3vw, 18px);
}

p {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.5;
  margin: 16px auto;
  color: var(--secondary);
}

ul, ol {
  margin: 16px 0 0 32px;
  padding: 0;
  list-style: disc;
}
ul li, ol li {
  margin: 0 0 4px;
  padding: 0;
  list-style: disc;
}

blockquote:not(:empty) {
  position: relative;
  margin: 24px 0;
  border: none !important;
  padding: 36px 36px 36px 90px !important;
  color: var(--secondary) !important;
  background: #fff1e6 !important;
  border-radius: 8px;
}
@media (max-width: 959px) {
  blockquote:not(:empty) {
    margin: 20px 0;
    padding: 20px 24px;
  }
}
blockquote:not(:empty)::before {
  content: "";
  position: absolute;
  top: 24px;
  left: 32px;
  width: 40px;
  height: 40px;
  background-color: var(--primary);
  mask-image: url("/static/axeptio/custom/icons/quote-mark.svg");
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}
@media (max-width: 959px) {
  blockquote:not(:empty)::before {
    top: 12px;
    left: 12px;
  }
}
blockquote:not(:empty) p,
blockquote:not(:empty) em {
  color: var(--secondary) !important;
}
blockquote:not(:empty) p {
  margin: 0;
  padding: 0;
  font-size: 16px;
  line-height: 1.7;
  font-style: italic;
  color: var(--secondary) !important;
}
@media (max-width: 959px) {
  blockquote:not(:empty) p {
    font-size: 15px;
    line-height: 1.6;
  }
}
blockquote:not(:empty) p + p {
  margin-top: 16px;
}
blockquote:not(:empty) p:empty {
  display: none;
}
blockquote:not(:empty) cite,
blockquote:not(:empty) footer {
  display: block;
  margin-top: 16px;
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  color: var(--grey-500);
}
blockquote:not(:empty) cite::before,
blockquote:not(:empty) footer::before {
  content: "— ";
}

blockquote.blockquote-centered {
  text-align: center;
  border-left: none;
  border-radius: 8px;
  padding: 32px;
}
blockquote.blockquote-centered::before {
  position: static;
  display: block;
  margin-bottom: 8px;
  opacity: 0.5;
}

blockquote.blockquote-minimal {
  background: transparent;
  border-left-width: 3px;
  padding: 16px 24px;
}
blockquote.blockquote-minimal::before {
  display: none;
}

.topbar {
  display: flex;
  height: 52px;
  padding: 0 30px;
  gap: 12px;
  align-items: center;
  background-color: var(--topbar-bg-color);
}
@media (max-width: 959px) {
  .topbar {
    padding: 0 24px;
  }
}
.topbar a[id^=btn-lang-] {
  display: inline-flex;
  padding: 0;
  margin: 0 !important;
  cursor: pointer;
  transition: all 0.2s ease;
  position: relative;
  opacity: 0.5;
  filter: grayscale(50%);
}
.topbar a[id^=btn-lang-] > img {
  display: block;
  width: 24px !important;
  height: 18px !important;
  object-fit: cover;
  border-radius: 4px;
}
.topbar a[id^=btn-lang-]:hover {
  opacity: 0.8;
  filter: grayscale(0%);
  border-color: rgba(0, 0, 0, 0.1);
}

html[lang=fr] .topbar a#btn-lang-fr,
html[lang=en] .topbar a#btn-lang-en {
  opacity: 1;
  filter: grayscale(0%);
}

html[lang=fr] .topbar a#btn-lang-fr::after,
html[lang=en] .topbar a#btn-lang-en::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -8px;
  width: 5px;
  height: 5px;
  background: var(--secondary, #212121);
  border-radius: var(--radius-rounded);
}

.global-header {
  z-index: 999;
  position: relative;
  margin: 0;
  padding: 0;
  box-shadow: none;
  overflow: visible;
}
.global-header .nav-links .secondary > .nav-item,
.global-header .nav-tab {
  color: var(--secondary);
  font-weight: 600;
}
@media (min-width: 960px) {
  .global-header .nav-links .secondary > .nav-item,
  .global-header .nav-tab {
    padding: 0;
    margin: 0;
  }
}
.global-header .nav-links {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding: 0;
  margin: 0;
}
.global-header .nav-links .secondary > div:not([class]) {
  display: flex;
  gap: 8px;
}
.global-header .nav-links .secondary .nav-item:nth-last-child(2) {
  display: none;
}
.global-header .nav-links .main,
.global-header .nav-links .secondary {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 16px;
}
.global-header .nav-links .main .nav-item a,
.global-header .nav-links .secondary .nav-item a {
  padding: 0;
  margin: 0;
  border: none;
  font-weight: 600;
}
.global-header .nav-links .main .nav-item a:hover,
.global-header .nav-links .secondary .nav-item a:hover {
  border-bottom-color: var(--primary);
}
@media (min-width: 960px) {
  .global-header .nav-links .main .nav-item a,
  .global-header .nav-links .secondary .nav-item a {
    border: none !important;
  }
}
@media (min-width: 960px) {
  .global-header .nav-links .main,
  .global-header .nav-links .secondary {
    float: none;
    margin: 0;
  }
}

.global-header .main-header {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 90px;
  padding: 0 30px;
}
@media (max-width: 959px) {
  .global-header .main-header {
    padding: 0 24px;
  }
}
@media (min-width: 960px) {
  .global-header .main-header {
    justify-content: space-between;
  }
}
.global-header .header-logo {
  display: block;
  margin: 0;
}
.global-header .header-logo a[href="/dashboard"] {
  margin: 0;
  width: 150px;
  height: 29px;
  background-image: url("/static/axeptio/custom/images/logo-axeptio.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: block;
}
@media (max-width: 959px) {
  .global-header .header-logo a[href="/dashboard"] {
    width: 42px;
    height: 42px;
    background-image: url("/static/axeptio/custom/images/logo-axeptio-icon.svg");
  }
}
.global-header .header-logo a[href="/dashboard"] img.logo {
  display: none;
}

input[type=submit],
input[type=button],
input[type=reset],
button[type=submit],
button[type=button],
button[type=reset],
button,
.button,
.btn {
  font-family: var(--body-font-family);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 700;
  color: var(--white);
  background-color: var(--secondary);
  border: 1px solid var(--secondary);
}
.btn:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}
.btn:visited {
  color: var(--white);
}
.btn:hover {
  color: var(--primary);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.btn[href^="/login"] {
  background-color: var(--secondary);
  border-color: var(--secondary);
  color: var(--white);
}
.btn[href^="/login"]:hover {
  color: var(--primary);
  background-color: var(--secondary);
  border: 1px solid var(--secondary);
}

.button,
.paragon__btn,
.sequence-nav-button {
  text-shadow: none;
  box-shadow: none;
  border-radius: 24px;
  background: var(--secondary);
  color: white;
  border: none;
  font-size: 16px;
  font-weight: 700;
  padding: 10px 16px;
  cursor: pointer;
}

#delete-account-btn {
  height: 44px;
  padding: 0 16px;
  color: var(--red-error);
  border-radius: var(--radius-rounded);
  background-color: var(--red-error-light);
}
#delete-account-btn:focus {
  box-shadow: 0 0 0 2px rgba(255, 0, 0, 0.15);
}
#delete-account-btn:hover {
  color: var(--white);
  background-color: var(--red-error);
}

.action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 44px;
  padding: 0 16px;
  border-radius: 22px;
  background: var(--white);
  color: var(--secondary);
  font-weight: 700;
  cursor: pointer;
  transition: background-color 0.2s ease, box-shadow 0.2s ease, transform 0.02s ease;
}

.action-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  color: var(--secondary);
  background-color: var(--primary);
  border: 1px solid var(--primary);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  border-color: transparent;
  font-size: 15px;
  font-weight: 700;
  color: var(--secondary);
  background: var(--primary);
  border-radius: var(--radius-rounded);
}
.action-primary:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}
.action-primary:hover {
  color: var(--primary);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.action-primary:hover {
  color: var(--primary);
  background: var(--secondary);
}

.field-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 0;
  margin-top: 8px;
  height: auto;
  border: none;
  background: transparent;
  color: var(--secondary);
  font-weight: 600;
  text-decoration: underline;
  cursor: pointer;
}
.field-link.reset-help {
  text-decoration: none;
}

.window-classic,
.window-premium {
  margin: 0;
  min-width: 0;
  max-height: 100vh;
}

.versions-section,
.versions-windows {
  background-color: var(--grey-200);
}

.versions-section {
  margin-top: -10px;
  padding: 40px 0;
  min-height: 100vh;
}
@media (max-width: 959px) {
  .versions-section {
    padding: 40px 24px;
    padding-bottom: 80px;
  }
}

.versions-windows {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 32px;
  min-width: 1px;
  width: 100%;
  max-width: 960px;
  min-height: 0;
  height: auto;
  margin: 0 auto;
  background-color: transparent;
}
@media (max-width: 959px) {
  .versions-windows {
    flex-wrap: nowrap;
    flex-direction: column;
  }
}
.versions-windows .window-classic,
.versions-windows .window-premium {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  flex: 1;
  width: auto;
  max-width: 100%;
  border-radius: 18px;
  box-shadow: var(--shadow-float);
  overflow: auto;
}
.versions-windows .window-classic .btn[data-i18n=contact],
.versions-windows .window-premium .btn[data-i18n=contact] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  color: var(--secondary);
  background-color: var(--primary);
  border: 1px solid var(--primary);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
}
.versions-windows .window-classic .btn[data-i18n=contact]:hover,
.versions-windows .window-premium .btn[data-i18n=contact]:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}
.versions-windows .window-classic .btn[data-i18n=contact]:hover,
.versions-windows .window-premium .btn[data-i18n=contact]:hover {
  color: var(--primary);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
@media (max-width: 959px) {
  .versions-windows .window-classic,
  .versions-windows .window-premium {
    max-width: 100%;
  }
}

.window-header {
  align-items: center;
  display: flex;
  height: 48px;
  padding: 14px 28px;
  border-radius: 18px 18px 0 0;
}

.window-header-premium {
  background-color: #bdefe1;
}

.window-header-btns {
  width: 64px;
  margin: auto 0;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-around;
}

.window-header-bar {
  width: 100%;
  height: 16px;
  margin: auto 0 auto 12px;
  background-color: #fef8e5;
}

.window-content {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-wrap: nowrap;
  justify-content: space-evenly;
  align-content: center;
  align-items: center;
  text-align: center;
  padding: 24px 24px 42px;
}
.window-content p {
  margin: 0 0 8px;
  max-width: 400px;
  height: auto;
  color: var(--secondary);
  font-size: clamp(14px, 2vw, 16px);
  font-weight: 400;
  line-height: 24px;
}
.window-content div img {
  max-width: 160px;
  height: auto;
  margin: 16px;
}

.my-courses {
  max-width: 1140px;
  margin: 0 auto;
}

.wrapper-header-courses .header-courses {
  font-family: var(--title-font-family);
  font-size: clamp(36px, 4vw, 54px);
  text-align: center;
}

.listing-courses {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
  gap: 40px;
  align-content: start;
  padding: 20px;
}
@media (max-width: 959px) {
  .listing-courses {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 20px 24px;
  }
  .listing-courses .course {
    padding: 24px;
  }
}
.listing-courses .course-item {
  list-style: none;
}
.listing-courses .course {
  position: relative;
  background: var(--white);
  border-radius: 8px;
  padding: 32px 32px 28px;
  box-shadow: var(--shadow-float);
}
.listing-courses .wrapper-course-image {
  display: block !important;
  margin-bottom: 18px;
}
.listing-courses .wrapper-course-image[aria-hidden=true] {
  display: block !important;
}
.listing-courses .wrapper-course-image a.cover {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 156px;
  height: 156px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.listing-courses .wrapper-course-image img.course-image {
  display: none;
}
.listing-courses .wrapper-course-image a.cover[href*="+FR+"] {
  background-image: url("/static/axeptio/custom/images/flag-fr.svg");
}
.listing-courses .wrapper-course-image a.cover[href*="+EN+"] {
  background-image: url("/static/axeptio/custom/images/flag-uk.svg");
}
.listing-courses .wrapper-course-details {
  display: grid;
  gap: 10px;
}
.listing-courses .course-title {
  margin: 0;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: clamp(22px, 3vw, 30px);
}
.listing-courses .course-title a {
  text-decoration: none;
}
.listing-courses .course-info {
  font-size: 16px;
}
.listing-courses .wrapper-course-actions {
  margin-top: 14px;
}
.listing-courses .course-actions {
  display: flex;
  align-items: center;
  gap: 14px;
}
.listing-courses .enter-course.course-target-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 700;
  color: var(--white);
  background-color: var(--secondary);
  border: 1px solid var(--secondary);
  font-weight: 600;
  padding: 10px 16px;
}
.listing-courses .enter-course.course-target-link:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}
.listing-courses .enter-course.course-target-link:visited {
  color: var(--white);
}
.listing-courses .enter-course.course-target-link:hover {
  color: var(--primary);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.listing-courses .action.action-more {
  width: 36px;
  height: 36px;
  padding: 0;
  border-radius: 50%;
  background: var(--white);
}

.hero {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin: 16px auto 48px;
  flex-wrap: wrap;
  align-items: center;
  max-width: 80vw;
  max-height: 100vh;
}
.hero > div > div:first-child {
  width: 100% !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
}
.hero > div {
  position: relative;
  z-index: 10;
}
.hero > div p {
  font-size: 20px !important;
}
.hero .circled-word {
  left: -46px !important;
}
@media (max-width: 959px) {
  .hero .circled-word {
    left: auto !important;
  }
}
.hero .circled-word .circled-word-target {
  z-index: 2;
  position: relative;
  left: auto !important;
}
.hero .circled-word img {
  z-index: 1;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.hero h1 {
  max-width: 100%;
  text-align: left;
}
@media (max-width: 959px) {
  .hero h1 {
    text-align: center;
  }
}
.hero .hero-img-section {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 50%;
}
@media (max-width: 959px) {
  .hero .hero-img-section {
    max-width: 100%;
  }
}

.main-h1 {
  font-family: var(--title-font-family) !important;
  font-size: 56px;
  line-height: 1.2;
  justify-content: flex-start;
}
@media (max-width: 959px) {
  .main-h1 {
    font-size: 36px;
    justify-content: center !important;
  }
}

.u-field {
  margin-bottom: 32px;
}
.u-field:last-child {
  margin-bottom: 0;
}
@media (max-width: 959px) {
  .u-field {
    margin-bottom: 28px;
  }
}

.u-field-title {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
  font-size: 14px;
  color: var(--secondary);
}

.u-field-value {
  font-size: 15px;
  color: var(--secondary);
  line-height: 1.5;
}

.u-field-readonly .u-field-value {
  padding: 12px 0;
  color: var(--grey-400);
}

.u-field-dropdown select {
  width: 100%;
  padding: 12px 40px 12px 16px;
  border: 2px solid var(--grey-200);
  border-radius: 8px;
  font-size: 15px;
  color: var(--secondary);
  background: var(--white);
  cursor: pointer;
  appearance: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.u-field-dropdown select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(255, 206, 67, 0.2);
}
.u-field-dropdown .icon-caret-down {
  display: block;
  z-index: 10;
  position: absolute;
  top: 42px;
  right: 12px;
  width: 16px;
  height: 16px;
  pointer-events: none;
  background-image: url("/static/axeptio/custom/icons/arrow-down.svg");
  background-size: 16px 16px;
  background-repeat: no-repeat;
}
.u-field-dropdown .u-field-value {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.u-field-dropdown .u-field-value-display {
  appearance: none;
  position: relative;
  padding: 0;
  margin-top: 6px;
  font-size: 14px;
  background: none;
  border: none;
  cursor: default;
}
.u-field-dropdown .u-field-value-display .u-field-value-readonly {
  display: flex;
  align-items: center;
  gap: 4px;
}
.u-field-dropdown .u-field-value-display .u-field-value-readonly:not(:empty)::before {
  content: "";
  display: flex;
  width: 14px;
  height: 14px;
  background-image: url("/static/axeptio/custom/icons/check.svg");
  background-size: 14px 14px;
  background-repeat: no-repeat;
  background-position: center;
}
.u-field-dropdown .u-field-value-display .u-field-value-readonly:empty {
  display: none;
}
.u-field-dropdown .u-field-value-display:focus {
  outline: none;
}

.u-field-button .u-field-link {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 0 18px;
  height: 44px;
  font-weight: 600;
  font-size: 14px;
  border: none;
  color: var(--white);
  background: var(--secondary);
  border-radius: var(--radius-rounded);
  text-decoration: none;
  cursor: pointer;
  transition: all 0.2s ease;
}
.u-field-button .u-field-link:hover {
  color: var(--white);
  background: var(--secondary);
}
.u-field-button .u-field-link:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.u-field-message {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  line-height: 1.4;
  color: var(--grey-400);
}
.u-field-message .u-field-message-notification {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 14px;
  font-weight: 600;
  margin-bottom: 4px;
}
.u-field-message .u-field-message-notification .fa.fa-check,
.u-field-message .u-field-message-notification .fa.fa-check::before {
  width: 14px;
  height: 14px;
  mask-image: url("/static/axeptio/custom/icons/check.svg");
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  background: var(--green-success);
}
.u-field-message .u-field-message-notification[aria-live=polite] {
  color: var(--green-success);
}
.u-field-message .u-field-message-notification[aria-live=assertive] {
  color: var(--red-error);
}

.ui-loading-error {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--red-error-light);
  border-left: 4px solid var(--red-error);
  border-radius: 8px;
  margin-bottom: 24px;
}
.ui-loading-error.is-hidden {
  display: none;
}
.ui-loading-error .message-error {
  color: var(--red-error);
  font-size: 18px;
}
.ui-loading-error .copy {
  color: var(--red-error);
  font-weight: 600;
  font-size: 14px;
}

.wrapper-action-more {
  position: relative;
  display: inline-block;
}

.action.action-more {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border: 1px solid var(--grey-200);
  background-color: var(--white);
  border-radius: var(--radius-rounded);
  transition: all 0.2s ease;
}
.action.action-more .fa-cog {
  width: 16px;
  height: 16px;
  transition: transform 0.2s ease;
}
.action.action-more .fa-cog::before {
  width: 16px;
  height: 16px;
}
.action.action-more:hover, .action.action-more[aria-expanded=true] {
  background-color: var(--grey-100);
}
.action.action-more:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.action.action-more[aria-expanded=true] .fa-cog {
  transform: rotate(180deg);
}

.actions-dropdown {
  display: none;
  z-index: 1000;
  position: absolute;
  top: calc(100% + 4px);
  right: 0;
  min-width: 200px;
  background: var(--white);
  border: none;
  border-radius: 6px;
  box-shadow: var(--shadow-medium);
  opacity: 0;
  transform: translateY(-8px);
  transition: opacity 0.2s ease, transform 0.2s ease;
}
.action-more[aria-expanded=true] + .actions-dropdown {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

.actions-dropdown-list {
  margin: 0;
  padding: 4px 0;
}
.actions-dropdown-list li {
  list-style: none;
}

.actions-item {
  margin: 0;
}
.actions-item .action {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 16px;
  height: 40px;
  font-weight: 600;
  border-radius: 0;
  color: inherit;
  text-decoration: none;
  transition: background-color 0.15s ease;
}
.actions-item .action:hover, .actions-item .action:focus {
  background-color: rgba(0, 0, 0, 0.05);
  outline: none;
}
.actions-item .action-unenroll {
  color: var(--red-error);
}
.actions-item .action-unenroll:hover {
  background-color: var(--red-error-light);
}

.global-header .nav-links .secondary .toggle-user-dropdown {
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  width: 36px;
  height: 36px;
  border: 1px solid var(--grey-200);
  background-color: var(--white);
  border-radius: 50%;
  transition: all 0.2s ease;
}
.global-header .nav-links .secondary .toggle-user-dropdown .fa.fa-bars,
.global-header .nav-links .secondary .toggle-user-dropdown .fa.fa-bars::before {
  width: 16px;
  height: 16px;
}
.global-header .nav-links .secondary .toggle-user-dropdown:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.global-header .nav-links .secondary .toggle-user-dropdown:hover, .global-header .nav-links .secondary .toggle-user-dropdown[aria-expanded=true] {
  background-color: var(--grey-100);
}
.global-header .nav-links .secondary .dropdown-user-menu {
  z-index: 1000;
  position: absolute;
  top: calc(100% - 16px);
  right: 30px;
  min-width: 240px;
  padding: 8px 0;
  background: var(--white);
  border: none;
  border-radius: 6px;
  box-shadow: var(--shadow-medium);
  user-select: none;
}
.global-header .nav-links .secondary .dropdown-user-menu .dropdown-item {
  margin: 0;
  border-bottom: none;
  border-radius: 0;
  transition: all 0.15s ease;
}
.global-header .nav-links .secondary .dropdown-user-menu .dropdown-item:not(:last-child) {
  border-bottom: none;
}
.global-header .nav-links .secondary .dropdown-user-menu .dropdown-item a {
  display: flex;
  align-items: center;
  padding: 0 16px;
  height: 40px;
  color: var(--secondary);
  background: var(--white);
  text-decoration: none;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  border-left: 3px solid transparent;
  transition: background-color 0.15s ease;
}
.global-header .nav-links .secondary .dropdown-user-menu .dropdown-item a:hover {
  font-weight: 700;
  background-color: #FFF8E7;
}
.global-header .nav-links .secondary .dropdown-user-menu .dropdown-item a:focus {
  outline: none;
  background-color: #FFF8E7;
}
.global-header .nav-links .secondary .dropdown-user-menu .dropdown-item a.active, .global-header .nav-links .secondary .dropdown-user-menu .dropdown-item a:active {
  font-weight: 700;
  border-left-color: var(--primary);
  background-color: #FFFAF0;
}

@media (max-width: 959px) {
  .global-header .hamburger-menu {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 24px;
    width: 30px;
    height: 20px;
    padding-bottom: 5px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: transparent;
    border: none;
    padding: 0;
    flex-shrink: 0;
    cursor: pointer;
    transition: 0.5s ease-in-out;
  }
  .global-header .hamburger-menu .line {
    position: relative;
    top: auto !important;
    width: 100%;
    height: 3px;
    background: none;
    background-color: var(--secondary);
    border-radius: 2px;
    transform: none;
    transition: all 0.3s ease;
    transform-origin: center;
  }
  .global-header .hamburger-menu .line:nth-child(1) {
    left: 0 !important;
    width: 100% !important;
  }
  .global-header .hamburger-menu .line:nth-child(4) {
    display: none;
  }
  .global-header .hamburger-menu:hover .line {
    background-color: var(--secondary);
  }
  .global-header .hamburger-menu[aria-expanded=true] .line:nth-child(1) {
    transform: translateY(8.5px) rotate(45deg);
  }
  .global-header .hamburger-menu[aria-expanded=true] .line:nth-child(2) {
    opacity: 0;
    transform: scale(0.8);
  }
  .global-header .hamburger-menu[aria-expanded=true] .line:nth-child(3) {
    transform: translateY(-8.5px) rotate(-45deg);
  }
}
@media (max-width: 959px) and (min-width: 960px) {
  .global-header .hamburger-menu {
    display: none;
  }
}
@media (max-width: 959px) {
  .main-menu {
    display: none;
  }
}

.mobile-menu {
  z-index: 1000;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  padding: 16px 0;
  margin: 0;
  margin-top: -20px;
  background: var(--white);
  box-shadow: var(--shadow-float);
  max-height: calc(100vh - 90px);
  overflow-y: auto;
  border: none;
  display: none;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: var(--grey-400) transparent;
}
.mobile-menu::-webkit-scrollbar {
  width: 6px;
}
.mobile-menu::-webkit-scrollbar-track {
  background: transparent;
}
.mobile-menu::-webkit-scrollbar-thumb {
  background-color: var(--grey-400);
  border-radius: 3px;
}
@media (max-width: 959px) {
  .mobile-menu {
    display: block;
  }
}
@media (min-width: 960px) {
  .mobile-menu {
    display: none !important;
  }
}

.mobile-nav-item {
  margin: 0;
  padding: 0;
  list-style: none;
}
.mobile-nav-item.hidden-mobile {
  display: none;
}
.mobile-nav-item a {
  display: flex;
  align-items: center;
  min-height: 40px;
  padding: 14px 24px;
  font-size: 16px;
  font-weight: 600;
  color: var(--secondary);
  text-decoration: none;
  transition: all 0.2s ease;
  background: var(--white);
}
.mobile-nav-item a:hover {
  background: var(--grey-100);
}
.mobile-nav-item a:active {
  background: var(--grey-200);
}
.mobile-nav-item a.active {
  color: var(--primary);
  font-weight: 600;
  background: var(--grey-100);
  border-left: 4px solid var(--primary);
  padding-left: 20px;
}
.mobile-nav-item.nav-tab a {
  font-weight: 600;
  font-size: 17px;
}
.mobile-nav-item.dropdown-item a {
  padding-left: 28px;
  font-size: 15px;
  font-weight: 600;
  color: var(--grey-700);
  background: var(--grey-50);
  border: none;
}
.mobile-nav-item.dropdown-item a:hover {
  background: var(--grey-100);
}
.mobile-nav-item .help-link {
  color: var(--blue-500);
}
.mobile-nav-item .help-link:hover {
  color: var(--blue-600);
}
.mobile-nav-item .discover-new-link:hover {
  color: var(--primary);
}
.mobile-nav-item:last-child a {
  border-bottom: none;
}

.mobile-nav-item.nav-tab:last-of-type a {
  border-bottom: 2px solid var(--grey-300);
}

.fa.fa-cog,
.fa.fa-search,
.fa.fa-remove,
.fa.fa-bars,
.fa.fa-check,
.fa.fa-envelope,
.fa.fa-thumbs-up,
.fa.fa-twitter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
}
.fa.fa-cog::before,
.fa.fa-search::before,
.fa.fa-remove::before,
.fa.fa-bars::before,
.fa.fa-check::before,
.fa.fa-envelope::before,
.fa.fa-thumbs-up::before,
.fa.fa-twitter::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.fa.fa-cog::before {
  background-image: url("/static/axeptio/custom/icons/cog.svg");
}

.fa.fa-search::before {
  background-image: url("/static/axeptio/custom/icons/search.svg");
}

.fa.fa-remove::before {
  background-image: url("/static/axeptio/custom/icons/remove.svg");
}

.fa.fa-bars::before {
  background-image: url("/static/axeptio/custom/icons/nav-menu-vertical.svg");
}

.fa.fa-check::before {
  background-image: url("/static/axeptio/custom/icons/check.svg");
}

.fa.fa-envelope::before {
  background-image: url("/static/axeptio/custom/icons/mail.svg");
}

.fa.fa-thumbs-up::before {
  background-image: url("/static/axeptio/custom/icons/facebook.svg");
}

.fa.fa-twitter::before {
  background-image: url("/static/axeptio/custom/icons/x.svg");
}

.input-block {
  display: block;
  width: 100%;
  height: 42px;
  padding: 12px;
  border: 1px solid var(--grey-200);
  border-radius: 6px;
  background: var(--white);
  color: var(--secondary);
  font-family: var(--body-font-family);
  font-size: 16px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.input-block:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 4px rgba(255, 206, 67, 0.25);
}
.input-block::placeholder {
  color: rgba(0, 0, 0, 0.4);
}

label .label-text {
  display: inline-block;
  margin-bottom: 8px;
  font-weight: 600;
}

.tip {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--grey-400);
}

.tip.error {
  color: var(--red-error);
}

.field-input,
.input-text {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid var(--grey-200);
  border-radius: 8px;
  font-size: 15px;
  color: var(--secondary);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.field-input:focus,
.input-text:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(255, 206, 67, 0.2);
}
.field-input::placeholder,
.input-text::placeholder {
  color: #999;
}

.paragon__form-control {
  width: 100%;
  padding: 12px 16px;
  border: 2px solid var(--grey-200);
  border-radius: 8px;
  font-size: 15px;
  color: var(--secondary);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.paragon__form-control:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(255, 206, 67, 0.2);
}
.paragon__form-control::placeholder {
  color: #999;
}
.paragon__form-control[aria-invalid=true] {
  border-color: var(--red-error);
}
.paragon__form-control[aria-invalid=true]:focus {
  border-color: var(--red-error);
  box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2);
}

.paragon__form-group label {
  display: block;
  margin-bottom: 8px;
  font-weight: 600;
  font-size: 14px;
  color: var(--secondary);
}

.paragon__invalid-feedback {
  display: block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--red-error);
}

input[type=checkbox] {
  width: 20px;
  height: 20px;
  margin: 0;
  cursor: pointer;
  border-radius: 4px;
  border: 2px solid var(--grey-300);
  outline: 2px solid transparent;
  accent-color: var(--secondary);
}

.form-field[class*=checkbox] {
  position: relative;
  min-height: 20px;
  margin: 0 !important;
  padding-left: 28px;
}
.form-field[class*=checkbox] input[type=checkbox] {
  position: absolute;
  top: 0;
  left: 0;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin: 0;
  margin-top: 2px;
  cursor: pointer;
  accent-color: var(--primary);
}
.form-field[class*=checkbox] input[type=checkbox]:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.form-field[class*=checkbox] label {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  cursor: pointer;
  margin: 0;
}
.form-field[class*=checkbox] label.error {
  font-size: 14px;
  color: var(--red-error);
}
.form-field[class*=checkbox] label .label-text {
  margin: 0;
  font-weight: 400;
  font-size: 16px;
  line-height: 1.5;
  color: var(--secondary);
}
.form-field[class*=checkbox] label .label-text a {
  color: var(--secondary);
  text-decoration: underline;
}
.form-field[class*=checkbox] label .label-text a:hover {
  color: var(--primary);
}
.form-field[class*=checkbox] label .label-optional {
  font-size: 14px;
  color: var(--grey-500);
  font-weight: 400;
}
.form-field[class*=checkbox] .tip.error {
  flex-basis: 100%;
  margin-left: 32px;
}

.division-scheme-label {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-weight: 600;
  cursor: pointer;
}

.division-scheme {
  position: relative;
  appearance: none;
  margin: 0;
  padding: 0;
  width: 20px;
  height: 20px;
  border: 2px solid var(--grey-300);
  outline: 2px solid transparent;
  border-radius: var(--radius-rounded);
  background: var(--white);
  cursor: pointer;
  vertical-align: middle;
  transition: all 0.2s ease;
}
.division-scheme:hover {
  border-color: var(--secondary);
}
.division-scheme:checked {
  border-color: var(--secondary);
  background-color: var(--secondary);
}
.division-scheme:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 7px;
  height: 7px;
  border-radius: var(--radius-rounded);
  background: var(--white);
}
.division-scheme:focus {
  outline: 2px solid var(--grey-200);
}

.user-messages {
  margin: 20px auto 0;
  padding-top: 0 !important;
  max-width: 1140px;
}
@media (max-width: 1139px) {
  .user-messages {
    padding: 0 30px;
  }
}
@media (max-width: 959px) {
  .user-messages {
    padding: 0 20px;
  }
}

.user-messages-ul {
  margin: 0;
  padding: 0;
  list-style: none;
}
.user-messages-ul li {
  margin: 0;
  padding: 0;
  list-style: none;
}

.page-banner {
  max-width: 1140px;
  margin: 0 auto;
}

.page-banner .alert {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 24px;
  margin: 16px 0;
  font-size: 16px;
  line-height: 1.6;
  border: 1px solid;
  border-left-width: 4px;
  border-radius: 4px;
}
@media (max-width: 727px) {
  .page-banner .alert {
    padding: 16px 20px;
    gap: 12px;
    font-size: 15px;
  }
}
.page-banner .alert .icon {
  flex-shrink: 0;
  font-size: 20px;
  margin-top: 2px;
}
@media (max-width: 727px) {
  .page-banner .alert .icon {
    font-size: 18px;
  }
}
.page-banner .alert .message-content {
  flex: 1;
  color: var(--secondary);
}
.page-banner .alert .message-content a {
  color: inherit;
  text-decoration: underline;
  font-weight: 600;
}
.page-banner .alert .message-content a:hover {
  opacity: 0.8;
}

.alert.alert-warning {
  background-color: var(--orange-50);
  border-color: var(--orange-100);
  color: var(--secondary);
}
.alert.alert-warning .icon {
  color: var(--orange-500);
}

.alert-info {
  background-color: var(--blue-50);
  border-color: var(--blue-200);
  color: var(--secondary);
}
.alert-info .icon {
  color: var(--blue-500);
}

.alert.alert-success {
  background-color: var(--green-50);
  border-color: var(--green-200);
  color: var(--secondary);
}
.alert.alert-success .icon {
  color: var(--green-success);
}

.alert.alert-error,
.alert.alert-danger {
  background-color: var(--red-50);
  border-color: var(--red-200);
  color: var(--secondary);
}
.alert.alert-error .icon,
.alert.alert-danger .icon {
  color: var(--red-error);
}

.alert.alert-dismiss {
  flex-shrink: 0;
  padding: 0;
  background: transparent;
  border: none;
  color: inherit;
  font-size: 20px;
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.2s ease;
}
.alert.alert-dismiss:hover {
  opacity: 1;
}
.alert.alert-dismiss:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}

.message {
  display: block;
  padding: 16px 24px;
  margin: 16px 0;
  font-size: 16px;
  line-height: 1.6;
  border: 1px solid;
  border-left-width: 4px;
  border-radius: 4px;
}
@media (max-width: 727px) {
  .message {
    padding: 16px 20px;
    font-size: 15px;
  }
}
.message h3.message-title,
.message .message-title {
  margin: 0 0 8px;
  font-family: var(--body-font-family);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.6;
  color: var(--secondary);
}
@media (max-width: 727px) {
  .message h3.message-title,
  .message .message-title {
    font-size: 15px;
  }
}

.message.message-confirmation {
  background-color: var(--green-50);
  border-color: var(--green-200);
  color: var(--secondary);
}

.message.message-warning {
  background-color: var(--orange-50);
  border-color: var(--orange-100);
  color: var(--secondary);
}

.message.message-error {
  background-color: var(--red-50);
  border-color: var(--red-200);
  color: var(--secondary);
}

.message.message-info {
  background-color: var(--blue-50);
  border-color: var(--blue-200);
  color: var(--secondary);
}

.paragon__alert {
  display: block;
  padding: 16px 24px;
  margin: 16px 0;
  font-size: 16px;
  line-height: 1.6;
  border: 1px solid;
  border-left-width: 4px;
  border-radius: 4px;
}
@media (max-width: 727px) {
  .paragon__alert {
    padding: 16px 20px;
    font-size: 15px;
  }
}
.paragon__alert .alert-dialog {
  color: var(--secondary);
}

.paragon__alert-danger {
  background-color: var(--red-50);
  border-color: var(--red-200);
  color: var(--secondary);
}

.paragon__alert-success {
  background-color: var(--green-50);
  border-color: var(--green-200);
  color: var(--secondary);
}

.paragon__alert-warning {
  background-color: var(--orange-50);
  border-color: var(--orange-100);
  color: var(--secondary);
}

.paragon__alert-info {
  background-color: var(--blue-50);
  border-color: var(--blue-200);
  color: var(--secondary);
}

.notification {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 20px;
  margin: 12px 0;
  font-size: 15px;
  line-height: 1.5;
  border: 1px solid;
  border-left-width: 4px;
  border-radius: 4px;
  transition: opacity 0.2s ease;
}
@media (max-width: 727px) {
  .notification {
    padding: 12px 16px;
    gap: 10px;
    font-size: 14px;
  }
}
.notification .icon {
  flex-shrink: 0;
  font-size: 18px;
}
@media (max-width: 727px) {
  .notification .icon {
    font-size: 16px;
  }
}
.notification .notification-message {
  flex: 1;
  color: var(--secondary);
}
.notification .notification-message a {
  color: inherit;
  text-decoration: underline;
  font-weight: 600;
}
.notification .notification-message a:hover {
  opacity: 0.8;
}
.notification .notification-btn-wrapper {
  flex-shrink: 0;
  margin-left: auto;
}
.notification .notification-btn {
  white-space: nowrap;
}
.notification.is-hidden {
  display: none !important;
}
.notification:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}

.notification.warning,
.notification.notification-gentle-alert {
  background-color: var(--orange-50);
  border-color: var(--orange-100);
  color: var(--secondary);
}
.notification.warning .icon,
.notification.notification-gentle-alert .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--white);
  background-color: var(--orange-500);
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
}
@media (max-width: 727px) {
  .notification.warning .icon,
  .notification.notification-gentle-alert .icon {
    width: 22px;
    height: 22px;
    font-size: 13px;
  }
}

.notification.success,
.notification.notification-submit {
  background-color: var(--green-50);
  border-color: var(--green-100);
  color: var(--secondary);
}
.notification.success .icon,
.notification.notification-submit .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: transparent;
  background-color: var(--green-success);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: 16px 16px;
  background-position: center;
  background-repeat: no-repeat;
}
.notification.success .icon::before,
.notification.notification-submit .icon::before {
  content: none;
}
@media (max-width: 727px) {
  .notification.success .icon,
  .notification.notification-submit .icon {
    width: 22px;
    height: 22px;
    background-size: 14px 14px;
  }
}

.notification.info {
  background-color: var(--blue-50);
  border-color: var(--blue-200);
  color: var(--secondary);
}
.notification.info .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--white);
  background-color: var(--blue-500);
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
}
@media (max-width: 727px) {
  .notification.info .icon {
    width: 22px;
    height: 22px;
    font-size: 13px;
  }
}

.notification.error,
.notification.danger {
  background-color: var(--red-50);
  border-color: var(--red-200);
  color: var(--secondary);
}
.notification.error .icon,
.notification.danger .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--white);
  background-color: var(--red-error);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M3.75 16.25L16.25 3.75' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3.75 3.75L16.25 16.25' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 14px 14px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
  font-size: 14px;
  font-weight: 700;
}
@media (max-width: 727px) {
  .notification.error .icon,
  .notification.danger .icon {
    width: 22px;
    height: 22px;
    font-size: 13px;
  }
}

.section-colorbar {
  position: relative;
  margin: 0 auto 12px;
  height: 8px;
  width: 728px;
  max-width: 728px;
  background: var(--grey-300);
  border-radius: var(--radius-rounded);
  box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.08);
}

.section-colorbar-fill {
  height: 8px;
  margin: 0;
  border-radius: var(--radius-rounded);
  box-shadow: inset 0 -2px 3px rgba(0, 0, 0, 0.12);
  transition: width 0.3s ease;
}

.section-colorbar-fill-dot {
  width: 28px !important;
  height: 28px !important;
  border-radius: 50%;
  border: 4px solid var(--grey-300);
  background: var(--white);
}

.colorbar {
  position: relative;
  margin: 0;
  height: 8px;
  background: var(--grey-200);
  border-radius: var(--radius-rounded);
  box-shadow: inset 0 2px 3px rgba(0, 0, 0, 0.08);
}

.colorbar-fill {
  display: block;
  height: 8px;
  background: var(--green-colorbar);
  border-radius: var(--radius-rounded);
  box-shadow: inset 0 -2px 3px rgba(0, 0, 0, 0.12);
  transition: width 0.3s ease;
}

.colorbar-progress-tag {
  z-index: 100;
  position: relative;
  display: flex;
  left: -8px;
  bottom: 4px;
  align-items: center;
  justify-content: center;
  padding: 2px 22px;
  border-radius: 12px;
  font-size: 14px;
  font-weight: 600;
  color: var(--secondary);
  background: var(--white);
  box-shadow: var(--shadow-float);
}

.has-breadcrumbs {
  position: relative;
  display: flex;
  align-items: center;
  margin: 0 auto;
  padding: 0;
  margin: 0 auto;
  max-width: 1140px;
}
@media (max-width: 1139px) {
  .has-breadcrumbs {
    overflow: hidden;
  }
}

.breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0 auto;
  width: 100%;
  font-size: 14px;
  line-height: 1.5;
}
@media (max-width: 1139px) {
  .breadcrumbs {
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 24px;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
  }
  .breadcrumbs::-webkit-scrollbar {
    display: none;
  }
  .breadcrumbs::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    width: 40px;
    background: linear-gradient(to right, transparent, var(--white));
    pointer-events: none;
  }
}
.breadcrumbs .nav-item {
  display: inline-flex;
  align-items: center;
  color: var(--secondary);
  font-weight: 400;
  max-width: 240px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.breadcrumbs .nav-item a {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-decoration: none;
  color: var(--grey-400);
  transition: color 0.2s ease;
}
.breadcrumbs .nav-item a:hover {
  color: var(--secondary);
}
.breadcrumbs .nav-item a:focus {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 2px;
}
.breadcrumbs .nav-item.nav-item-sequence {
  display: inline-block;
  font-weight: 600;
  color: var(--secondary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.breadcrumbs .nav-item-chapter {
  max-width: 14px;
}
.breadcrumbs .nav-item-chapter a {
  font-size: 0;
  width: 14px;
}
.breadcrumbs .nav-item-chapter a::after {
  content: "...";
  display: block;
  font-size: 14px;
  color: var(--grey-400);
  letter-spacing: 1px;
}
.breadcrumbs .nav-item-chapter a:hover::after {
  color: var(--secondary);
}
.breadcrumbs .icon.fa.fa-angle-right {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 10px;
  height: 10px;
  margin: 0 4px;
  flex-shrink: 0;
}
.breadcrumbs .icon.fa.fa-angle-right::before {
  content: "";
  display: block;
  width: 10px;
  height: 10px;
  mask-image: url("/static/axeptio/custom/icons/arrow-right.svg");
  mask-size: 10px 10px;
  mask-repeat: no-repeat;
  mask-position: center;
  background: var(--secondary);
}
@media (max-width: 1139px) {
  .breadcrumbs .nav-item {
    flex-shrink: 0;
  }
}
@media (max-width: 525px) {
  .breadcrumbs {
    font-size: 13px;
  }
  .breadcrumbs .nav-item {
    max-width: 200px;
  }
}
@media (max-width: 480px) {
  .breadcrumbs .nav-item {
    max-width: 180px;
  }
}

.breadcrumbs--compact {
  gap: 4px;
  font-size: 13px;
}
.breadcrumbs--compact .icon.fa.fa-angle-right {
  margin: 0 2px;
}

.breadcrumbs--large {
  gap: 12px;
  font-size: 16px;
}
.breadcrumbs--large .icon.fa.fa-angle-right {
  width: 20px;
  height: 20px;
  margin: 0 6px;
}
.breadcrumbs--large .icon.fa.fa-angle-right::before {
  width: 20px;
  height: 20px;
  mask-size: 20px 20px;
}

body.view-passwordreset .content-wrapper {
  display: grid;
  place-content: center;
}
body.view-passwordreset .status.submission-success .message-copy {
  margin: 16px 0 0 0;
}

.section-bkg-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 142px);
}

.login-register-content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
}

#login-and-registration-container.login-register {
  width: 100%;
  max-width: 728px;
}

.form-type .form-wrapper {
  position: relative;
  width: 500px;
  margin-top: -142px;
  border-radius: 8px;
  padding: 42px;
  background: var(--white);
  box-shadow: var(--shadow-float);
}
@media (max-width: 959px) {
  .form-type .form-wrapper {
    width: auto;
    box-shadow: none;
  }
}

@media (min-width: 960px) {
  .form-type .form-wrapper {
    padding: 36px 40px;
  }
}
.form-type .form-wrapper h2 {
  margin: 4px 0 20px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 28px;
}

.login-register-content .form-toggle {
  font-weight: 700;
  text-decoration: none;
}
.login-register-content .form-toggle:hover {
  text-decoration: underline;
}
.login-register-content .action-primary {
  margin-top: 12px;
}

.password-reset-form,
.register-form,
.login-form {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.password-reset-form .form-field,
.register-form .form-field,
.login-form .form-field {
  margin: 0 0 8px;
}

.password-reset-form .action-label {
  margin: 0;
}

.login-help {
  margin-top: 8px;
  text-decoration: none;
}

.js-form-errors,
.js-password-reset-success {
  display: flex;
  flex-direction: column;
  align-items: flex-start !important;
  width: 100%;
  gap: 8px;
  margin-bottom: 16px;
  padding: 16px 20px !important;
  font-size: 15px;
  line-height: 1.5;
  border: 1px solid;
  border-left-width: 4px;
  border-radius: 4px;
}
@media (min-width: 960px) {
  .js-form-errors,
  .js-password-reset-success {
    padding: 16px 24px !important;
    font-size: 16px;
  }
}
.js-form-errors.submission-error,
.js-password-reset-success.submission-error {
  background-color: var(--red-50);
  border-color: var(--red-200);
  color: var(--secondary);
}
.js-form-errors.submission-success,
.js-password-reset-success.submission-success {
  background-color: var(--green-50);
  border-color: var(--green-200);
  color: var(--secondary);
}
.js-form-errors .message-title,
.js-password-reset-success .message-title {
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 700;
  font-family: var(--body-font-family);
  color: var(--secondary);
  line-height: 1.4;
}
.js-form-errors .message-copy,
.js-password-reset-success .message-copy {
  margin: 0;
  padding: 0;
  list-style: none;
}
.js-form-errors .message-copy p:first-child,
.js-password-reset-success .message-copy p:first-child {
  margin: 0;
}
.js-form-errors .message-copy p ~ p,
.js-password-reset-success .message-copy p ~ p {
  margin: 16px 0 0 0;
}
.js-form-errors .message-copy li,
.js-password-reset-success .message-copy li {
  position: relative;
  margin: 4px 0 0 0;
  color: var(--secondary);
  font-weight: 400;
  list-style: none;
}
.js-form-errors .message-copy li:first-child,
.js-password-reset-success .message-copy li:first-child {
  margin-top: 0;
}

@media (min-width: 990px) {
  #b-login,
  #b-register,
  #b-contact-us {
    padding: 15px 25px;
    height: max-content;
    width: auto;
    margin: 0;
    text-decoration: none;
    text-align: center;
    font-weight: 700;
    font-family: var(--body-font-family);
    font-size: 15px;
    color: var(--white);
    background-color: var(--secondary);
    border: 1px solid var(--secondary);
    border-radius: var(--radius-rounded);
  }
  #b-login:hover,
  #b-register:hover,
  #b-contact-us:hover {
    color: var(--primary);
    border-color: var(--secondary);
    background-color: var(--secondary);
  }
  #b-contact-us {
    color: var(--secondary);
    border-color: var(--primary);
    background-color: var(--primary);
  }
  #b-contact-us:hover {
    color: var(--primary);
    background-color: var(--secondary);
    border-color: var(--secondary);
  }
}
.top-svg {
  z-index: 1;
  position: relative;
}
.top-svg svg {
  height: 120px;
}
@media (max-width: 959px) {
  .top-svg svg {
    height: 80px;
  }
}
.top-svg svg path {
  fill: var(--grey-200);
}

.subsections {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  align-content: center;
  margin: 32px auto;
  gap: 32px;
}

.modules-section {
  background-color: var(--grey-200);
  padding: 32px;
}
.modules-section .section {
  max-width: 1140px;
  background: none;
}
.modules-section .section h2 {
  text-align: center;
  padding: 80px 0 32px;
}
@media (max-width: 959px) {
  .modules-section .section h2 {
    padding: 40px 0 16px;
  }
}

.c-item-wrapper {
  position: relative;
  transition: transform 0.2s ease;
}
.c-item-wrapper:hover {
  transform: scale(1.04);
}

.c-item-number {
  position: absolute;
  top: -30px;
  left: -30px;
  z-index: 1;
  width: 80px;
  height: 80px;
}

.c-item {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 16px;
  height: 320px;
  max-height: 100%;
  padding: 16px;
  background: var(--white);
  box-shadow: var(--shadow-small);
  border-radius: 36px;
  overflow: hidden;
}

.c-item-img-container {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  margin: -10px;
  margin-bottom: 0;
  height: 200px;
  border-radius: 32px;
  overflow: hidden;
}
.c-item-img-container img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

.c-item-a-container {
  padding: 0;
}
.c-item-a-container a {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 12px 24px;
  font-size: 16px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  color: var(--secondary);
  background: var(--white);
  border-radius: var(--radius-rounded);
  transition: background-color 0.2s ease;
}
.c-item-a-container a span {
  display: block;
  font-size: 16px;
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 90%;
}
.c-item-a-container a span:last-child {
  width: 16px;
  height: 16px;
  margin-left: 8px;
  mask-image: url("/static/axeptio/custom/icons/arrow-right.svg");
  mask-size: 16px 16px;
  mask-repeat: no-repeat;
  mask-position: center;
  background: var(--secondary);
}
.c-item-a-container a span:last-child img {
  display: none;
}
.c-item-a-container a:hover {
  color: var(--white);
  background-color: var(--secondary);
}
.c-item-a-container a:hover span:last-child {
  background: var(--white);
}

nav[aria-label=Cours] {
  margin-top: 16px;
}
nav[aria-label=Cours] .sr-is-focusable:focus {
  outline: 2px solid var(--primary);
  outline-offset: 4px;
  border-radius: 4px;
}

.wrapper-course-material {
  position: relative;
  background-color: var(--white);
  box-shadow: inset 0 -2px 0 0 var(--grey-200);
}
@media (max-width: 1139px) {
  .wrapper-course-material {
    overflow: hidden;
  }
}

.course-material {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0;
}

.course-tabs {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 1139px) {
  .course-tabs {
    padding: 0 24px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
  }
  .course-tabs::-webkit-scrollbar {
    display: none;
  }
}

.wrapper-course-material::after {
  content: "";
  z-index: 50;
  position: absolute;
  right: 0;
  top: 0;
  bottom: 0;
  width: 40px;
  background: linear-gradient(to right, transparent, var(--white));
  pointer-events: none;
}
@media (min-width: 1140px) {
  .wrapper-course-material::after {
    display: none;
  }
}

.course-tabs .tab {
  list-style: none;
  margin: 0;
  padding: 0;
}
@media (max-width: 1139px) {
  .course-tabs .tab {
    flex-shrink: 0;
  }
}
.course-tabs .tab a {
  z-index: 10;
  position: relative;
  display: block;
  padding: 12px 20px;
  background: transparent;
  border: none;
  color: var(--grey-400);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.2s ease;
  white-space: nowrap;
}
.course-tabs .tab a:focus {
  outline: none;
}
.course-tabs .tab a:hover {
  color: var(--secondary);
}
.course-tabs .tab a.active {
  color: var(--secondary);
}
.course-tabs .tab a.active::after {
  content: "";
  z-index: 20;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  border-radius: 4px 4px 0 0;
  background: var(--primary);
}
.course-tabs .tab a:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}
.course-tabs .tab a .sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border-width: 0;
}

.view-courseabout {
  max-width: 960px;
  margin: 0 auto;
  padding: 40px 20px;
}
@media (max-width: 959px) {
  .view-courseabout {
    padding: 20px 24px;
  }
}
.view-courseabout .course-info {
  background: var(--white);
  border-radius: 8px;
  box-shadow: var(--shadow-float);
  overflow: hidden;
}
.view-courseabout .course-profile {
  padding: 32px 32px 28px;
}
@media (max-width: 959px) {
  .view-courseabout .course-profile {
    padding: 24px;
  }
}
.view-courseabout .intro-inner-wrapper {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 20px;
}
.view-courseabout .intro-inner-wrapper .table {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.view-courseabout .media {
  display: flex;
  justify-content: center;
  order: -1;
}
.view-courseabout .media .hero {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 16px auto;
  width: 156px;
  height: 156px;
  border-radius: 50%;
  overflow: hidden;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.view-courseabout .media .hero img {
  display: none;
}
.view-courseabout .media .hero .play-intro {
  display: none;
}
.view-courseabout .media .hero {
  background-color: #F5F0E8;
}
.view-courseabout a[href*="+FR+"] .hero {
  background-image: url("/static/axeptio/custom/images/flag-fr.svg");
}
.view-courseabout a[href*="+EN+"] .hero {
  background-image: url("/static/axeptio/custom/images/flag-uk.svg");
}
.view-courseabout .intro {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.view-courseabout .heading-group h1 {
  margin: 0;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: clamp(22px, 3vw, 30px);
}
.view-courseabout .main-cta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
}
.view-courseabout .main-cta .register {
  font-size: 16px;
  color: var(--text-secondary, #666);
}
.view-courseabout .main-cta .register.status-enrolled {
  display: none;
}
.view-courseabout .main-cta .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  font-weight: 700;
  color: var(--white);
  background-color: var(--secondary);
  border: 1px solid var(--secondary);
  font-weight: 600;
  padding: 10px 16px;
  text-decoration: none;
}
.view-courseabout .main-cta .btn:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}
.view-courseabout .main-cta .btn:visited {
  color: var(--white);
}
.view-courseabout .main-cta .btn:hover {
  color: var(--primary);
  background-color: var(--secondary);
  border-color: var(--secondary);
}
.view-courseabout .main-cta .btn strong {
  font-weight: 600;
}
.view-courseabout .container {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  padding: 32px;
  border-top: 1px solid var(--grey-200);
}
@media (max-width: 959px) {
  .view-courseabout .container {
    grid-template-columns: 1fr;
    gap: 24px;
    padding: 24px;
  }
}
.view-courseabout .details .wrap-instructor-info {
  margin-bottom: 20px;
}
.view-courseabout .details .wrap-instructor-info .instructor-info-action {
  display: inline-block;
  text-decoration: none;
  font-size: 14px;
  color: var(--secondary);
  background: var(--grey-100);
}
.view-courseabout .details .wrap-instructor-info .instructor-info-action:hover {
  border-color: transparent;
  background: var(--grey-100);
}
.view-courseabout .details .about {
  font-size: 16px;
  line-height: 1.6;
}
.view-courseabout .course-sidebar .course-summary {
  position: sticky;
  top: 20px;
}
.view-courseabout .course-sidebar header {
  margin-bottom: 24px;
}
.view-courseabout .course-sidebar .social-sharing {
  padding: 16px;
  background: var(--grey-100);
  border-radius: 4px;
}
.view-courseabout .course-sidebar .social-sharing .sharing-message {
  font-weight: 600;
  font-size: 14px;
}
.view-courseabout .course-sidebar .social-sharing .share {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  margin-top: 8px;
  width: 36px;
  height: 36px;
  background: var(--white);
  border-radius: 999px;
  text-decoration: none;
  border: 1px solid var(--grey-200);
  color: var(--text-primary, #333);
  transition: transform 0.2s;
}
.view-courseabout .course-sidebar .social-sharing .share:hover {
  border-color: var(--primary);
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}
.view-courseabout .course-sidebar .social-sharing .share .icon {
  width: 20px;
  text-align: center;
}
.view-courseabout .course-sidebar .social-sharing .share .sr {
  font-size: 14px;
}
.view-courseabout .course-sidebar .important-dates {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.view-courseabout .course-sidebar .important-dates .important-dates-item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px;
  background: var(--grey-100);
  border-radius: 4px;
}
.view-courseabout .course-sidebar .important-dates .important-dates-item .icon {
  font-size: 18px;
  color: var(--primary-color, #333);
  margin-bottom: 4px;
}
.view-courseabout .course-sidebar .important-dates .important-dates-item .important-dates-item-title {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--text-secondary, #666);
}
.view-courseabout .course-sidebar .important-dates .important-dates-item .important-dates-item-text {
  font-size: 16px;
  font-weight: 500;
  color: var(--text-primary, #333);
}

.wrapper-preview-menu {
  padding: 12px 0;
  background-color: var(--topbar-bg-color) !important;
}
@media (max-width: 1139px) {
  .wrapper-preview-menu {
    padding: 16px 30px;
  }
}
@media (max-width: 959px) {
  .wrapper-preview-menu {
    padding: 16px 24px;
  }
}

.preview-menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0;
  background: none;
}
@media (max-width: 959px) {
  .preview-menu {
    flex-direction: column;
    gap: 12px;
  }
}

.preview-actions {
  display: flex;
  flex-grow: 1;
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 959px) {
  .preview-actions {
    width: 100%;
  }
}

.action-preview {
  width: 100%;
  list-style: none;
  margin: 0;
  padding: 0;
}

.action-preview-form {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}
@media (max-width: 959px) {
  .action-preview-form {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
}
.action-preview-form .action-preview-label {
  margin: 0;
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  color: var(--secondary) !important;
}
@media (max-width: 959px) {
  .action-preview-form .action-preview-label {
    font-size: 13px;
  }
}
.action-preview-form .action-preview-select {
  position: relative;
  appearance: none;
  height: 44px;
  padding: 8px 32px 8px 12px;
  font-size: 14px;
  color: var(--secondary);
  background: var(--white);
  border: 1px solid var(--grey-200);
  border-radius: 6px;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
  background-image: url("/static/axeptio/custom/icons/arrow-down.svg");
  background-repeat: no-repeat;
  background-position: right 8px center;
  background-size: 16px 16px;
}
@media (max-width: 959px) {
  .action-preview-form .action-preview-select {
    width: 100%;
    font-size: 13px;
  }
}
.action-preview-form .action-preview-select:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(255, 206, 67, 0.2);
}
.action-preview-form .action-preview-select option {
  padding: 8px;
}
.action-preview-form .action-preview-username-container {
  display: none;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
@media (max-width: 959px) {
  .action-preview-form .action-preview-username-container {
    flex-direction: column;
    align-items: stretch;
  }
}
.action-preview-form .action-preview-username-container.is-visible {
  display: flex;
}
.action-preview-form .action-preview-username-container .action-preview-username {
  height: 44px !important;
  margin-left: 8px;
  padding: 8px 12px;
  background: var(--white);
  color: var(--secondary);
  font-size: 14px;
  min-width: 200px;
  border: 1px solid var(--grey-200);
  border-radius: 6px;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
@media (max-width: 959px) {
  .action-preview-form .action-preview-username-container .action-preview-username {
    width: 100%;
    min-width: auto;
    font-size: 13px;
  }
}
.action-preview-form .action-preview-username-container .action-preview-username:focus {
  outline: none;
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(255, 206, 67, 0.2);
}
.action-preview-form .action-preview-username-container .action-preview-username::placeholder {
  color: rgba(0, 0, 0, 0.4);
}

.preview-menu > div {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
@media (max-width: 959px) {
  .preview-menu > div {
    width: 100%;
    flex-direction: column;
    gap: 8px;
  }
}
.preview-menu > div .btn,
.preview-menu > div .btn-primary,
.preview-menu > div .view-in-studio {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  padding: 0 16px;
  border: none !important;
  border-radius: 18px;
  background: var(--secondary);
  color: var(--white);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.2s ease, transform 0.02s ease;
}
@media (max-width: 959px) {
  .preview-menu > div .btn,
  .preview-menu > div .btn-primary,
  .preview-menu > div .view-in-studio {
    width: 100%;
    font-size: 13px;
  }
}
.preview-menu > div .btn:hover,
.preview-menu > div .btn-primary:hover,
.preview-menu > div .view-in-studio:hover {
  background: var(--black);
}
.preview-menu > div .btn:active,
.preview-menu > div .btn-primary:active,
.preview-menu > div .view-in-studio:active {
  box-shadow: 0 0 0 2px hsla(44, 100%, 63%, 0.5) !important;
  background-color: var(--black) !important;
}
.preview-menu > div .btn:focus,
.preview-menu > div .btn-primary:focus,
.preview-menu > div .view-in-studio:focus {
  box-shadow: 0 0 0 2px hsla(44, 100%, 63%, 0.5);
}
.preview-menu > div .btn:focus-visible,
.preview-menu > div .btn-primary:focus-visible,
.preview-menu > div .view-in-studio:focus-visible {
  outline: 1px solid var(--primary);
  outline-offset: 1px;
}

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

.search-bar {
  margin: 24px auto;
}
.search-bar .search-form {
  position: relative;
}
.search-bar label {
  display: block;
  font-size: 28px;
  font-weight: 700;
  color: var(--secondary);
}
.search-bar .search-field-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  margin-top: 12px;
}
.search-bar .search-field {
  width: 100%;
  height: 56px;
  padding: 16px 56px 16px 20px;
  border: 1px solid var(--grey-200);
  border-radius: 28px;
  background: var(--white);
  color: var(--secondary);
  font-size: 16px;
  font-family: var(--body-font-family);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.search-bar .search-field:not(.is-active) ~ .cancel-button {
  display: none;
}
.search-bar .search-field:focus {
  outline: none;
  border-color: var(--secondary);
  box-shadow: 0 0 0 4px rgba(33, 33, 33, 0.1);
}
.search-bar .search-field::placeholder {
  color: rgba(0, 0, 0, 0.4);
}
.search-bar .search-button,
.search-bar .cancel-button {
  position: absolute;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: var(--secondary);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.search-bar .search-button:hover,
.search-bar .cancel-button:hover {
  background: rgba(0, 0, 0, 0.05);
}
.search-bar .search-button:active,
.search-bar .cancel-button:active {
  background: rgba(0, 0, 0, 0.1);
}
.search-bar .search-button .icon,
.search-bar .cancel-button .icon {
  position: relative;
  font-size: 18px;
}

.search-results .search-info {
  margin-bottom: 24px;
}
.search-results .search-info .search-count {
  margin-top: 12px;
  font-size: 16px;
  color: var(--grey-400);
  margin: 0;
}
.search-results > p {
  position: relative;
  font-size: 16px;
  color: var(--grey-400);
  margin: 0;
  padding-top: 160px;
  text-align: center;
}
.search-results > p::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 144px;
  height: 144px;
  background: url("/static/axeptio/custom/images/search-mascot.png") no-repeat center center;
  background-size: contain;
}

.dashboard-search-bar,
.dashboard-search-results {
  margin: 0 auto;
  max-width: 526px;
}

.dashboard-search-bar {
  padding-top: 48px;
}

.dashboard-search-results {
  margin: 32px auto;
}

.side-container {
  padding: 24px;
  background: var(--white);
}

.find-courses .courses-container {
  max-width: 1140px;
  margin: 0 auto;
  padding: 24px;
}
.find-courses .wrapper-search-context {
  margin: 12px auto 0 0;
}
.find-courses .search-status-label {
  display: block;
  font-size: 28px;
  font-weight: 700;
  color: var(--secondary);
}
.find-courses .wrapper-search-input {
  margin-top: 12px;
  position: relative;
  display: flex;
  align-items: center;
}
.find-courses .discovery-input {
  width: 100%;
  height: 56px;
  padding: 16px 56px 16px 20px;
  border: 1px solid var(--grey-200);
  border-radius: 28px;
  background: var(--white);
  color: var(--secondary);
  font-size: 16px;
  font-family: var(--body-font-family);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.find-courses .discovery-input:focus {
  outline: none;
  border-color: var(--secondary);
  box-shadow: 0 0 0 4px rgba(33, 33, 33, 0.1);
}
.find-courses .discovery-input::placeholder {
  color: rgba(0, 0, 0, 0.4);
}
.find-courses .discovery-submit {
  position: absolute;
  right: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: var(--secondary);
  cursor: pointer;
  transition: background-color 0.2s ease;
}
.find-courses .discovery-submit:hover {
  background: rgba(0, 0, 0, 0.05);
}
.find-courses .discovery-submit:active {
  background: rgba(0, 0, 0, 0.1);
}
.find-courses .discovery-submit .icon {
  position: relative;
  font-size: 18px;
}
.find-courses .filters {
  margin: 12px 0 0 0;
}
.find-courses .filters .filters-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}
.find-courses .filters .active-filters {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  flex: 1;
}
.find-courses .filters .clear-filters {
  padding: 8px 16px;
  border: 1px solid var(--grey-200);
  border-radius: 20px;
  background: var(--white);
  color: var(--secondary);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}
.find-courses .filters .clear-filters:hover {
  background: rgba(0, 0, 0, 0.05);
}
.find-courses .courses {
  margin: 32px 0;
}
.find-courses .courses .courses-listing {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
  gap: 24px;
}
@media (max-width: 959px) {
  .find-courses .courses .courses-listing {
    flex-direction: column;
  }
}
.find-courses .courses-listing-item {
  flex-shrink: 0;
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 360px;
}
@media (max-width: 959px) {
  .find-courses .courses-listing-item {
    width: 100%;
  }
}
.find-courses .course {
  width: 100%;
  border-radius: 8px;
  box-shadow: var(--shadow-small);
  background: var(--white);
  transition: all 0.2s ease;
}
.find-courses .course:hover {
  box-shadow: var(--shadow-medium);
  transform: translateY(-2px);
}
.find-courses .course > a {
  display: block;
  text-decoration: none;
  color: inherit;
}
.find-courses .course-image {
  position: relative;
  width: 100%;
  height: 200px;
  background: var(--grey-100);
  overflow: hidden;
}
.find-courses .course-image .cover-image {
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.find-courses .course-image .cover-image img {
  display: none;
}
.find-courses .course-image .cover-image .learn-more {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 12px;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.7), transparent);
  color: var(--white);
  font-size: 14px;
  font-weight: 700;
  text-align: center;
  opacity: 0;
  transition: opacity 0.2s ease;
}
.find-courses .course-image:hover .learn-more {
  opacity: 1;
}
.find-courses .course a[href*="+EN+"] .cover-image {
  background-image: url("/static/axeptio/custom/images/flag-uk.svg");
}
.find-courses .course a[href*="+FR+"] .cover-image {
  background-image: url("/static/axeptio/custom/images/flag-fr.svg");
}
.find-courses .course-info {
  padding: 20px;
}
.find-courses .course-info[aria-hidden=true] {
  display: block;
}
.find-courses .course-info .course-name {
  margin: 0 0 12px 0;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 20px;
  color: var(--secondary);
  line-height: 1.3;
}
.find-courses .course-info .course-name .course-organization {
  display: block;
  font-size: 14px;
  font-family: var(--body-font-family);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--grey-400);
  margin-bottom: 4px;
}
.find-courses .course-info .course-name .course-code {
  display: inline-block;
  padding: 4px 10px;
  margin-right: 8px;
  margin-bottom: 8px;
  background: var(--grey-100);
  border: 1px solid var(--grey-200);
  border-radius: 12px;
  font-size: 12px;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--grey-500);
}
.find-courses .course-info .course-name .course-title {
  display: block;
  font-size: 20px;
}
.find-courses .course-info .course-date {
  font-size: 14px;
  color: var(--grey-400);
  margin: 0;
}
.find-courses .sr {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.find-courses .loading-spinner {
  display: inline-block;
}
.find-courses .loading-spinner .fa-spin {
  animation: spin 1s linear infinite;
}

@keyframes spin {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.filters-inner,
.search-facets {
  padding: 0;
  background: var(--white);
  border-radius: 8px;
}
.filters-inner .header-search-facets,
.search-facets .header-search-facets {
  font-size: 20px;
  font-weight: 700;
  font-family: var(--title-font-family);
  color: var(--secondary);
  margin: 16px 0 0 0;
}
.filters-inner .search-facets-lists,
.search-facets .search-facets-lists {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.filters-inner .header-facet,
.search-facets .header-facet {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--grey-500);
  margin: 12px 0 0 0;
}
.filters-inner .facet-list,
.search-facets .facet-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.filters-inner .facet-list li,
.search-facets .facet-list li {
  margin: 0;
  padding: 0;
}
.filters-inner .facet-list li button.selected::after, .filters-inner .facet-list li.active-filter button::after,
.search-facets .facet-list li button.selected::after,
.search-facets .facet-list li.active-filter button::after {
  content: "✗";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
}
.filters-inner .facet-option,
.search-facets .facet-option {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border: 1px solid var(--grey-200);
  border-radius: 16px;
  background: var(--white);
  color: var(--grey-500);
  font-size: 14px;
  font-weight: 600;
  font-family: var(--body-font-family);
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}
.filters-inner .facet-option:hover,
.search-facets .facet-option:hover {
  background: var(--grey-100);
  border-color: var(--grey-300);
}
.filters-inner .facet-option.is-active, .filters-inner .facet-option[aria-pressed=true],
.search-facets .facet-option.is-active,
.search-facets .facet-option[aria-pressed=true] {
  background: var(--secondary);
  border-color: var(--secondary);
  color: var(--white);
  padding-left: 10px;
}
.filters-inner .facet-option.is-active::before, .filters-inner .facet-option[aria-pressed=true]::before,
.search-facets .facet-option.is-active::before,
.search-facets .facet-option[aria-pressed=true]::before {
  content: "✓";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 12px;
}
.filters-inner .facet-option.is-active:hover, .filters-inner .facet-option[aria-pressed=true]:hover,
.search-facets .facet-option.is-active:hover,
.search-facets .facet-option[aria-pressed=true]:hover {
  background: var(--grey-500);
  border-color: var(--grey-500);
}
.filters-inner .facet-option.is-active .count, .filters-inner .facet-option[aria-pressed=true] .count,
.search-facets .facet-option.is-active .count,
.search-facets .facet-option[aria-pressed=true] .count {
  color: var(--white);
  opacity: 0.8;
}
.filters-inner .facet-option:focus,
.search-facets .facet-option:focus {
  outline: none;
  box-shadow: 0 0 0 3px rgba(33, 33, 33, 0.1);
}
.filters-inner .facet-option .count,
.search-facets .facet-option .count {
  display: inline-flex;
  align-items: center;
  color: var(--grey-400);
  font-size: 13px;
  font-weight: 600;
}
.filters-inner .facet-option .count .count-number,
.search-facets .facet-option .count .count-number {
  display: inline-block;
}

@media (max-width: 728px) {
  .search-facets {
    padding: 16px;
  }
  .search-facets .header-search-facets {
    margin-top: 16px;
    font-size: 18px;
  }
  .search-facets .search-facets-lists {
    gap: 20px;
  }
}
.sequence-nav-button {
  font-weight: 600;
}

.sequence-bottom {
  padding: 24px;
  display: flex;
  justify-content: space-between;
}

.sequence-nav {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0;
  padding: 4px 36px;
  margin: 12px auto 0;
  max-width: 1320px;
}
@media (max-width: 1139px) {
  .sequence-nav {
    padding: 4px 2px;
  }
}
.sequence-nav .sequence-nav-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  background: none;
  color: var(--secondary);
  border: none;
  border-radius: var(--radius-rounded);
  cursor: pointer;
  font-size: 16px;
  color: var(--secondary);
  font-weight: 700;
  text-shadow: none;
  box-shadow: none;
  transition: all 0.2s ease;
  white-space: nowrap;
  flex-shrink: 0;
  line-height: 1;
}
.sequence-nav .sequence-nav-button::before, .sequence-nav .sequence-nav-button::after {
  content: "";
  display: flex;
  width: 20px;
  height: 20px;
  background-size: contain;
  background-position: center center;
}
.sequence-nav .sequence-nav-button.button-previous {
  order: 1;
}
.sequence-nav .sequence-nav-button.button-previous::before {
  background-image: url("/static/axeptio/custom/icons/arrow-left.svg");
}
.sequence-nav .sequence-nav-button.button-previous::after {
  display: none;
}
.sequence-nav .sequence-nav-button.button-previous .icon {
  display: none;
}
.sequence-nav .sequence-nav-button.button-next {
  order: 3;
}
.sequence-nav .sequence-nav-button.button-next::before {
  display: none;
}
.sequence-nav .sequence-nav-button.button-next::after {
  background-image: url("/static/axeptio/custom/icons/arrow-right.svg");
}
.sequence-nav .sequence-nav-button.button-next .icon {
  display: none;
}
.sequence-nav .sequence-nav-button:hover:not(:disabled) {
  background: var(--white);
}
.sequence-nav .sequence-nav-button:disabled {
  cursor: pointer;
  opacity: 0.6;
}
.sequence-nav .sequence-nav-button .icon {
  font-size: 16px;
}
.sequence-nav .sequence-nav-button .sequence-nav-button-label {
  display: none;
}
@media (max-width: 767px) {
  .sequence-nav .sequence-nav-button {
    padding: 10px 12px;
    font-size: 16px;
  }
}
.sequence-nav .sequence-list-wrapper {
  order: 2;
  flex: 1;
  overflow-x: auto;
  overflow-y: visible;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
  height: 52px;
  padding: 4px;
  margin: 0;
  border-radius: var(--radius-rounded);
  border: 1px solid #E9ECF1;
  background: #FFFFFF;
  box-shadow: 0px 12px 24px rgba(0, 0, 0, 0.05), 0px 2px 6px rgba(0, 0, 0, 0.05), 0px 1px 1px rgba(0, 0, 0, 0.05);
}
.sequence-nav .sequence-list-wrapper::-webkit-scrollbar {
  height: 6px;
}
.sequence-nav .sequence-list-wrapper::-webkit-scrollbar-track {
  background: transparent;
}
.sequence-nav .sequence-list-wrapper::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 3px;
}
.sequence-nav .sequence-list-wrapper::-webkit-scrollbar-thumb:hover {
  background: #999;
}
.sequence-nav #sequence-list {
  display: flex;
  align-items: stretch;
  height: 100%;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: min-content;
}
.sequence-nav #sequence-list li {
  flex-shrink: 0;
  margin: 0;
}
.sequence-nav #sequence-list .nav-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: 100%;
  padding: 0 16px;
  background: #fff;
  border: none;
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  font-size: 16px;
  font-weight: 500;
  white-space: nowrap;
}
.sequence-nav #sequence-list .nav-item.active {
  background: var(--secondary);
  color: #FFFFFF;
}
.sequence-nav #sequence-list .nav-item.inactive {
  cursor: pointer;
  opacity: 0.7;
}
.sequence-nav #sequence-list .nav-item .icon:not(.check-circle):not(.bookmark-icon) {
  display: none;
}
.sequence-nav #sequence-list .nav-item .check-circle {
  position: absolute;
  top: -6px;
  right: -6px;
  font-size: 16px;
  background: #fff;
  border-radius: 50%;
}
.sequence-nav #sequence-list .nav-item .check-circle.is-hidden {
  display: none;
}
.sequence-nav #sequence-list .nav-item .bookmark-icon {
  position: absolute;
  top: -4px;
  right: -4px;
  font-size: 14px;
  color: #ffc107;
}
.sequence-nav #sequence-list .nav-item .bookmark-icon.is-hidden {
  display: none;
}
.sequence-nav #sequence-list .nav-item .sequence-tooltip {
  position: relative;
  transform: none;
  padding: 0;
  background: transparent;
  color: inherit;
  font-size: inherit;
  white-space: nowrap;
  border-radius: 0;
  opacity: 1;
  pointer-events: auto;
  transition: none;
  z-index: auto;
  clip: auto;
  height: auto;
  width: auto;
  overflow: visible;
  margin: 0;
}
.sequence-nav #sequence-list .nav-item .sequence-tooltip::after {
  display: none;
}

.account-settings-container {
  max-width: 728px;
  margin: 0 auto;
  padding: 24px;
}
@media (max-width: 1139px) {
  .account-settings-container {
    padding: 16px 24px;
  }
}

.wrapper-header {
  position: relative;
  margin-bottom: 32px;
}
.wrapper-header .header-title {
  margin: 0 0 24px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 32px;
  color: var(--secondary);
}
@media (max-width: 1139px) {
  .wrapper-header .header-title {
    font-size: 28px;
    margin-bottom: 20px;
  }
}
@media (max-width: 1139px) {
  .wrapper-header {
    overflow: hidden;
  }
}
.wrapper-header::after {
  content: "";
  z-index: 50;
  position: absolute;
  right: 0;
  bottom: 0;
  height: 48px;
  width: 40px;
  background: linear-gradient(to right, transparent, var(--white));
  pointer-events: none;
}
@media (min-width: 1140px) {
  .wrapper-header::after {
    display: none;
  }
}

.account-nav {
  display: flex;
  gap: 8px;
  box-shadow: inset 0 -2px 0 0 var(--grey-200);
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 1139px) {
  .account-nav {
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-behavior: smooth;
  }
  .account-nav::-webkit-scrollbar {
    display: none;
  }
}

.account-nav-link {
  z-index: 10;
  position: relative;
  display: block;
  padding: 12px 20px;
  background: transparent;
  border: none;
  color: var(--grey-400);
  font-size: 15px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: color 0.2s ease;
  white-space: nowrap;
}
.account-nav-link:focus {
  outline: none;
}
@media (max-width: 1139px) {
  .account-nav-link {
    flex-shrink: 0;
  }
}
.account-nav-link:hover {
  color: var(--secondary);
}
.account-nav-link.active {
  color: var(--secondary);
}
.account-nav-link.active::after {
  content: "";
  z-index: 20;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  border-radius: 4px 4px 0 0;
  background: var(--primary);
}
.account-nav-link:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
  border-radius: 4px;
}

.account-settings-sections {
  margin-top: 32px;
}
@media (max-width: 1139px) {
  .account-settings-sections {
    margin-top: 24px;
  }
}

.account-settings-tabpanels.hidden {
  display: none;
}
.account-settings-tabpanels[aria-selected=true], .account-settings-tabpanels.active {
  display: block;
}

.account-settings-sections .section {
  background: var(--white);
  border-radius: 8px;
  padding: 32px;
  margin-bottom: 24px;
  box-shadow: var(--shadow-small);
}
@media (max-width: 1139px) {
  .account-settings-sections .section {
    padding: 24px 20px;
    margin-bottom: 16px;
  }
}
.account-settings-sections .section .section-header {
  margin: 0 0 8px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 22px;
  color: var(--secondary);
}
@media (max-width: 1139px) {
  .account-settings-sections .section .section-header {
    font-size: 20px;
  }
}
.account-settings-sections .section .account-settings-header-subtitle {
  margin: 0 0 24px;
  color: var(--grey-400);
  font-size: 14px;
  line-height: 1.5;
}

.account-settings-section-body {
  margin-top: 24px;
}

.list-inline {
  list-style: none;
  padding: 0;
  margin: 0;
}

.instructor-dashboard-content-2 {
  display: grid;
  grid-template-columns: 1fr 280px;
  grid-template-rows: auto auto 1fr;
  gap: 24px;
  column-gap: 68px;
  max-width: 1140px;
  margin: 0 auto;
  padding: 24px;
}
@media (max-width: 959px) {
  .instructor-dashboard-content-2 {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.instructor-dashboard-title {
  grid-column: 1/-1;
  margin: 0 0 8px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 28px;
  color: var(--secondary);
}
@media (max-width: 959px) {
  .instructor-dashboard-title {
    font-size: 24px;
  }
}

.wrap-instructor-info {
  grid-column: 1/-1;
  margin: 8px 0;
}
.wrap-instructor-info .instructor-info-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  height: 32px;
  padding: 3px 16px;
  display: inline-block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.wrap-instructor-info .instructor-info-action:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}
.wrap-instructor-info .instructor-info-action::before {
  content: "";
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 2px;
  margin-right: 8px;
  width: 16px;
  height: 16px;
  background-color: currentColor;
  mask-image: url("/static/axeptio/custom/icons/cog.svg");
  mask-size: contain;
  mask-repeat: no-repeat;
}

.instructor-nav {
  grid-column: 2;
  grid-row: 3;
  position: sticky;
  top: 24px;
  align-self: start;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--white);
}
@media (max-width: 959px) {
  .instructor-nav {
    grid-column: 1;
    grid-row: 3;
    position: relative;
    top: 0;
    flex-direction: row;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    padding: 0 24px;
    margin: 0 -24px;
    gap: 8px;
  }
  .instructor-nav::-webkit-scrollbar {
    display: none;
  }
}
.instructor-nav .nav-item {
  margin: 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 959px) {
  .instructor-nav .nav-item {
    flex-shrink: 0;
  }
}
.instructor-nav .btn-link {
  display: block;
  width: 100%;
  padding: 10px 16px;
  font-size: 15px;
  font-weight: 600;
  color: var(--grey-500);
  text-align: left;
  text-decoration: none;
  background: transparent;
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
  white-space: nowrap;
}
.instructor-nav .btn-link:focus {
  outline: none;
}
.instructor-nav .btn-link:hover {
  color: var(--secondary);
}
.instructor-nav .btn-link.active-section {
  background: var(--secondary);
  color: var(--white);
  font-weight: 700;
}
@media (min-width: 960px) {
  .instructor-nav .btn-link.active-section {
    background: none;
    border-left-color: var(--primary);
    color: var(--secondary);
    border-radius: 0;
  }
}
@media (min-width: 960px) {
  .instructor-nav .btn-link {
    border-left: 2px solid var(--grey-200);
  }
}
@media (max-width: 959px) {
  .instructor-nav .btn-link {
    padding: 10px 16px;
    font-size: 13px;
    border-radius: 8px;
  }
}

.idash-section {
  grid-column: 1;
  grid-row: 3;
  display: none;
  padding: 0;
  background: var(--white);
}
.idash-section.active-section {
  display: block;
}
.idash-section a {
  font-weight: 700;
}
.idash-section a:hover {
  text-decoration: underline;
}
@media (max-width: 959px) {
  .idash-section {
    grid-row: 4;
    padding: 20px 0;
  }
}
.idash-section .hd-3 {
  margin: 0 0 24px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 22px;
  color: var(--secondary);
}
@media (max-width: 959px) {
  .idash-section .hd-3 {
    font-size: 20px;
    margin-bottom: 20px;
  }
}
.idash-section .hd-4 {
  margin: 24px 0 16px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 18px;
  color: var(--secondary);
}
.idash-section .hd-4:first-child {
  margin-top: 0;
}
@media (max-width: 959px) {
  .idash-section .hd-4 {
    font-size: 16px;
    margin: 20px 0 12px;
  }
}
.idash-section .hd-5 {
  margin: 16px 0 8px;
  font-size: 15px;
  font-weight: 600;
  color: var(--secondary);
}
.idash-section hr {
  margin: 24px 0;
  border: none;
  border-top: 1px solid var(--grey-200);
}
.idash-section .divider {
  margin: 24px 0;
  border: none;
  border-top: 1px solid var(--grey-200);
}

.enrollment-wrapper {
  margin: 16px 0;
}
.enrollment-wrapper table {
  border-collapse: collapse;
}
.enrollment-wrapper table caption {
  padding: 8px 0;
  font-size: 13px;
  color: var(--grey-500);
  text-align: left;
}
.enrollment-wrapper table th,
.enrollment-wrapper table td {
  padding: 6px 16px;
  text-align: left;
  border-bottom: 1px solid var(--grey-200);
}
.enrollment-wrapper table th {
  font-weight: 500;
  color: var(--grey-600);
}
.enrollment-wrapper table td {
  font-weight: 600;
  color: var(--secondary);
}
.enrollment-wrapper table tr:nth-child(even) {
  background: var(--grey-100);
}
.enrollment-wrapper table tr:nth-child(odd) {
  background: var(--white);
}
.enrollment-wrapper table tr:last-child th,
.enrollment-wrapper table tr:last-child td {
  border-bottom: none;
  padding-top: 16px;
}

.basic-wrapper .list-input {
  margin: 0;
  padding: 0;
  list-style: none;
}
.basic-wrapper .list-input .field {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
  gap: 8px;
  padding: 8px 16px;
  border-bottom: 1px solid var(--grey-200);
}
.basic-wrapper .list-input .field:nth-child(even) {
  background: var(--grey-100);
}
.basic-wrapper .list-input .field:last-child {
  border-bottom: none;
}
.basic-wrapper .list-input .field label {
  flex: 0 0 200px;
  font-size: 14px;
  color: var(--grey-500);
}
@media (max-width: 959px) {
  .basic-wrapper .list-input .field label {
    flex: 0 0 100%;
  }
}
.basic-wrapper .list-input .field b {
  font-size: 14px;
  font-weight: 600;
  color: var(--secondary);
}

.idash-section label {
  display: block;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--secondary);
}
.idash-section textarea,
.idash-section input[type=text],
.idash-section select {
  width: 100%;
  max-width: 400px;
  padding: 12px 16px;
  height: 48px;
  font-size: 14px;
  color: var(--secondary);
  background: var(--white);
  border: 2px solid var(--grey-300);
  border-radius: 6px;
  transition: border-color 0.2s ease;
}
.idash-section textarea:focus,
.idash-section input[type=text]:focus,
.idash-section select:focus {
  outline: none;
  border-color: var(--secondary);
  box-shadow: 0 0 0 3px var(--grey-200);
}
.idash-section textarea::placeholder,
.idash-section input[type=text]::placeholder,
.idash-section select::placeholder {
  color: var(--grey-400);
}
.idash-section textarea {
  margin: 12px 0 0;
  max-width: 100%;
  min-height: 120px;
  resize: vertical;
}
.idash-section select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");
  background-position: right 12px center;
  background-repeat: no-repeat;
  background-size: 16px;
  max-width: 200px;
  cursor: pointer;
}
.idash-section input[type=button],
.idash-section .enrollment-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 8px 20px;
  font-size: 14px;
  font-weight: 600;
  color: var(--secondary);
  background: var(--grey-200);
  border-radius: var(--radius-rounded);
  border: none;
  cursor: pointer;
  transition: all 0.2s ease;
}
.idash-section input[type=button]:hover,
.idash-section .enrollment-button:hover {
  background: var(--secondary);
  color: var(--white);
}
.idash-section input[type=button]:disabled,
.idash-section .enrollment-button:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.idash-section input[type=button] + input[type=button],
.idash-section .enrollment-button + input[type=button] {
  margin-left: 8px;
}
.idash-section input[type=checkbox],
.idash-section input[type=radio] {
  position: relative;
  top: 4px;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  accent-color: var(--secondary);
}
.idash-section .enroll-option,
.idash-section .role {
  margin: 16px 0;
}
.idash-section .hint {
  margin-top: 8px;
  padding: 12px;
  font-size: 13px;
  color: var(--grey-600);
  background: var(--grey-50);
  border-radius: 6px;
  line-height: 1.5;
}
.idash-section .hint .hint-caret {
  display: none;
}

.membership-section {
  margin-bottom: 24px;
  padding: 0;
  border: none;
}
.membership-section legend {
  margin-bottom: 16px;
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  font-size: 18px;
  color: var(--secondary);
}

.running-tasks-container,
.action-type-container {
  margin: 16px 0;
}
.running-tasks-container .no-pending-tasks-message,
.action-type-container .no-pending-tasks-message {
  padding: 16px;
  font-size: 14px;
  color: var(--grey-500);
  background: var(--grey-50);
  border-radius: 8px;
  text-align: center;
}

.idash-section a:not([class]) {
  color: var(--secondary);
  text-decoration: none;
  font-weight: 700;
}
.idash-section a:not([class]):hover {
  text-decoration: underline;
}
.idash-section .gradebook-link,
.idash-section .progress-link,
.idash-section .enrollment-status-link {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  font-size: 14px;
  font-weight: 600;
  color: var(--secondary);
  background: var(--grey-200);
  border-radius: var(--radius-rounded);
  text-decoration: none;
  transition: all 0.2s ease;
}
.idash-section .gradebook-link:hover,
.idash-section .progress-link:hover,
.idash-section .enrollment-status-link:hover {
  color: var(--white);
  background: var(--secondary);
}

.location-example {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  color: var(--grey-400);
  font-family: monospace;
}

.request-response,
.request-response-error {
  margin: 12px 0;
  padding: 12px 16px;
  font-size: 14px;
  border-radius: 6px;
}
.request-response:empty,
.request-response-error:empty {
  display: none;
}

.request-response-error {
  color: var(--red-error);
  background: var(--red-50);
}

.enroll-option label.has-hint {
  position: relative;
  display: block;
}
.enroll-option label.has-hint input[type=checkbox] {
  margin-top: 2px;
}
.enroll-option label.has-hint .label-text {
  display: inline-block;
  margin-left: 8px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--secondary);
}
.enroll-option label.has-hint .hint.auto-enroll-hint {
  display: none;
  flex-basis: 100%;
  width: 100%;
  margin-top: 12px;
  padding: 16px 24px;
  background-color: var(--blue-50);
  border: 1px solid var(--blue-200);
  border-left-width: 4px;
  border-radius: 4px;
  font-size: 15px;
  line-height: 1.6;
  color: var(--secondary);
  position: relative;
}
.enroll-option label.has-hint .hint.auto-enroll-hint .hint-caret {
  position: absolute;
  top: -8px;
  left: 24px;
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid var(--blue-200);
}
.enroll-option label.has-hint .hint.auto-enroll-hint .hint-caret::after {
  content: "";
  position: absolute;
  top: 1px;
  left: -7px;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid var(--blue-50);
}
.enroll-option label.has-hint .hint.auto-enroll-hint p {
  margin: 0;
}
.enroll-option label.has-hint .hint.auto-enroll-hint p em {
  font-style: normal;
  font-weight: 600;
}
.enroll-option label.has-hint .hint.auto-enroll-hint p br + br {
  display: block;
  content: "";
  margin-top: 8px;
}
.enroll-option label.has-hint input[type=checkbox]:checked ~ .hint.auto-enroll-hint {
  display: block;
}

.outside-app {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px;
  padding-top: 142px;
  text-align: center;
  background-color: var(--white);
}
.outside-app::before {
  content: "";
  display: block;
  width: 290px;
  height: 200px;
  margin: 0 auto;
  background-image: url("/static/axeptio/custom/images/farmer.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (max-width: 727px) {
  .outside-app::before {
    max-width: 80%;
  }
}
.outside-app h1 {
  font-family: var(--title-font-family);
  font-size: 48px;
  font-weight: var(--title-font-weight);
  line-height: 1.2;
  color: var(--secondary);
  margin: 10px 0;
}
@media (max-width: 727px) {
  .outside-app h1 {
    font-size: 32px;
    line-height: 38px;
  }
}
.outside-app p {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  font-size: 18px;
  line-height: 1.6;
  color: var(--secondary);
  margin: 0;
  max-width: 600px;
}
@media (max-width: 727px) {
  .outside-app p {
    font-size: 16px;
    margin-bottom: 24px;
  }
}
.outside-app a {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-shadow: none;
  box-shadow: none;
  margin-top: 32px;
  border-radius: var(--radius-rounded);
  background: var(--secondary);
  color: var(--white);
  border: none;
  font-size: 16px;
  font-weight: 700;
  padding: 10px 16px;
  cursor: pointer;
  text-decoration: none;
  text-transform: capitalize;
  letter-spacing: 0.05em;
  transition: all 0.2s ease;
}
.outside-app a:hover {
  background-color: var(--black);
}
.outside-app a ~ * {
  display: none;
}

.problem {
  margin: 0 auto;
  padding: 0;
}

.wrapper-problem-response {
  margin-bottom: 32px;
}
.wrapper-problem-response > strong {
  display: block;
  margin-bottom: 24px;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
  color: var(--secondary);
}
@media (max-width: 959px) {
  .wrapper-problem-response > strong {
    font-size: 16px;
  }
}

.choicegroup {
  margin: 0;
}
.choicegroup fieldset {
  margin: 0;
  padding: 0;
  border: none;
}
.choicegroup legend {
  margin: 0 0 16px;
}
.choicegroup .field {
  position: relative;
  margin-bottom: 12px;
  padding: 0;
  border: 2px solid var(--grey-300);
  border-radius: 12px;
  background: var(--white);
  cursor: pointer;
  transition: all 0.2s ease;
}
.choicegroup .field:hover {
  border-color: #c0c0c0;
}
.choicegroup .field:has(.field-input:checked) {
  border-color: var(--secondary);
}
.choicegroup .field:has(.field-input.submitted:checked)::after {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 24px;
  height: 24px;
  background-color: var(--green-success);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: 16px 16px;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}
.choicegroup label {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin: 0;
  padding: 16px 50px 16px 50px;
  width: 100%;
  font-size: 16px;
  line-height: 1.25;
  color: var(--secondary);
  cursor: pointer;
}
@media (max-width: 959px) {
  .choicegroup label {
    font-size: 15px;
  }
}

.field-input.input-radio,
.field-input.input-checkbox {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 16px;
  appearance: none;
  margin: 0;
  padding: 0;
  width: 20px;
  height: 20px;
  border: 2px solid var(--grey-300);
  outline: 2px solid transparent;
  border-radius: var(--radius-rounded);
  background: var(--white);
  cursor: pointer;
  vertical-align: middle;
  transition: all 0.2s ease;
}
.field-input.input-radio:hover,
.field-input.input-checkbox:hover {
  border-color: var(--secondary);
}
.field-input.input-radio:checked,
.field-input.input-checkbox:checked {
  border-color: var(--secondary);
  background-color: var(--secondary);
}
.field-input.input-radio:checked::after,
.field-input.input-checkbox:checked::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 7px;
  height: 7px;
  border-radius: var(--radius-rounded);
  background: var(--white);
}
.field-input.input-radio.input-checkbox,
.field-input.input-checkbox.input-checkbox {
  border-radius: 4px;
}
.field-input.input-radio.input-checkbox:checked::after,
.field-input.input-checkbox.input-checkbox:checked::after {
  display: block;
  position: absolute;
  width: 18px;
  height: 18px;
  background: none;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin-top: -1px;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='white' stroke-width='2' stroke-linecap='square' stroke-linejoin='round'%3E%3Cpolyline points='16 6 9 15 5 11' stroke='%23FFF'/%3E%3C/svg%3E");
  mask-size: contain;
  mask-repeat: no-repeat;
  background-color: var(--white);
}
.field-input.input-radio:focus,
.field-input.input-checkbox:focus {
  outline: 2px solid var(--grey-200);
}

.indicator-container {
  margin-top: 16px;
}

.status:not(.js-form-errors):not(.js-password-reset-success):not(.submission-success) {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 600;
}
.status:not(.js-form-errors):not(.js-password-reset-success):not(.submission-success) .status-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  color: var(--white);
}
.status:not(.js-form-errors):not(.js-password-reset-success):not(.submission-success).unanswered {
  display: none;
}
.status:not(.js-form-errors):not(.js-password-reset-success):not(.submission-success).correct {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 24px;
  height: 24px;
  background-color: var(--green-success);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'%3E%3C/polyline%3E%3C/svg%3E");
  background-size: 16px 16px;
  background-position: center;
  background-repeat: no-repeat;
  pointer-events: none;
}
.status:not(.js-form-errors):not(.js-password-reset-success):not(.submission-success).incorrect::after {
  content: attr(data-tooltip);
  display: block;
  white-space: nowrap;
  color: var(--red-error);
  border-radius: 4px;
}
.status:not(.js-form-errors):not(.js-password-reset-success):not(.submission-success).incorrect .status-icon {
  background-color: var(--red-error);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M3.75 16.25L16.25 3.75' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M3.75 3.75L16.25 16.25' stroke='%23FFFFFF' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-size: 14px 14px;
  background-position: center;
  background-repeat: no-repeat;
  border-radius: 50%;
}

.problem .action {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin: 32px auto;
  padding: 0;
  height: auto;
}

.problem-action-buttons-wrapper {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

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

.problem-action-btn,
.submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 0 24px;
  border: none;
  border-radius: 22px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease, transform 0.02s ease;
  white-space: nowrap;
}
.problem-action-btn:focus-visible,
.submit:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}
.problem-action-btn:disabled,
.submit:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}

.problem-action-btn.btn-default {
  background: var(--white);
  color: var(--secondary);
  border: 2px solid var(--secondary);
}
.problem-action-btn.btn-default:hover:not(:disabled) {
  color: var(--white);
  background: var(--secondary);
}

.submit.btn-brand {
  background: var(--primary);
  color: var(--secondary);
}
.submit.btn-brand:hover:not(:disabled) {
  background: var(--secondary);
  color: var(--primary);
}

.submission-feedback {
  font-size: 14px;
  color: #666;
}

.solution-span [id^=solution] {
  display: block;
  margin: 20px auto;
  padding: 16px;
  background: var(--blue-50);
  border: 1px solid var(--blue-100);
  border-left: 4px solid var(--blue-100);
  border-radius: 8px;
}
.solution-span [id^=solution]:empty {
  display: none;
}
.solution-span p:first-child {
  margin: 0;
  font-weight: 700;
}

@media (max-width: 959px) {
  .problem-action-buttons-wrapper,
  .submit-attempt-container {
    flex-direction: column;
    align-items: stretch;
  }
  .problem-action-btn,
  .submit {
    width: 100%;
  }
  .notification {
    flex-direction: column;
    align-items: flex-start;
  }
  .notification .notification-btn-wrapper {
    width: 100%;
  }
  .notification .notification-btn-wrapper .notification-btn {
    width: 100%;
  }
}
#lean_overlay {
  z-index: 1000;
  position: fixed;
  inset: 0;
  background-image: radial-gradient(circle at 50% 30%, black);
  display: none;
}

.modal,
.leanModal_box,
.entitlement-unenrollment-modal,
.entitlement-unenrollment-modal {
  position: fixed;
  inset: 32px !important;
  width: 100% !important;
}
.modal .inner-wrapper,
.modal .entitlement-unenrollment-modal-inner-wrapper,
.leanModal_box .inner-wrapper,
.leanModal_box .entitlement-unenrollment-modal-inner-wrapper,
.entitlement-unenrollment-modal .inner-wrapper,
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper,
.entitlement-unenrollment-modal .inner-wrapper,
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  padding: 24px 32px;
  height: 90vh;
  width: 90vw;
  background: #fff;
  box-shadow: inset 0 1px 0 0 rgba(255, 255, 255, 0.7);
  overflow: scroll;
}
.modal .inner-wrapper button[type=button],
.modal .inner-wrapper button[type=submit],
.modal .entitlement-unenrollment-modal-inner-wrapper button[type=button],
.modal .entitlement-unenrollment-modal-inner-wrapper button[type=submit],
.leanModal_box .inner-wrapper button[type=button],
.leanModal_box .inner-wrapper button[type=submit],
.leanModal_box .entitlement-unenrollment-modal-inner-wrapper button[type=button],
.leanModal_box .entitlement-unenrollment-modal-inner-wrapper button[type=submit],
.entitlement-unenrollment-modal .inner-wrapper button[type=button],
.entitlement-unenrollment-modal .inner-wrapper button[type=submit],
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=button],
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=submit],
.entitlement-unenrollment-modal .inner-wrapper button[type=button],
.entitlement-unenrollment-modal .inner-wrapper button[type=submit],
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=button],
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=submit] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 25px;
  height: 40px;
  width: auto;
  margin: 0;
  text-decoration: none;
  text-align: center;
  font-family: var(--body-font-family);
  font-weight: 700;
  color: var(--secondary);
  background: var(--grey-200);
  border: 1px solid var(--grey-200);
  border-radius: var(--radius-rounded);
  cursor: pointer;
  transition: all 0.2s ease;
  margin: 4px auto;
  height: 32px;
}
.modal .inner-wrapper button[type=button]:hover,
.modal .inner-wrapper button[type=submit]:hover,
.modal .entitlement-unenrollment-modal-inner-wrapper button[type=button]:hover,
.modal .entitlement-unenrollment-modal-inner-wrapper button[type=submit]:hover,
.leanModal_box .inner-wrapper button[type=button]:hover,
.leanModal_box .inner-wrapper button[type=submit]:hover,
.leanModal_box .entitlement-unenrollment-modal-inner-wrapper button[type=button]:hover,
.leanModal_box .entitlement-unenrollment-modal-inner-wrapper button[type=submit]:hover,
.entitlement-unenrollment-modal .inner-wrapper button[type=button]:hover,
.entitlement-unenrollment-modal .inner-wrapper button[type=submit]:hover,
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=button]:hover,
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=submit]:hover,
.entitlement-unenrollment-modal .inner-wrapper button[type=button]:hover,
.entitlement-unenrollment-modal .inner-wrapper button[type=submit]:hover,
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=button]:hover,
.entitlement-unenrollment-modal .entitlement-unenrollment-modal-inner-wrapper button[type=submit]:hover {
  color: var(--white);
  background: var(--secondary);
  border-color: var(--secondary);
}

table {
  width: 100%;
  border-collapse: collapse;
}
table caption {
  padding: 8px 0;
  font-size: 13px;
  color: var(--grey-500);
  text-align: left;
}
table th,
table td {
  padding: 8px 16px;
  text-align: left;
  font-size: 14px;
  border-bottom: 1px solid var(--grey-200);
}
table th {
  font-weight: 600;
  color: var(--grey-600);
  background: var(--grey-50);
}
table td {
  font-weight: 400;
  color: var(--secondary);
}
table td pre {
  white-space: pre-wrap;
}
table tbody tr:nth-child(even) {
  background: var(--grey-100);
}
table tbody tr:nth-child(odd) {
  background: var(--white);
}
table tbody tr:hover {
  background: var(--grey-150);
}
table tbody tr:last-child th,
table tbody tr:last-child td {
  border-bottom: none;
}

.openedxscorm_block .full-screen-scorm .scorm_button {
  padding: 12px;
}

.scorm_button .js-button-full-screen {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  height: 32px;
  padding: 0 16px;
  border: none;
  border-radius: var(--radius-rounded);
  background-color: var(--secondary);
  color: var(--white);
  font-family: var(--body-font-family);
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
}
.scorm_button .js-button-full-screen::before {
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
  background-color: var(--white);
  transition: all 0.2s ease;
}
.scorm_button .js-button-full-screen.full-screen-on::before {
  mask-image: url("/static/axeptio/custom/icons/fullscreen.svg");
}
.scorm_button .js-button-full-screen.full-screen-off::before {
  mask-image: url("/static/axeptio/custom/icons/fullscreen-exit.svg");
}
.scorm_button .js-button-full-screen:hover {
  color: var(--secondary);
  background-color: var(--primary);
}
.scorm_button .js-button-full-screen:hover::before {
  background-color: var(--secondary);
}
.scorm_button .js-button-full-screen:focus {
  outline: none;
  box-shadow: 0 0 0 2px var(--grey-200);
}
.scorm_button .js-button-full-screen:active {
  transform: scale(0.98);
}
.scorm_button .full-screen-on.active,
.scorm_button .full-screen-off.active {
  display: inline-flex;
}

@media (max-width: 768px) {
  .scorm_button {
    bottom: 16px;
    right: 16px;
  }
  .scorm_button .js-button-full-screen {
    height: 40px;
    padding: 0 12px;
    font-size: 14px;
    gap: 6px;
  }
  .scorm_button .js-button-full-screen::before {
    width: 18px;
    height: 18px;
  }
}
.openedxscorm_block .full-screen-scorm .full-screen-off {
  display: inline-flex;
}

.openedxscorm_block .full-screen-off,
.openedxscorm_block .full-screen-scorm .full-screen-on {
  display: none;
}

.xblock-student_view-html {
  /* Layout */
  /* Justify / Align */
  /* Flex width sizing - relative */
  /* Flex width sizing - fixed */
  /* Text */
  /* Spacing */
  /* Mobile */
}
.xblock-student_view-html .flex {
  display: flex;
}
.xblock-student_view-html .flex-wrap {
  flex-wrap: wrap;
}
.xblock-student_view-html .flex-col {
  flex-direction: column;
}
.xblock-student_view-html .gap-6 {
  gap: 1.5rem;
}
.xblock-student_view-html .gap-8 {
  gap: 2rem;
}
.xblock-student_view-html .gap-12 {
  gap: 3rem;
}
.xblock-student_view-html .justify-center {
  justify-content: center;
}
.xblock-student_view-html .items-center {
  align-items: center;
}
.xblock-student_view-html .flex-1 {
  flex: 1 1 0%;
}
.xblock-student_view-html .w-1\/2 {
  flex: 0 0 45%;
  max-width: 45%;
}
.xblock-student_view-html .w-1\/3 {
  flex: 0 0 30%;
  max-width: 30%;
}
.xblock-student_view-html .w-full {
  flex: 0 0 100%;
  max-width: 100%;
}
.xblock-student_view-html .w-80 {
  flex: 0 0 80px;
  max-width: 80px;
}
.xblock-student_view-html .w-120 {
  flex: 0 0 120px;
  max-width: 120px;
}
.xblock-student_view-html .w-140 {
  flex: 0 0 140px;
  max-width: 140px;
}
.xblock-student_view-html .w-160 {
  flex: 0 0 160px;
  max-width: 160px;
}
.xblock-student_view-html .w-180 {
  flex: 0 0 180px;
  max-width: 180px;
}
.xblock-student_view-html .w-200 {
  flex: 0 0 200px;
  max-width: 200px;
}
.xblock-student_view-html .w-300 {
  flex: 0 0 300px;
  max-width: 300px;
}
.xblock-student_view-html .w-400 {
  flex: 0 0 400px;
  max-width: 400px;
}
.xblock-student_view-html .w-420 {
  flex: 0 0 420px;
  max-width: 420px;
}
.xblock-student_view-html .w-500 {
  flex: 0 0 500px;
  max-width: 500px;
}
.xblock-student_view-html .text-center {
  text-align: center;
}
.xblock-student_view-html .text-left {
  text-align: left;
}
.xblock-student_view-html .text-justify {
  text-align: justify;
}
.xblock-student_view-html .m-auto {
  margin: auto;
}
.xblock-student_view-html .mt-auto {
  margin-top: auto;
}
.xblock-student_view-html .mt-4 {
  margin-top: 1rem;
}
.xblock-student_view-html .mt-6 {
  margin-top: 1.5rem;
}
.xblock-student_view-html .mb-4 {
  margin-bottom: 1rem;
}
.xblock-student_view-html .mb-6 {
  margin-bottom: 1.5rem;
}
.xblock-student_view-html .p-2 {
  padding: 0.5rem;
}
.xblock-student_view-html .p-4 {
  padding: 1rem;
}
@media (max-width: 500px) {
  .xblock-student_view-html .sm\:w-full {
    flex: 1 1 100%;
    max-width: 100%;
  }
  .xblock-student_view-html .sm\:flex-col-reverse {
    flex-direction: column-reverse;
  }
  .xblock-student_view-html .sm\:order-first {
    order: -1;
  }
}
.xblock-student_view-html .xmodule_HtmlBlock {
  max-width: 680px;
  margin: 0 auto;
  padding: 32px 24px;
  font-size: 18px;
  line-height: 1.75;
  color: var(--grey-500);
}
@media (max-width: 768px) {
  .xblock-student_view-html .xmodule_HtmlBlock {
    padding: 24px 16px;
    font-size: 16px;
  }
}
.xblock-student_view-html h1, .xblock-student_view-html h2, .xblock-student_view-html h3, .xblock-student_view-html h4, .xblock-student_view-html h5, .xblock-student_view-html h6 {
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
  color: var(--secondary);
  margin-top: 40px;
  margin-bottom: 16px;
  line-height: 1.3;
  letter-spacing: -0.02em;
}
.xblock-student_view-html h1 {
  font-size: 40px;
  margin-top: 0;
}
@media (max-width: 768px) {
  .xblock-student_view-html h1 {
    font-size: 32px;
  }
}
.xblock-student_view-html h2 {
  font-size: 32px;
  margin-top: 48px;
  padding-bottom: 8px;
}
@media (max-width: 768px) {
  .xblock-student_view-html h2 {
    font-size: 28px;
  }
}
.xblock-student_view-html h3 {
  font-size: 24px;
}
@media (max-width: 768px) {
  .xblock-student_view-html h3 {
    font-size: 22px;
  }
}
.xblock-student_view-html h4 {
  font-size: 20px;
}
.xblock-student_view-html p {
  font-size: 18px !important;
  margin-bottom: 24px;
  color: var(--grey-500);
}
.xblock-student_view-html p:last-child {
  margin-bottom: 0;
}
.xblock-student_view-html a {
  color: var(--orange-500);
  font-weight: 600;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: all 0.2s ease;
}
.xblock-student_view-html a:hover {
  color: var(--orange-500);
  border-bottom-color: var(--orange-500);
}
.xblock-student_view-html ol, .xblock-student_view-html ul {
  margin: 24px 0 !important;
  padding-left: 32px !important;
}
.xblock-student_view-html ol li, .xblock-student_view-html ul li {
  font-size: 18px !important;
  margin-bottom: 12px !important;
}
.xblock-student_view-html ol {
  counter-reset: item;
}
.xblock-student_view-html ol > li {
  position: relative;
  list-style: none;
  counter-increment: item;
}
.xblock-student_view-html ol > li::before {
  content: counter(item) ".";
  position: absolute;
  left: -32px;
  font-weight: 700;
  color: var(--secondary);
}
.xblock-student_view-html img {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 40px auto;
  border-radius: 8px;
}
@media (max-width: 500px) {
  .xblock-student_view-html img {
    max-width: 100% !important;
    height: auto !important;
  }
}
.xblock-student_view-html img[width="100%"] {
  width: 100%;
}
.xblock-student_view-html img[width="50%"] {
  width: 50%;
}
@media (max-width: 768px) {
  .xblock-student_view-html img[width="50%"] {
    width: 80%;
  }
}
.xblock-student_view-html table {
  border: 0 !important;
  border-collapse: collapse;
  width: 100%;
  margin: 32px 0;
}
.xblock-student_view-html table tbody, .xblock-student_view-html table tr, .xblock-student_view-html table td {
  border: 0 !important;
  padding: 0;
}
.xblock-student_view-html table img {
  margin: 16px auto;
}
.xblock-student_view-html em, .xblock-student_view-html i {
  font-style: italic;
  color: var(--grey-400);
}
.xblock-student_view-html strong, .xblock-student_view-html b {
  font-weight: 700;
  color: var(--secondary);
}
.xblock-student_view-html code {
  background-color: var(--grey-100);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.9em;
  font-family: "Consolas", "Monaco", monospace;
  color: var(--secondary);
}
.xblock-student_view-html pre {
  background-color: var(--grey-100);
  padding: 24px;
  border-radius: 8px;
  overflow-x: auto;
  margin: 32px 0;
}
.xblock-student_view-html pre code {
  background-color: transparent;
  padding: 0;
}
.xblock-student_view-html hr {
  border: none;
  border-top: 1px solid var(--grey-200);
  margin: 48px 0;
}
.xblock-student_view-html iframe {
  margin: 40px 0;
  border-radius: 8px;
}
.xblock-student_view-html div[style*="max-width: 800px"] {
  max-width: 800px !important;
  text-align: left !important;
}
@media (max-width: 768px) {
  .xblock-student_view-html div[style*="max-width: 800px"] {
    max-width: 100% !important;
  }
}
.xblock-student_view-html p:first-of-type img {
  margin-top: 0;
}
.xblock-student_view-html figcaption {
  margin-top: 8px;
  text-align: center;
  font-size: 14px;
  color: var(--grey-400);
  font-style: italic;
}

.xblock-student_view-vertical .unit-title {
  font-size: 36px;
  margin-bottom: 32px;
  padding-bottom: 16px;
  color: var(--secondary);
  text-align: center;
}
@media (max-width: 768px) {
  .xblock-student_view-vertical .unit-title {
    font-size: 28px;
    margin-bottom: 24px;
  }
}

.xblock.xblock-student_view {
  margin-bottom: 48px;
}

[aria-hidden=true] {
  display: none;
}

.tex2jax_ignore {
  display: none;
}

.unit-title {
  font-family: var(--title-font-family);
  font-weight: var(--title-font-weight);
}

.content-wrapper,
.course-wrapper,
#seq_content {
  min-height: calc(100vh - 194px);
}

#seq_content {
  margin: 0 auto;
  padding: 20px;
  max-width: 728px;
}

.xblock h1 {
  display: none;
}

/*# sourceMappingURL=style.css.map */