/* GLOBAL */

:root {
  --color-primary-900: #060607;
  --color-primary-800: #2E3338;
  --color-primary-700: #505B65;
  --color-primary-600: #6D7D8D;
  --color-primary-500: #9AA4AE;
  --color-primary-400: #D5D8DA;
  --color-primary-300: #E5F1F3;
  --color-primary-200: #EFEFEF;
  --color-primary-100: #FFFFFF;
  --color-marinara: #F35353;
  --color-tangerine: #FF9B3C;
  --color-sunshine: #FFD335;
  --color-mint: #26C281;
  --color-glacier: #2B90EF;
  --color-blueberry: #6A46FA;
  --color-lavender: #B05DD9;
  --font-family-heading: 'Sharp Grotesk Semibold 21';
  --font-family-body: 'GT America';
  --font-weight-bold: 800;
  --font-weight-medium: 500;
  --font-weight-regular: 400;
  --transition-linear: linear 0.2s;
  --transition-whoosh: cubic-bezier(0.19, 1, 0.22, 1) 1s;
}

@font-face {
  font-family: 'Sharp Grotesk Semibold 21';
  src: url('../fonts/SharpGroteskSmBold21.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'GT America';
  src: url('../fonts/GT-America-Standard-Bold.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'GT America';
  src: url('../fonts/GT-America-Standard-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'GT America';
  src: url('../fonts/GT-America-Standard-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'NanumSquare';
  src: url('../fonts/NanumSquareOTFExtraBold.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'NanumBarunGothic';
  src: url('../fonts/NanumBarunGothicBold.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
}

@font-face {
  font-family: 'NanumBarunGothic';
  src: url('../fonts/NanumBarunGothic.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
}

body {
  margin: 0px;
  font-family: var(--font-family-body), -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  width: 100%;
  height: 100vh;
  color: var(--color-primary-900);
  background: var(--color-primary-300);
  font-weight: var(--font-weight-regular);
  font-size: 16px;
  line-height: 20px;
  overflow-x: hidden;
  letter-spacing: -0.32px;
}

a {
  color: inherit;
  text-decoration: none;
  outline: none;
  color: var(--color-glacier);
  font-weight: var(--font-weight-medium);
}

img {
  object-fit: cover;
}

figure {
  margin: 0px;
}

.fit-width {
  width: 100%;
  display: block;
}

.fit-parent {
  width: 100%;
  height: 100%;
}

.fit-height {
  height: 100%;
}

.desktop {
  display: none;
}

/* TYPOGRAPHY */

h1, h2, h3 {
  font-weight: var(--font-weight-bold);
  font-family: var(--font-family-heading), -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  margin: 0px;
}

h1 {
  font-size: 32px;
  line-height: 40px;
}

h2 {
  font-size: 24px;
  line-height: 32px;
}

h3 {
  font-size: 18px;
  line-height: 24px;
}

h4, h5 {
  font-weight: var(--font-weight-medium);
  margin: 0px;
}

h4 {
  font-size: 14px;
  font-weight: var(--font-weight-regular);
  line-height: 18px;
  letter-spacing: -0.28px;
}

h5 {
  font-size: 12px;
  font-weight: var(--font-weight-regular);
  line-height: 16px;
  letter-spacing: -0.24px;
  margin: 0px;
}

h6 {
  font-size: 14px;
  letter-spacing: 0.24px;
  margin: 0px;
  font-weight: 500;
}

p {
  font-size: 16px;
  line-height: 24px;
  margin: 16px 0px;
  letter-spacing: -0.32px;
}

.btn {
  font-family: inherit;
  padding: 8px 12px;
  margin: 0px;
  -webkit-appearance: none;
  background: none;
  border: 0px;
  text-align: left;
  display: flex;
  font-size: 16px;
  color: var(--color-primary-100);
  border-radius: 8px;
  font-weight: var(--font-weight-medium);
  outline: none;
  cursor: pointer;
  letter-spacing: -0.32px;
}

.btn-primary {background: var(--color-primary-900);}

.btn-secondary {
  background: var(--color-primary-700);
}

.btn-tertiary {
  border: 1px solid var(--color-primary-400);
  color: var(--color-primary-900);
}

.btn img {
  margin-left: 8px;
  width: 20px;
  height: 20px;
}

li {
  padding-left: 16px;
  line-height: 20px;
  list-style: none;
  margin: 8px 0px;
  position: relative;
  font-size: 14px;
  color: var(--color-primary-700);
}

li::before {
  content: '';
  width: 4px;
  height: 4px;
  border: 2px solid var(--color-primary-500);
  position: absolute;
  border-radius: 50%;
  top: 6px;
  left: 0px;
}

hr {
  margin: 24px 0px;
  border-style: none;
  height: 1px;
  display: block;
  background: var(--color-primary-200);
}

ol li {
  display: flex;
  padding-left: 24px;
}

ol li::before {
  display: none;
}

.ol-index {
  position: absolute;
  font-size: 12px;
  color: var(--color-primary-700);
  line-height: 16px;
  width: 16px;
  text-align: center;
  background: var(--color-primary-300);
  border-radius: 50%;
  left: 0px;
  top: 2px;
  font-weight: var(--font-weight-bold);
}

.red {
  color: var(--color-marinara);
}


/* TYPOGRAPHY FOR LOCALIZATION */

.korean {
  font-family: var(--font-family-body), 'NanumBarunGothic', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}

.korean h1, .korean h2, .korean h3 {
  font-family: var(--font-family-heading), 'NanumSquare', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}

.korean .card h3 {
  font-family: 'NanumSquare', BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}

.chinese .card h3, .punjabi .card h3 {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
}

.arabic {
  direction: rtl;
}

.arabic .topbar-nav {
  margin-right: auto;
  margin-left: 0px;
}

.arabic .topbar-nav-item {
  margin-left: 0px;
  margin-right: 16px;
}

.arabic .header-action .btn:first-child {
  margin-right: 0px;
  margin-left: 8px;
}

.arabic .header-action .btn img {
  margin-left: 0px;
  margin-right: auto;
}

.arabic ol li {
  padding-left: 0px;
  padding-right: 24px;
}

.arabic .ol-index {
  left: auto;
  right: 0px;
}

.arabic li {
  padding-left: 0px;
  padding-right: 16px;
}

.arabic li::before {
  left: auto;
  right: 0px;
}

.arabic .content-list ul {
  padding-right: 0px;
}

.arabic .content-share-item {
  margin-right: 0px;
  margin-left: 8px;
}

.arabic .card-toggle {
  margin-left: 0px;
  margin-right: 16px;
}

.arabic .card-toggle img {
  margin-left: 0px;
  margin-right: 8px;
  transform: rotate(180deg);
}

.arabic .content-symptom-category:first-child {
  margin-right: 0px;
  margin-left: 16px;
}

.arabic .card-tag-true, .arabic .card-tag-maybe, .arabic .card-tag-false {
  margin-right: 0px;
  margin-left: 8px;
}

.arabic .about-team-member-link a {
  margin-right: 0px;
  margin-left: 16px;
}

.arabic .share-modal-action {
  margin-right: 0px;
  margin-left: 8px;
}

.arabic .share-modal-action:last-child {
  margin: 0px;
}

.arabic .content-symptom-item {
  padding: 0px;
}

.language-modal-item:nth-child(8) {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
  font-weight: var(--font-weight-bold);
}

/* TOPBAR */

.topbar {
  padding: 24px 24px 40px;
  display: flex;
}

.topbar-logo {
  width: 32px;
  height: 32px;
  overflow: hidden;
}

.topbar-nav {
  margin-left: auto;
  display: flex;
}

.topbar-nav-item {
  color: var(--color-primary-700);
  line-height: 32px;
  margin-left: 16px;
}

.topbar-nav-item:first-child {
  margin: 0px;
}

.topbar-nav-item a {
  color: inherit;
}

/* HEADER */

.about-active .header-container {
  display: none;
}

.header {
  padding: 0px 24px;
  margin-bottom: 24px;
}

.header-title {
  margin-bottom: 8px;
}

.header-description {
  color: var(--color-primary-800);
  margin-bottom: 16px;
  font-weight: var(--font-weight-medium);
}

.header-action .btn {
  width: calc(50% - 4px);
}

.header-action .btn img {
  margin-left: auto;
}

.header-action {
  display: flex;
}

.header-action .btn:first-child {
  margin-right: 8px;
}

.header-caption {
  margin-top: 16px;
}

.header-caption-item {
  color: var(--color-primary-700);
  font-weight: var(--font-weight-medium);
}

.header-caption-item a {
  font-weight: var(--font-weight-bold);
}

/* NAV */

.nav {
  padding: 16px;
  display: flex;
  overflow-x: scroll;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  background: var(--color-primary-300);
}

.tongan .nav {
  flex-direction: column;
}

.nav-item {
  white-space: nowrap;
  margin-left: 4px;
  color: var(--color-primary-700);
  font-weight: var(--font-weight-medium);
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 14px;
}

.nav-item:first-child {
  margin-left: 0px;
}

.nav-item-active {
  color: var(--color-primary-100);
  background: var(--color-primary-900);
}

.nav-item:last-child {
  padding-right: 16px;
}

/* CONTENT */

.content-body {
  padding: 0px 16px 16px;
}

.card {
  background: var(--color-primary-100);
  border-radius: 8px;
  padding: 0px 0px 16px;
  margin-bottom: 16px;
  overflow: hidden;
}

.card:last-child {
  margin-bottom: 0px;
}

.card-icon {
  width: 48px;
  height: 48px;
  margin-bottom: 16px;
  padding: 16px 16px 0px;
}

.card-icon ~ .card-title {
  margin-top: 16px;
}

.card-title {
  padding: 0px 16px;
  margin-top: 24px;
}

.card-body {
  padding: 0px 16px;
}

.card-content, .card-extra {
  color: var(--color-primary-800);
}

.card-content p {
  margin-bottom: 0px;
}

.card-extra p:first-child {
  margin-top: 0px;
}

.card-extra {
  margin-top: 24px;
  padding-top: 24px;
  border-top: 1px solid var(--color-primary-200);
}

.card-tag-false {
  text-transform: uppercase;
  font-weight: 700;
  background: var(--color-marinara);
  color: var(--color-primary-100);
  font-weight: var(--font-weight-bold);
  margin-right: 8px;
  font-size: 14px;
  line-height: 20px;
  padding: 0px 8px;
  border-radius: 4px;
  display: inline-block;
}

.card-tag-maybe {
  text-transform: uppercase;
  font-weight: 700;
  background: var(--color-tangerine);
  color: var(--color-primary-100);
  font-weight: var(--font-weight-bold);
  margin-right: 8px;
  font-size: 14px;
  line-height: 20px;
  padding: 0px 8px;
  border-radius: 4px;
  display: inline-block;
}

.card-tag-true {
  text-transform: uppercase;
  font-weight: 700;
  background: var(--color-mint);
  color: var(--color-primary-100);
  font-weight: var(--font-weight-bold);
  margin-right: 8px;
  font-size: 14px;
  line-height: 20px;
  padding: 0px 8px;
  border-radius: 4px;
  display: inline-block;
}

.card-toggle {
  display: inline-flex;
  margin-top: 16px;
  margin-left: 16px;
  cursor: pointer;
}

.card-toggle-caption {
  font-weight: var(--font-weight-bold);
}

.card-toggle-icon {
  width: 16px;
  height: 16px;
  margin-top: 2px;
  margin-left: 4px;
  transition: var(--transition-whoosh));
}

.card-active .card-toggle img {
  transform: rotate(-90deg) !important;
}

.paragraph-header {
  color: var(--color-primary-900);
  font-weight: var(--font-weight-bold);
  font-size: 18px;
  margin-bottom: 8px;
  margin-top: 24px;
}

.card-extra p:first-child .paragraph-header {
  margin-top: 0px;
}

.card-content a:hover , .card-extra a:hover {
  text-decoration: underline;
}

.content-symptom-container {
  display: flex;
  margin: 16px 0px;
}

.content-symptom-category {
  margin: 0px;
  width: calc(50% - 8px);
  box-sizing: border-box;
  background: #ecf0f1ad;
  border-radius: 8px;
  padding: 16px;
}

.content-symptom-item {
  list-style: none;
  margin-bottom: 8px;
}

.content-symptom-title {
  color: var(--color-primary-900);
  font-weight: var(--font-weight-bold);
  font-size: 18px;
  margin-bottom: 16px;
}

.content-symptom-item:last-child {
  margin-bottom: 0px;
}

.content-symptom-category:first-child {
  margin-right: 16px;
}

.content-symptom-item {
  padding-left: 0px;
}

.content-symptom-item::before {
  display: none;
}

.content-list {
  margin: 16px 0px;
  padding: 0px;
}

.content-list div:first-child {
  margin-bottom: 8px;
}

.content-list-label-positive {
  text-transform: uppercase;
  color: var(--color-glacier);
  font-weight: var(--font-weight-bold);
}

.content-list-label-negative {
  text-transform: uppercase;
  color: var(--color-marinara);
  font-weight: var(--font-weight-bold);
}

.content-list ul {
  padding-left: 0px;
  margin-left: 0px;
}

.youtube-embed {
  position: relative;
  padding-bottom: 56.25%;
  height: 0px;
  overflow: hidden;
  max-width: 100%;
  margin: 24px 0px;
}

.youtube-embed iframe, .youtube-embed object, .youtube-embed embed {
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
}

.youtube-embed:last-child {
  margin-bottom: 0px;
}

.content-table {
  display: flex;
  margin: 24px 0px;
  flex-direction: column;
}

.content-table-row {
  display: flex;
  width: 100%;
}

.content-table-row:first-child {
  margin-bottom: 24px;
}

.content-table-column {
  width: 50%;
}

.content-table-caption {
  color: var(--color-primary-600);
  font-weight: var(--font-weight-bold);
}

.content-source, .content-source a {
  color: var(--color-primary-600);
}

.content-additional-disclaimer {
  margin: 72px 0px 24px;
}

.content-additional-disclaimer-title {
  margin-bottom: 8px;
}

.content-additional-disclaimer-caption {
  color: var(--color-primary-700);
  line-height: 20px;
}

.content-tips-disclaimer {
  color: var(--color-primary-700);
  line-height: 20px;
}

/* MODAL */

.modal {
  position: fixed;
  width: 100vw;
  height: 100vh;
  top: 0px;
  left: 0px;
  background: var(--color-primary-300);
  padding: 24px 24px 144px;
  box-sizing: border-box;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition-whoosh);
  overflow-y: scroll;
}

.modal-active {
  opacity: 1;
  visibility: visible;
}

.modal-close {
  width: 24px;
  height: 24px;
}

.modal-content {
  transition: var(--transition-whoosh);
  opacity: 0;
  transform: translateY(40px);
  transition-delay: 0s;
  width: 100%;
  margin-top: 32px;
}

/* LANGUAGE MODAL */

.modal-active .modal-content {
  opacity: 1;
  transform: translateY(0px);
  transition-delay: 0.2s;
}

.language-modal-item {
  color: var(--color-primary-700);
  margin-bottom: 24px;
  font-family: var(--font-family-heading), 'NanumBarunGothic', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif !important;
}

.language-modal-item a {
  color: inherit;
}

.language-modal-item-inactive {
  color: var(--color-primary-500);
}

.language-modal-item:last-child {
  margin: 0px;
}

.language-modal::after {content: '';position: fixed;width: 100%;height: 120px;background: linear-gradient(rgba(229, 241, 243, 0), rgb(229, 241, 243));bottom: 0px;left: 0px;}

.language-modal .modal-content::after {content: '';height: 120px;display: block;}

.modal-language-section:first-child {
  margin-bottom: 24px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(6, 6, 7, 0.08);
}

.modal-language-caption {
  color: var(--color-primary-700);
  font-weight: var(--font-weight-bold);
  margin-bottom: 24px;
}

/* LANGUAGE BAR */

.language-bar {
  border-bottom: 1px solid rgba(6, 6, 7, 0.08);
  padding: 8px 0px;
}

.language-bar-content {
  width: 1024px;
  margin: 0px auto;
  display: flex;
  justify-content: flex-end;
}

.language-bar a {
  color: var(--color-primary-700);
  font-size: 14px;
  margin-left: 16px;
  transition: var(--transition-linear);
}

.language-bar a:hover {
  color: var(--color-primary-900);
}

/* SHARE MODAL */

.modal-caption {
  margin-top: 8px;
  margin-bottom: 32px;
  color: var(--color-primary-700);
}

.btn-share {
  width: 100%;
  padding: 10px 0px;
  background: var(--color-primary-700);
  margin-bottom: 12px;
  justify-content: center;
  flex-direction: row-reverse;
  position: relative;
}

.btn-share:last-child {
  margin: 0px;
}

.btn-share img {
  margin-left: 0px;
  margin-right: 8px;
}

.btn-twitter {
  background: #1DA1F2;
}

.btn-facebook {
  background: #1877F2;
}

.btn-messenger {
  background: var(--color-primary-100);
}

.btn-messenger span {
  color: var(--color-primary-900);
}

.fb-share-button {
  position: absolute !important;
  top: 0px;
  left: 0px;
  cursor: pointer;
  opacity: 0;
  width: 100%;
  height: 100%;
}

.twitter-share-button {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0px;
  top: 0px;
  opacity: 0;
  cursor: pointer;
}

.share-modal-action {
  width: calc((100% - 40px) / 6);
  height: 48px;
  border-radius: 8px;
  overflow: hidden;
  margin-right: 8px;
  position: relative;
}

.share-modal-action-container {
  display: flex;
  margin-bottom: 8px;
}

.share-modal-action:last-child {
  margin: 0px;
}

.share-modal-action a {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0px;
  left: 0px;
}

.clipboard-btn {
  position: relative;
}

.clipboard-success {
  width: 240px;
  color: var(--color-primary-700);
  position: absolute;
  right: 0px;
  text-align: right;
  top: 44px;
  opacity: 0;
  visibility: hidden;
  transition: var(--transition-whoosh);
  transform: translateY(-8px);
}

.clipboard-success-active {
  transform: translateY(0px);
  opacity: 1;
  visibility: visible;
}

.share-modal .clipboard-success {
  text-align: left;
  width: 100%;
}

.btn-share-email a {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
}

/* ABOUT */

.about {
  padding: 40px 24px;
}

.about-title {
  margin-bottom: 40px;
}

.about-description {
  color: var(--color-primary-800);
}

.about-disclaimer {
  margin-top: 40px;
}

.about-disclaimer-content {
  color: var(--color-primary-800);
}

.about-team {
  margin-top: 80px;
}

.about-team-section {
  margin-top: 40px;
}

.about-team-member {
  margin-top: 16px;
}

.about-team-member-name {
  font-weight: var(--font-weight-bold);
  margin-bottom: 4px;
}

.about-team-member-title {
  color: var(--color-primary-700);
}

.about-team-member-link {
  display: flex;
  margin-top: 4px;
}

.about-team-member-link a {
  margin-right: 16px;
}

.about-team-thanks {
  margin: 40px 0px;
  color: var(--color-primary-800);
}

.about-action-btn {
  width: 100%;
  justify-content: center;
  padding: 12px 12px;
  box-sizing: border-box;
}

.about-action-caption {
  text-align: center;
  margin-top: 8px;
  color: var(--color-primary-800);
}


/* DESKTOP */

@media all and (min-width: 1200px) {

  /* GRID & LAYOUT */

  .container {
    width: 1024px;
    margin: 0px auto;
    padding: 32px 0px;
  }

  .grid {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-column-gap: 32px;
    position: relative;
  }

  .mobile {
    display: none;
  }

  .desktop {
    display: block;
  }

  /* HEADER */

  .header-title, .header-description {
    grid-column: 1 / 6;
  }

  .topbar {
    padding: 0px;
    margin-bottom: 24px;
  }

  .topbar-nav-item {
    margin-left: 32px;
  }

  .about-active .header-container {
    display: block;
  }

  .header {
    padding: 0px;
    margin-bottom: 24px;
  }

  .nav {
    padding: 8px 0px;
    margin-bottom: 32px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(6, 6, 7, 0.08);
    position: relative;
  }

  .tongan .nav {
    flex-direction: row;
  }

  .header-description {
    margin-bottom: 0px;
  }

  .nav-item {
    padding: 8px 12px;
    border-radius: 8px;
    transition: var(--transition-linear);
    font-size: 16px;
    margin-left: 16px;
  }

  .nav-item:hover {
    background: var(--color-primary-400);
    color: var(--color-primary-900);
  }

  .nav-item-active, .nav-item-active:hover {
    background: var(--color-primary-900);
    color: var(--color-primary-100);
    font-weight: var(--font-weight-medium);
  }

  /* TABLE OF CONTENTS */

  .content-nav {
    grid-column: 1 / 4;
    position: sticky;
    top: 16px;
    height: calc(100vh - 80px);
  }

  .content-nav-scroller {
    height: 100%;
    overflow-y: scroll;
  }

  .content-nav-scroller::after {content: '';display: block;width: 100%;height: 120px;}

  .content-body {
    grid-column: 4 / 10;
    padding: 0px;
  }

  .content-nav-caption {
    color: var(--color-primary-700);
    font-weight: var(--font-weight-bold);
    margin-bottom: 16px;
  }

  .content-nav-item {
    transition: var(--transition-linear);
    color: var(
      --color-primary-700);
    margin-bottom: 16px;
    cursor: pointer;
  }

  .content-nav-item:hover {
    color: var(--color-primary-900);
  }

  .content-nav::before {content: '';position: absolute;width: 100%;height: 120px;bottom: 0px;background: linear-gradient(rgba(229, 241, 243, 0), rgb(229, 241, 243));}

  /* ASIDE */

  .content-aside {
    grid-column: 10 / 13;
    position: sticky;
    top: 16px;
    height: calc(100vh - 16px);
  }

  .content-language-caption {
    color: var(--color-primary-700);
    font-weight: var(--font-weight-bold);
    margin-bottom: 8px;
  }

  .content-language-selector {
    width: 100%;
  }

  .content-language-selector img {
    margin-left: auto;
    transition: var(--transition-whoosh);
  }

  .content-language {
    margin-bottom: 24px;
    position: relative;
    z-index: 1;
  }

  .content-language-popup {
    padding: 12px;
    background: var(--color-primary-700);
    border-radius: 8px;
    position: absolute;
    width: 100%;
    box-sizing: border-box;
    color: var(--color-primary-100);
    font-weight: var(--font-weight-medium);
    top: 70px;
    transition: var(--transition-whoosh);
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px);
  }

  .content-language-popup-item {
    margin-top: 16px;
    color: var(--color-primary-100);
    display: block;
  }

  .content-language-popup-item:first-child {
    margin-top: 0px;
  }

  .content-language-popup-section:first-child {
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16);
  }

  .content-language-popup-caption {
    font-weight: var(--font-weight-bold);
    opacity: 0.8;
  }

  .content-language-selector-item-inactive {
    opacity: 0.5;
  }

  .content-language-active .content-language-popup {
    transform: translateY(0px);
    opacity: 1;
    visibility: visible;
  }

  .content-language-active .content-language-selector img {
    transform: rotate(180deg);
  }

  .content-share-caption {
    color: var(--color-primary-700);
    font-weight: var(--font-weight-bold);
    margin-bottom: 8px;
  }

  .content-share-item {
    width: 20px;
    height: 20px;
    padding: 10px;
    margin-right: 8px;
    background: var(--color-primary-700);
    border-radius: 8px;
    position: relative;
    cursor: pointer;
  }

  .content-share-email a {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    opacity: 0;
  }

  .content-share-options {
    display: flex;
  }

  .content-share-item:last-child {
    margin: 0px;
  }

  .content-share-twitter {
    background: #1DA1F2;
  }

  .content-share-facebook {
    background: #1877F2;
  }

  .content-share-messenger {
    background: var(--color-primary-100);
  }

  .content-share {
    margin-bottom: 24px;
  }

  .content-footnote {
    color: var(--color-primary-700);
    font-weight: var(--font-weight-medium);
  }

  .content-footnote a {
    font-weight: var(--font-weight-bold);
  }

  /* SCROLLBAR */

  .nav {
    overflow: hidden;
  }

  .content-nav-scroller, .nav {
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE 10+ */
  }
  
  .content-nav-scroller::-webkit-scrollbar-track, .nav::-webkit-scrollbar-track {
    -webkit-box-shadow: none !important;
    background-color: transparent;
  }
  
  .content-nav-scroller::-webkit-scrollbar, .nav::-webkit-scrollbar {
    width: 6px !important;
    background-color: transparent;
  }
  
  .content-nav-scroller::-webkit-scrollbar-thumb, .content-nav-scroller::-webkit-scrollbar-corner, .content-nav-scroller::-webkit-scrollbar-resizer, .nav::-webkit-scrollbar-thumb, .nav::-webkit-scrollbar-corner, .nav::-webkit-scrollbar-resizer {
    background-color: transparent;
  }

  .content-symptom-item {
    padding-left: 16px;
  }

  .content-symptom-item::before {
    display: block;
  }

  .content-table {
    flex-direction: row;
  }

  .content-table-row {
    width: 50%;
  }

  .about {
    padding: 0px;
    margin-top: 80px;
  }

  .about-title, .about-description, .about-disclaimer {
    grid-column: 1 / span 8;
  }

  .about-description {
    margin-bottom: 0px;
    margin-top: 16px;
  }

  .about-title + .about-description {
    margin-top: 0px;
  }

  .about-disclaimer-content:last-child {
    margin-bottom: 0px;
  }

  .about-team-section {
    margin-top: 0px;
  }

  .about-team-title {
  }

  .about-team-section:nth-child(1) {
    grid-column: 1 / span 3;
  }

  .about-team-section:nth-child(2) {
    grid-column: 4 / span 3;
  }

  .about-team-section:nth-child(3) {
    grid-column: 7 / span 3;
  }

  .about-team-section:nth-child(4) {
    grid-column: 10 / span 3;
  }

  .about-team-row {
    margin-top: 80px;
  }

  .about-team-title + .about-team-row {
    margin-top: 40px;
  }

  .about-team-thanks {margin-top: 80px;}

  .about-action {
    grid-column: 10 / span 3;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
  }

  .about-action.mobile {
    display: none;
  }

}

@media all and (min-width: 1279px) {

  .language-bar-content {
    width: 1200px;
  }

  .container {
    width: 1200px;
    padding: 40px 0px;
  }

  .grid {
    grid-column-gap: 40px;
  }

  .nav {
    margin-bottom: 40px;
    padding-bottom: 24px;
  }
}