:root {
  --accent--lime--50: #f8fbe9;
  --accent--lime--100: #e8f3ba;
  --accent--lime--200: #ddee98;
  --accent--lime--300: #cde669;
  --accent--lime--400: #c3e14c;
  --accent--lime--500: #b4d91f;
  --accent--lime--600: #a4c51c;
  --accent--lime--700: #809a16;
  --accent--lime--800: #637711;
  --accent--lime--900: #4c5b0d;

  --accent--lime--P3--600: oklch(77.19% 0.2155 121.28);

  --accent--orange--50: #fdf0e9;
  --accent--orange--100: #f9d1ba;
  --accent--orange--200: #f6bb99;
  --accent--orange--300: #f29c6b;
  --accent--orange--400: #ef894e;
  --accent--orange--500: #eb6b22;
  --accent--orange--600: #d6611f;
  --accent--orange--700: #a74c18;
  --accent--orange--800: #813b13;
  --accent--orange--900: #632d0e;

  --accent--orange--P3--500: oklch(67.37% 0.2155 45.4);

  --border--small: 1px;
  --border--medium: 2px;
  --border--large: 4px;
  --border--xlarge: 6px;
  --border--xxlarge: 8px;
  --border--huge: 12px;
 
  --brand--blue--100: #c1d3f5;
  --brand--blue--200: #a3bef1;
  --brand--blue--300: #7aa0ea;
  --brand--blue--400: #608de6;
  --brand--blue--500: #3871e0;
  --brand--blue--600: #3367cc;
  --brand--blue--700: #28509f;
  --brand--blue--800: #1f3e7b;
  --brand--blue--900: #182f5e;

  --brand--blue--P3--400: oklch(65.18% 0.1992 262.79);
  --brand--blue--P3--500: oklch(57.16% 0.2518 261.98);
  --brand--blue--P3--600: oklch(53.46% 0.2764 261.96);
  --brand--blue--P3--700: oklch(44.78% 0.2606 262.2);

  --brand--navy--50: #e7eaee;
  --brand--navy--100: #b6bfcc;
  --brand--navy--200: #92a0b3;
  --brand--navy--300: #607490;
  --brand--navy--400: #41597a;
  --brand--navy--500: #123059;
  --brand--navy--600: #102c51;
  --brand--navy--700: #0d223f;
  --brand--navy--800: #0a1a31;
  --brand--navy--900: #081425;

  --brand--teal-bright--50: #e9fdfc;
  --brand--teal-bright--100: #baf7f6;
  --brand--teal-bright--200: #99f4f1;
  --brand--teal-bright--300: #6aeeeb;
  --brand--teal-bright--400: #4debe7;
  --brand--teal-bright--500: #21e6e1;
  --brand--teal-bright--600: #1ed1cd;
  --brand--teal-bright--700: #17a3a0;
  --brand--teal-bright--800: #127f7c;
  --brand--teal-bright--900: #0e615f;

  --brand--teal-bright--P3--500: oklch(83.77% 0.1932 191.95);
  --brand--teal-bright--P3--600: oklch(77.98% 0.1797 192.31);
  --brand--teal-bright--P3--700: oklch(64.85% 0.149 192.45);

  --brand--teal-dark--50: #ebf8f7;
  --brand--teal-dark--100: #c2e8e7;
  --brand--teal-dark--200: #a5dddc;
  --brand--teal-dark--300: #7ccecc;
  --brand--teal-dark--400: #62c5c2;
  --brand--teal-dark--500: #3bb6b3;
  --brand--teal-dark--600: #36a6a3;
  --brand--teal-dark--700: #2a817f;
  --brand--teal-dark--800: #206462;
  --brand--teal-dark--900: #194c4b;

  --brand--teal-dark--P3--500: oklch(70.94% 0.1625 192.67);
  --brand--teal-dark--P3--600: oklch(66.29% 0.1523 192.46);

  --neutrals--gray--50: #f2f2f2;
  --neutrals--gray--100: #d8d8d8;
  --neutrals--gray--200: #c5c5c5;
  --neutrals--gray--300: #aaa;
  --neutrals--gray--400: #999;
  --neutrals--gray--500: gray;
  --neutrals--gray--600: #747474;
  --neutrals--gray--700: #5b5b5b;
  --neutrals--gray--800: #464646;
  --neutrals--gray--900: #363636;

  --radius--component--tiny: 2px;
  --radius--component--xxsmall: 4px;
  --radius--component--xsmall: 6px;
  --radius--component--small: 8px;
  --radius--component--large: 16px;
  --radius--component--round: 9999px;

  --radius--button--round: 9999px;

  --radius--tiny: 2px;
  --radius--xxsmall: 4px;
  --radius--xsmall: 6px;
  --radius--small: 8px;
  --radius--medium: 12px;
  --radius--large: 16px;
  --radius--xlarge: 20px;
  --radius--xxlarge: 24px;
  --radius--huge: 32px;
  --radius--round: 9999px;

  --sizing--component--small: 16px;
  --sizing--component--medium: 32px;
  --sizing--component--large: 48px;
  --sizing--component--xlarge: 64px;
  --sizing--component--xxlarge: 80px;
  --sizing--component--huge: 96px;

  --sizing--rem--tiny-2px: 2px;
  --sizing--rem--xxsmall-4px: 4px;
  --sizing--rem--xsmall-8px: 8px;
  --sizing--rem--small-16px: 16px;
  --sizing--rem--medium-32px: 32px;
  --sizing--rem--large-48px: 48px;
  --sizing--rem--xlarge-64px: 64px;
  --sizing--rem--xxlarge-80px: 80px;
  --sizing--rem--huge-96px: 96px;
  --sizing--rem--xhuge-128px: 128px;
  --sizing--rem--xxhuge-192px: 192px;

  --sizing--spacing--tiny: 2px;
  --sizing--spacing--xxsmall: 4px;
  --sizing--spacing--xsmall: 8px;
  --sizing--spacing--small: 16px;
  --sizing--spacing--medium: 32px;
  --sizing--spacing--large: 48px;
  --sizing--spacing--xlarge: 64px;
  --sizing--spacing--xxlarge: 80px;
  --sizing--spacing--huge: 96px;
  --sizing--spacing--xhuge: 128px;
  --sizing--spacing--xxhuge: 192px;

  --spacing--md: 16px;

  --line-divider: #494b50;

  --text--color--text-black: #18191b;
  --text--color--text-white: var(--neutrals--gray--100);

  --transparent: #21e6e100;
  --dark--gray: #2f2f2f;

  --white: white;
  --page-black: #18191b;
  --base--black: #000;
  --base--white: #fff;
  --black: #0000004d;

  --font--font-family--barlow: Barlow, sans-serif;
  --font--font-family--monospace: "Red Hat Mono", ui-monospace, 'DejaVu Sans Mono', 'Bitstream Vera Mono', Inconsolata, 'Fira Mono', monospace;

}

.w-layout-blockcontainer {
  max-width: 940px;
  margin-left: auto;
  margin-right: auto;
  display: block;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.w-layout-vflex {
  flex-direction: column;
  align-items: flex-start;
  display: flex;
}


@media screen and (max-width: 991px) {
  .w-layout-blockcontainer {
    max-width: 728px;
  }
}

@media screen and (max-width: 767px) {
  .w-layout-blockcontainer {
    max-width: none;
  }
}

h1 {
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  margin-top: 0;
  margin-bottom: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1.1em;
}

h2 {
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  text-transform: none;
  margin-top: 0;
  margin-bottom: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.2em;
}

h3 {
  color: var(--text--color--text-white);
  letter-spacing: .015em;
  margin-top: 0;
  margin-bottom: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 2rem;
  font-weight: 700;
  line-height: 1.2em;
}

h4 {
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  margin-top: 0;
  margin-bottom: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 1.75rem;
  font-weight: 600;
  line-height: 1.2em;
}

h5 {
  color: var(--brand--teal-bright--600);
  letter-spacing: .015em;
  margin-top: 0;
  margin-bottom: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 1.375rem;
  font-weight: 600;
  line-height: 1.2em;
}

h6 {
  color: var(--text--color--text-black);
  letter-spacing: .01em;
  margin-top: 0;
  margin-bottom: .5rem;
  font-family: var(--font--font-family--barlow);
  font-size: .875rem;
  font-weight: 700;
  line-height: 1.2em;
}

p {
  font-family: var(--font--font-family--barlow);
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  margin-bottom: .5rem;
  font-size: 1.125rem;
  font-weight: 300;
  line-height: 1.45em;
}

a {
  color: var(--brand--teal-bright--P3--700);
  text-decoration: none;
}

a:hover {
  color: var(--brand--blue--P3--500);
}

li {
  font-family: var(--font--font-family--barlow);
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  margin-bottom: .5rem;
  font-size: 1.125rem;
  font-weight: 300;
  line-height: 1.45em;
}

img {
  width: 100%;
  max-width: 100%;
  height: 100%;
  display: inline-block;
}
img.side_image {
  width: 6em;
  padding: 0 1em;
  float: right;
}

strong {
  letter-spacing: .01em;
  font-weight: 700;
}

blockquote {
  border-left: 5px solid #e2e2e2;
  margin-top: 2rem;
  margin-bottom: 2rem;
  padding: 1rem 2rem;
  font-family: var(--font--font-family--barlow);
  font-size: 24px;
  font-weight: 500;
  line-height: 1.45em;
}

.navbar-section {
  padding-right: var(--sizing--rem--large-48px);
  padding-bottom: var(--sizing--rem--medium-32px);
  padding-left: var(--sizing--rem--large-48px);
  box-shadow: 0 var(--sizing--rem--xxsmall-4px) var(--sizing--rem--small-16px) 0 var(--brand--teal-dark--500);
  background-color: #fff;
  background-image: none;
  border: 0 solid #6586f6;
  border-bottom-width: 1px;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: none;
  height: 120px;
  text-decoration: none;
  display: flex;
  position: relative;
}

.display-xl-bold {
  text-align: center;
  letter-spacing: -.02em;
  margin-top: 0;
  margin-bottom: 16px;
  padding-bottom: 20px;
  font-family: var(--font--font-family--barlow);
  font-size: 5rem;
  font-weight: 700;
  line-height: 1em;
}

.display-xl-bold.fill-gradient {
  background-image: linear-gradient(90deg, var(--brand--teal-bright--P3--500), var(--brand--blue--P3--500));
  letter-spacing: -.02em;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  flex-flow: column;
  flex: 0 auto;
  align-items: stretch;
  max-width: none;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 12px;
  font-family: var(--font--font-family--barlow);
  font-weight: 700;
}

.text-xl-light {
  color: var(--text--color--text-white);
  text-align: left;
  letter-spacing: -.01em;
  max-width: 896px;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.45em;
}

.text-xl-light.is-centered {
  color: var(--text--color--text-white);
  text-align: center;
  letter-spacing: -.01em;
  max-width: none; /* max-width: 1024px; This was from the second definition */
  font-size: 26px; /* 28px in the second definition, 24px in the third, 20 in the 4th, 16 in the 5th */
  line-height: 1.45em;
  white-space: normal;
  word-break: keep-all;
  overflow-wrap: normal;
  text-wrap: pretty;
}

.text-xl-light.is-centered._2lines {
  width: 10ch; /* width: 6em in another */
  line-height: 1.2;
}

.state-default {
  flex: 0 auto;
  justify-content: flex-start;
  align-items: center;
  text-decoration: none;
  display: flex;
}

.vector {
  border-style: solid;
  border-color: #000;
}

.property-1-high {
  grid-row-gap: 12px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 338px;
  text-decoration: none;
  display: flex;
}

.slider {
  background-image: linear-gradient(90deg, #ffffff26 0%, #ffffff4d 25% 50%, #ffffff4d 75%, #ffffff26 100%);
  border-radius: 100px;
}

.rectangle-4364 {
  background-color: #d9d9d9;
  border-radius: 8px;
}

.label-container {
  justify-content: space-between;
  align-items: flex-start;
  width: 100%;
  max-width: 338px;
  text-decoration: none;
  display: flex;
}

.label-4 {
  grid-column-gap: 8px;
  justify-content: center;
  align-items: flex-start;
  width: 53px;
  padding: 2px;
  text-decoration: none;
  display: flex;
}

.med-low {
  color: #f4fffe;
  text-align: center;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.label-3 {
  grid-column-gap: 8px;
  justify-content: center;
  align-items: flex-start;
  width: 53px;
  padding: 2px;
  text-decoration: none;
  display: flex;
}

.medium {
  color: #f4fffe;
  text-align: center;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.label-2 {
  grid-column-gap: 8px;
  justify-content: center;
  align-items: flex-start;
  width: 53px;
  padding: 2px;
  text-decoration: none;
  display: flex;
}

.med-high {
  color: #fff;
  text-align: center;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.label-1 {
  grid-column-gap: 8px;
  justify-content: center;
  align-items: flex-start;
  width: 53px;
  padding: 2px;
  text-decoration: none;
  display: flex;
}

.high {
  color: #f4fffe;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.property-1-small {
  grid-row-gap: 8px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 338px;
  text-decoration: none;
  display: flex;
}

.bg {
  background-image: linear-gradient(90deg, #ffffff26 0%, #ffffff4d 25% 50%, #ffffff4d 75%, #ffffff26 100%);
}

.slide-bar {
  background-color: #22e6e1;
  border: .5px solid #22e6e1;
  border-radius: 4px 4px 1px 1px;
  box-shadow: inset -1.5px -2px 4px #0009, inset 1.5px 2px 4px #0009, 0 0 5px #00000073;
}

.small {
  color: #f4fffe;
  text-align: center;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.large {
  color: #fff;
  text-align: center;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.x-large {
  color: #f4fffe;
  letter-spacing: .06em;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 10px;
  font-weight: 600;
  line-height: 10px;
  text-decoration: none;
}

.page-wrapper {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background-color: #18191b;
  background-image: none;
  background-position: 0 0;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 100vh;
  margin-top: 0;
  padding-top: 7rem;
  inset: 0% 0% auto;
}

.page-wrapper.background-black {
  background-color: var(--page-black);
  background-image: none;
  background-position: 0 0;
  background-repeat: repeat;
  background-size: auto;
  background-attachment: scroll;
  height: auto;
  min-height: auto;
  margin-top: 0;
  padding-top: 7rem;
  padding-bottom: 0;
  display: flex;
  position: absolute;
  inset: 0% 0% auto;
}

.page-wrapper.background-page_white {
  background-color: var(--neutrals--gray--100);
  background-image: none;
  height: auto;
  min-height: 100dvh;
  padding-top: 7rem;
}

.wrapper-content-full {
  flex: 1;
  justify-content: center;
  align-self: center;
  align-items: flex-start;
  width: 100%;
  margin-bottom: -85px;
  display: flex;
}

.container-grouped {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 1024px;
  padding-left: 0;
  padding-right: 0;
  text-decoration: none;
  display: flex;
}

.container-grouped.white-background-opacity-60.add-padding-100 {
  background-color: var(--page-black);
  border-radius: 40px;
  max-width: 1200px;
  padding: 80px 160px;
}

.header-subhead {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  max-width: none;
  text-decoration: none;
  display: flex;
}

.size-tiny-0-125rem-2px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 2px;
  display: flex;
}

.size-xxsmall-0-25rem-4px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 4px;
  display: flex;
}

.size-xsmall-0-5rem-8px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 8px;
  display: flex;
}

.size-small-1rem-16px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 16px;
  display: flex;
}

.spacer-2rem {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 2rem;
  display: flex;
}

.size-large-3rem-48px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 48px;
  display: flex;
}

.size-xlarge-4rem-64px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 64px;
  display: flex;
}

.size-60px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 60px;
  display: flex;
}

.size-huge-6rem-96px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 96px;
  display: flex;
}

.size-xhuge-8rem-128px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 128px;
  display: flex;
}

.size-xxhuge-12rem-192px {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 6rem;
  display: flex;
}

.navbar_headertext {
  color: var(--brand--teal-bright--P3--700);
  background-image: linear-gradient(90deg, var(--brand--teal-bright--P3--500), var(--brand--blue--P3--500));
  letter-spacing: -.02em;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  text-align: center;
  letter-spacing: .01em;
  flex-flow: wrap;
  justify-content: center;
  width: auto;
  min-width: auto;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 32px;
  font-weight: 400;
  line-height: 1em;
  display: block;
}


.display-l-bold {
  color: var(--white);
  text-align: center;
  letter-spacing: .01em;
  flex-flow: wrap;
  justify-content: center;
  width: auto;
  min-width: auto;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 48px;
  font-weight: 700;
  line-height: 1.2em;
  display: block;
}

.display-l-bold.lime {
  color: var(--accent--lime--P3--600);
}

.headline-l-semibold {
  color: var(--white);
  letter-spacing: -0.02rem;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 3rem;
  font-weight: 600;
  line-height: 2.5rem;
}

.headline-l-semibold.centered {
  text-align: center;
}

.headline-l-semibold.centered.white {
  color: var(--white);
}

.headline-l-semibold.white {
  color: var(--white);
  letter-spacing: .01em;
  font-size: 32px;
  line-height: 1.25;
}

.headline-s-semibold {
  letter-spacing: -.02em;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 28px;
  line-height: 1.25em;
  font-weight: 600;
  color: var(--white)
}

.headline-s-semibold.white {
  color: var(--white);
}

.headline-s-semibold.centered {
  text-align: center;
}

.headline-s-semibold.centered.white {
  max-width: none;
}

.headline-s-semibold.centered.white._2line {
  font-size: 28px;
}

.headline-s-semibold.lime {
  color: var(--accent--lime--P3--600);
}

.text-xxl-regular {
  color: var(--base--black);
  text-align: left;
  letter-spacing: -.03em;
  width: 100%;
  max-width: none;
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 56px;
  font-weight: 400;
  line-height: 1.2em;
}

.text-xxl-regular.centered {
  text-align: center;
}

.text-xxl-regular.centered.teal {
  color: var(--brand--teal-bright--P3--700);
  letter-spacing: -.03em;
  text-transform: none;
  align-self: center;
  width: 100%;
  font-size: 36px;
  font-weight: 400;
  line-height: 1.1;
}

.text-xxl-regular.white {
  color: var(--white);
  font-size: 32px;
  line-height: 1.45;
}

.text-xl-regular {
  letter-spacing: -.03em;
  font-family: var(--font--font-family--barlow);
  font-size: 2rem;
  font-weight: 400;
  line-height: 1.2em;
}

.text-xl-regular.white {
  color: var(--text--color--text-white);
  text-transform: none;
}

.text-xl-regular.white.reduce-width.bold {
  text-align: center;
  margin-bottom: 0;
  font-size: 32px;
  line-height: 1.45;
  text-wrap: pretty;
}

.text-xl-regular.color-teal {
  color: var(--brand--teal-bright--600);
}

.text-xl-regular.color-black {
  color: var(--text--color--text-black);
  font-family: var(--font--font-family--barlow);
  font-weight: 500;
}

.text-l-medium {
  color: var(--text--color--text-white);
  letter-spacing: -.015em;
  text-transform: none;
  width: 100%;
  margin-bottom: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 1.25em;
  font-weight: 400;
  line-height: 1.5em;
  text-align: left;
}

.text-l-medium.large {
  color: var(--text--color--text-white);
  text-align: center;
  letter-spacing: -.01em;
  font-size: 1.5em;
  font-weight: 300;
  text-wrap: pretty;
}

.container-content-fullspan {
  z-index: 0;
  grid-column-gap: 16px;
  grid-row-gap: 32px;
  flex-flow: column;
  flex: 0 auto;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-self: center;
  align-items: center;
  width: 100%;
  min-width: auto;
  height: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
}

.section-jpeg-comparison {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: flex-start;
  align-self: auto;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 100px;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.container-headline {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  min-width: auto;
  max-width: 896px;
  padding-left: 0;
  padding-right: 0;
  display: flex;
}

.container-column-1 {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.container-column-1.left {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  overflow: hidden;
}

.container-column-1.right {
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
}

.container-column-1.centered {
  border-top: 1px none var(--white);
  border-bottom: 1px none var(--white);
  text-align: center;
  align-items: center;
  width: 100%;
  min-height: auto;
  margin-top: 0;
  margin-bottom: 0;
  padding-left: 20px;
  padding-right: 20px;
}

.container-text {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: auto;
  display: flex;
}

.container-text.vertical {
  flex-flow: column;
}

.container-text.vertical.centered {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  justify-content: flex-start;
  align-items: center;
}

.container-text.align-left {
  align-items: center;
}

.section-visually-lossless {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.continer-4col {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: space-between;
  place-items: start center;
  width: 100%;
  max-width: 800px;
  min-height: 100px;
  display: grid;
}

.wrapper-scale_box-animated {
  border-radius: 0;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  display: flex;
  aspect-ratio: auto; /* we may not need this */
  object-fit: cover; /* we may not need this */
}

.section-lossless-compression {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.section-lossless-transcoding, .section-wide-gamut-hdr, .section-progressive-decode {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.section-fast-encoding-decoding {
  background-image: radial-gradient(circle farthest-side, #18191bb3 50%, #18191b00);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.section-environmental-impact {
  background-image: url('../images/clay-banks-8SXaMMWCTGc-unsplash.webp');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 832px;
  padding: 0 4em;
  display: flex;
}

.icon-medium-64px {
  border: 1px none var(--white);
  border-radius: 1px;
  width: 64px;
  height: 64px;
}

.container-grid {
  grid-column-gap: 32px;
  grid-row-gap: 32px;
  flex-flow: row;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: flex-start;
  width: 100%;
  max-width: 1000px;
  display: grid;
}

.container-text-grid {
  border-radius: 32px;
  height: 100%;
  padding: 64px;

  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background-color: #18191b99;
  background-image: linear-gradient(30deg, #ffffff0a, #fff0 25%, #18191b00 75%, #ffffff14);
  border: 2px #000;
  border-top-color: #ffffff4d;
  box-shadow: inset 0 2px 3px #ffffff1a;
}

.continer-text-icon {
  grid-column-gap: var(--sizing--spacing--xsmall);
  grid-row-gap: var(--sizing--spacing--xsmall);
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  display: flex;
}

.continer-text-icon.vertical {
  flex-flow: column;
}

.continer-text-icon.vertical.centered {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  justify-content: flex-start;
  align-items: center;
}

.container-code {
  width: 100%;
  max-width: 960px;
  min-height: 100px;
}

.header-hero {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-direction: column;
  justify-content: flex-start;
  align-self: center;
  align-items: center;
  width: 100%;
  max-width: 896px;
  text-decoration: none;
  display: flex;
}

.container-text_only {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-direction: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: auto;
  max-width: 720px;
  padding-left: 0;
  padding-right: 0;
  text-decoration: none;
  display: flex;
}

.container-text_only.align-center {
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 100%;
}

.container-text_only.fullspan.divider-vertical {
  border-right: 5px solid var(--white);
  justify-content: center;
  align-items: flex-start;
  padding-right: 40px;
}

.section-more-features {
  background-image: linear-gradient(0deg, #17a3a04d 10%, #17a3a000 35%), linear-gradient(#00000080, #00000080);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.container-group {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.container-group.centered {
  text-align: center;
  align-items: center;
  width: 100%;
  min-height: 100px;
}

.code-embed-3 {
  width: 100%;
}

.block-quote {
  border-left-color: var(--brand--teal-dark--500);
}

.div-container-code {
  border: 0px none var(--white);
  flex-flow: column;
  align-self: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: auto;
  margin: 0;
  padding: 0;
  display: flex;
}

.footer_legal-link {
  color: #99f4f1b3;
  white-space: nowrap;
  font-family: var(--font--font-family--barlow);
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.5;
  text-decoration: none;
}

.footer_credit-text {
  color: #99f4f1b3;
  white-space: nowrap;
  font-family: var(--font--font-family--barlow);
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.5;
}

.footer_bottom-wrapper {
  grid-column-gap: 2rem;
  grid-row-gap: .5rem;
  white-space: normal;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: max-content;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  justify-content: center;
  align-items: start;
  display: flex;
}

.social-link {
  color: var(--text--color--text-black);
  align-items: center;
  width: 1.75rem;
  height: 1.75rem;
  text-decoration: none;
  display: flex;
}

.footer_social-list {
  grid-column-gap: 1rem;
  grid-row-gap: 0rem;
  white-space: normal;
  flex-flow: row;
  grid-template-rows: auto;
  grid-template-columns: max-content;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  justify-content: center;
  align-self: center;
  place-items: center start;
  width: 100%;
  display: flex;
}

.padding-section-medium {
  padding-top: 2rem;
  padding-bottom: 2.5rem;
}

.container-large {
  width: 100%;
  max-width: 80rem;
  margin-left: auto;
  margin-right: auto;
}

.padding-global {
  width: 100%;
  max-width: 1440px;
  padding-left: 4rem;
  padding-right: 4rem;
}

.padding-global.width-1200 {
  max-width: 1200px;
}

.footer_component {
  background-color: var(--brand--teal-dark--500);
  background-image: linear-gradient(180deg, #0e615f00, var(--brand--teal-bright--900));
  box-shadow: 0 -10px 5rem 0 var(--brand--blue--500);
}

.footer_component.blend-teal {
  background-color: var(--brand--teal-bright--700);
  background-image: linear-gradient(180deg, #0e615f00, var(--brand--navy--900));
  box-shadow: 0 -30px 60px 0 var(--brand--teal-bright--700);
  width: 100%;
}

.footer_component.blend-teal.centered {
  justify-content: center;
  align-items: flex-start;
  display: flex;
}

.body {
  background-color: var(--page-black);
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  font-family: var(--font--font-family--barlow);
  font-size: 1.125em;
  font-weight: 400;
  line-height: 1.45em;
}

.div-contain-carousel {
  flex-flow: column;
  align-items: center;
  width: 100%;
  max-width: 720px;
  display: flex;
}

.div-contain-slide_contents {
  width: 100%;
}

.slider-graphs {
  background-color: #ddd0;
  width: 100%;
  height: 100%;
}

.slide-3-3 {
  width: 100%;
}

.mask-3 {
  width: 100%;
  padding-bottom: 60px;
}

.icon-social {
  color: var(--text--color--text-black);
  width: 100%;
}

.icon-social:hover {
  color: var(--text--color--text-black);
  -webkit-text-stroke-color: var(--text--color--text-black);
}

.container-horizontal.add-padding.add-background-w_curves.border-blur-right {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-image: linear-gradient(#4c5b0dd9, #4c5b0dd9), url('../images/clay-banks-8SXaMMWCTGc-unsplash.webp');
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, fixed;
  border-radius: 40px;
  grid-template-rows: auto;
  grid-template-columns: 1.75fr 1fr;
  grid-auto-columns: 1fr;
  align-items: center;
  padding: 30px 20px 30px 40px;
  display: grid;
}

.container-column.horizontal {
  grid-column-gap: 48px;
  grid-row-gap: 48px;
  align-items: center;
  width: 100%;
  display: flex;
}

.logo-home-large {
  border: var(--border--xlarge) none var(--base--white);
  object-fit: cover;
  border-radius: 0;
  justify-content: center;
  align-self: center;
  align-items: flex-start;
  width: 200px;
  height: auto;
  text-decoration: none;
  display: flex;
  position: static;
  top: 25px;
  left: 720px;
}

.section-jpeg-xl-hero {
  z-index: 1;
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 100px;
  margin-top: -7rem;
  margin-bottom: 0;
  display: flex;
  position: relative;
}

.section-jpeg-xl-hero.gradient-bottom {
  background-image: linear-gradient(180deg, #18191b00 55%, var(--page-black) 95%), image-set(
    url('../images/kamran-abdullayev-black-background-unsplash.jxl')
    type("image/jxl"),
    url('../images/kamran-abdullayev-black-background-unsplash.webp')
    type("image/webp"));
  background-position: 0 0, 50% 0;
  background-size: auto, cover;
  overflow: hidden;
  padding-top: 12rem;
}

.image-wave-2560 {
  z-index: -5;
  width: 100%;
  display: none;
  position: relative;
}

.container-2col-span-text {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  place-content: start stretch;
  align-items: flex-start;
  width: 100%;
  max-width: 896px;
  min-height: auto;
  max-height: none;
  display: grid;
}

.div-block-2.right {
  aspect-ratio: 1;
  object-fit: cover;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  display: flex;
  overflow: hidden;
}

.div-block-2.left {
  aspect-ratio: 1;
  object-fit: cover;
  align-items: center;
  width: 100%;
  display: flex;
  overflow: hidden;
}

.image-6 {
  object-fit: cover;
  width: 200%;
  max-width: none;
}

.container-grid-2col-comparison {
  grid-column-gap: 2px;
  grid-row-gap: 2px;
  justify-content: space-between;
  width: auto;
  max-width: 896px;
  min-height: 100px;
  display: flex;
}

.container-column-1-grid {
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  display: flex;
}

.container-column-1-grid.left {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  overflow: hidden;
}

.container-column-1-grid.right {
  justify-content: flex-start;
  align-items: flex-end;
  width: 100%;
}

.navbar-logo-left {
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background-color: #ffffff59;
  width: 100%;
  max-width: none;
  height: 100%;
  position: absolute;
  inset: 0% 0% auto;
}

.navbar-logo-left-container {
  z-index: 5;
  background-color: #0000;
  width: 1030px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding: 15px 20px;
}

.navbar-logo-left-container.shadow-three {
  width: 100%;
  max-width: 1440px;
  margin-bottom: 0;
  padding: 1em 2em;
}

.navbar-logo-left-container.shadow-three.padding-global {
  max-width: 1440px;
  padding: 1em 4em;
}

.navbar-wrapper {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: none;
  display: flex;
}

.navbar-brand {
  height: 80px;
}

.nav-menu-two {
  justify-content: space-between;
  align-items: center;
  margin-bottom: 0;
  display: flex;
}

.nav-link {
  color: #1a1b1f;
  letter-spacing: .25px;
  margin-left: 5px;
  margin-right: 5px;
  padding: 5px 10px;
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}

.nav-link:hover {
  color: #1a1b1fbf;
}

.nav-link:focus-visible {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 4px;
  outline: 2px solid #0050bd;
}

.nav-link[data-wf-focus-visible] {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 4px;
  outline: 2px solid #0050bd;
}

.nav-dropdown {
  margin-left: 5px;
  margin-right: 5px;
}

.nav-dropdown-toggle {
  letter-spacing: .25px;
  padding: 5px 30px 5px 10px;
  font-size: 14px;
  line-height: 20px;
}

.nav-dropdown-toggle:hover {
  color: #1a1b1fbf;
}

.nav-dropdown-toggle:focus-visible {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 5px;
  outline: 2px solid #0050bd;
}

.nav-dropdown-toggle[data-wf-focus-visible] {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 5px;
  outline: 2px solid #0050bd;
}

.nav-dropdown-icon {
  color: var(--black);
  margin-right: 10px;
  font-size: 14px;
}

.nav-dropdown-list {
  background-color: #fff;
  border-radius: 12px;
}

.nav-dropdown-list.w--open {
  padding-top: 10px;
  padding-bottom: 10px;
}

.nav-dropdown-link {
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 14px;
}

.nav-dropdown-link:focus-visible {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 5px;
  outline: 2px solid #0050bd;
}

.nav-dropdown-link[data-wf-focus-visible] {
  outline-offset: 0px;
  color: #0050bd;
  border-radius: 5px;
  outline: 2px solid #0050bd;
}

.nav-divider {
  background-color: #e4ebf3;
  width: 1px;
  height: 22px;
  margin-left: 15px;
  margin-right: 15px;
}

.logo-nav-top {
  height: 100%;
}

.section-content {
  flex-flow: column;
  align-self: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 100%;
  display: flex;
}

.section-content.padding-global {
  height: auto;
  padding: 4rem;
}

.container-nav-top-items {
  width: 100%;
  max-width: none;
  margin-left: auto;
  margin-right: auto;
}

.text-block {
  color: var(--text--color--text-white);
  font-family: var(--font--font-family--barlow);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
}

.list-item {
  color: var(--text--color--text-white);
  font-size: 1.25rem;
  display: block;
}

.container-page_width {
  width: 100%;
  max-width: 1200px;
  height: auto;
  min-height: auto;
}

.navigation-top_nav {
  z-index: 999;
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  background-color: #ffffff59;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: 120px;
  display: flex;
  position: fixed;
  inset: 0% 0% auto;
}

.div-container-full_span-horizontal.centered {
  z-index: 2;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 250px;
  display: flex;
  position: absolute;
  inset: 0%;
}

.div-contain-items-full_center {
  flex-flow: column;
  justify-content: center;
  align-self: center;
  align-items: center;
  width: 100%;
  height: 250px;
  display: flex;
  position: relative;
  inset: 0%;
}

.code {
  color: var(--text--color--text-white);
  font-family: var(--font--font-family--monospace);
  text-decoration: underline;
}

.div-container-rounded_text_box {
  border: 1px solid var(--neutrals--gray--100);
  border-radius: 100px;
  justify-content: flex-end;
  align-items: center;
  width: auto;
  padding: .5em 1.5em;
}

.label-menu-text {
  color: var(--text--color--text-white);
  letter-spacing: .02em;
  white-space: nowrap;
  margin-bottom: 0;
  font-size: 1em;
  font-weight: 600;
  line-height: 1;
}

.image-8 {
  width: 100%;
  padding: 3rem;
}

.text-question-faq {
  color: var(--brand--teal-bright--700);
  letter-spacing: -.01em;
  font-family: var(--font--font-family--barlow);
  font-size: 1.5rem;
  font-weight: 600;
  line-height: 31px;
}

.container-content-vflex {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  height: auto;
  min-height: 24px;
  display: flex;
}

.container-content-vflex.centered {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  align-items: center;
}

.container-content-vflex.centered.gap-none {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
}

.container-content-vflex.width-page-max {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 1200px;
  padding-left: 0;
  padding-right: 0;
}

.container-content-vflex.width-page-max.centered {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  align-items: center;
  width: 100%;
  padding-left: 4rem;
  padding-right: 4rem;
}

.container-content-vflex.width-page-max.centered.gap-medium {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
}

.container-content-vflex.width-1440 {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 1440px;
  padding-left: 4rem;
  padding-right: 4rem;
}

.container-content-vflex.padding-sides {
  padding-left: 0;
  padding-right: 0;
}

.wrapper-content {
  border: 1px #000;
  width: 100%;
  min-height: 24px;
}

.wrapper-content.centered {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.wrapper-content.width-hug {
  flex-flow: column;
  align-items: center;
  width: auto;
  display: flex;
}

.container-content-grid-2col {
  grid-column-gap: 8rem;
  grid-row-gap: 8rem;
  grid-template-rows: auto;
  grid-template-columns: 1.75fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  min-height: 24px;
  display: grid;
}

.wrapper-content-hflex {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 1440px;
  min-height: auto;
  display: flex;
}

.wrapper-content-hflex.centered {
  justify-content: center;
  align-self: auto;
}

.wrapper-content-wave {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  min-height: 24px;
  display: flex;
}

.wrapper-content-wave.centered {
  align-items: center;
}

.wrapper-content-wave.centered.align-middle.height-cropped-width-full {
  justify-content: center;
  align-items: center;
  height: 250px;
}

.wrapper-image {
  width: 100%;
  height: auto;
  min-height: 24px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.wrapper-image.round {
  aspect-ratio: 1;
  object-fit: cover;
  border-style: none;
  border-radius: 999px;
  justify-content: center;
  align-items: stretch;
  display: flex;
  overflow: hidden;
}

.wrapper-image.round.small {
  border-style: none;
  width: 120px;
}

.wrapper-image.small {
  max-height: 120px;
}

.wrapper-image.centered {
  flex-flow: column;
  justify-content: flex-start;
  align-items: stretch;
  display: flex;
}

.image-fill {
  object-fit: cover;
}

.image-divider-vertical {
  height: 100%;
}

.wrapper-divider-vertical {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  flex-flow: column;
  align-items: flex-start;
  width: auto;
  min-height: 24px;
  display: flex;
}

.image-logo {
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.code-tab_menu-animated {
  text-align: left;
  width: auto;
}

.image-wave-1440 {
  z-index: -5;
  width: 100%;
  display: block;
  position: relative;
}

.navbar_menu-button {
  padding: 0;
  display: none;
}

.navbar_dropdown-background-layer {
  background-color: #fff0;
  background-image: linear-gradient(#1ed1cd26 10%, #3871e026 80%, #3871e000);
  border-left: 1px solid #fff9;
  min-width: 100vw;
  height: 100%;
  margin-bottom: 0;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.button-link-text {
  color: var(--text--color--text-black);
  letter-spacing: .01em;
  white-space: nowrap;
  align-items: center;
  width: 100%;
  height: 100%;
  padding-left: 1rem;
  padding-right: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.25em;
  text-decoration: none;
  display: flex;
}

.button-link-text:hover {
  color: var(--text--color--text-white);
  letter-spacing: .01em;
  -webkit-text-stroke-color: var(--brand--teal-bright--700);
  white-space: nowrap;
  font-family: var(--font--font-family--barlow);
  font-size: 1rem;
  font-weight: 500;
}

.button-link {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  text-align: center;
  background-color: #0000;
  padding: .25rem 0;
  font-family: var(--font--font-family--barlow);
  font-size: 1rem;
  line-height: 1;
  text-decoration: none;
  display: flex;
}

.button-link:hover {
  color: var(--brand--teal-bright--700);
}

.button-group {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border: 1.5px solid var(--transparent);
  object-fit: fill;
  border-radius: 999px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: auto;
  height: 2rem;
  padding: 0;
  font-family: var(--font--font-family--barlow);
  text-decoration: none;
  display: block;
}

.button-group:hover {
  border-style: solid;
  border-color: var(--accent--lime--700);
}

.navbar_item-link {
  color: var(--brand--navy--500);
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: .875rem;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: underline;
}

.rl_navbar5_spacing-block2 {
  width: 100%;
  padding-bottom: .5rem;
}

.text-style-small {
  margin-top: 0;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: .875rem;
  font-weight: 400;
  line-height: 1.5;
}

.rl_navbar5_spacing-block1 {
  width: 100%;
  padding-bottom: .25rem;
}

.navbar_item-title {
  color: var(--text--color--text-black);
  letter-spacing: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.5;
  text-decoration: none;
}

.rl_navbar5_large-item-content {
  flex-direction: column;
  justify-content: flex-start;
  display: flex;
}

.rl_navbar5_blog-image {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.rl_navbar5_blog-image-wrapper {
  width: 100%;
  padding-top: 66.66%;
  position: relative;
}

.navbar_blog-item {
  grid-column-gap: 1.5rem;
  grid-row-gap: 0px;
  grid-template-rows: auto;
  grid-template-columns: .6fr 1fr;
  grid-auto-columns: 1fr;
  padding-top: .5rem;
  padding-bottom: .5rem;
  text-decoration: none;
  display: grid;
}

.rl_navbar5_blog-list {
  grid-column-gap: 0rem;
  grid-row-gap: .5rem;
  flex-direction: column;
  grid-template-rows: auto;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  align-items: flex-start;
  display: grid;
}

.navbar_dropdown-column-text {
  color: var(--text--color--text-black);
  letter-spacing: 0;
  margin-top: 1rem;
  margin-bottom: .25rem;
  font-family: var(--font--font-family--barlow);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
}

.navbar_dropdown-content-wrapper {
  z-index: 1;
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  grid-template-rows: max-content max-content;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  align-items: start;
  width: 100%;
  display: grid;
  position: relative;
}

.navbar_dropdown-content-right {
  flex: 1;
  max-width: 35%;
  padding: 2rem 0 2rem 2rem;
  display: flex;
  position: relative;
}

.navbar_dropdown-link-list {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-flow: column;
  grid-template-rows: max-content;
  grid-template-columns: 1fr;
  grid-auto-rows: max-content;
  grid-auto-columns: 1fr;
  width: auto;
  display: flex;
}

.navbar_dropdown-content-left {
  grid-column-gap: 2rem;
  grid-row-gap: 0px;
  flex: 1;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  padding: 2rem 2rem 3rem 0;
  display: grid;
}

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

.navbar_container {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  overflow: visible;
}

.navbar_dropdown-list {
  -webkit-backdrop-filter: blur(20px);
  backdrop-filter: blur(20px);
  background-color: var(--neutrals--gray--100);
  display: block;
}

.navbar_dropdown-list.w--open {
  background-color: #18191b4d;
  background-image: linear-gradient(#fff6, #fff6);
  border-bottom: 1px solid #000;
  width: 100vw;
  min-width: 100vw;
  max-width: 100%;
  padding-bottom: 0;
  padding-left: 5%;
  padding-right: 5%;
  display: block;
  position: absolute;
  inset: 100% 0% auto;
  overflow: hidden;
}

.navbar_link-text {
  color: var(--text--color--text-white);
  letter-spacing: .015em;
  font-family: var(--font--font-family--barlow);
  font-weight: 500;
}

.navbar_link-text:hover, .navbar_link-text:focus {
  color: var(--brand--teal-bright--600);
}

.dropdown-icon {
  color: var(--brand--teal-bright--600);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  margin-top: auto;
  margin-bottom: auto;
  margin-right: 1rem;
  font-family: var(--font--font-family--barlow);
  font-weight: 600;
  display: block;
  position: absolute;
  top: 0%;
  bottom: 0%;
  right: 0%;
}

.navbar_dropdown-toggle {
  color: var(--text--color--text-black);
  padding: 1.5rem 2.5rem 1.5rem 1rem;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  text-decoration: none;
}

.navbar_menu-dropdown {
  position: static;
}

.navbar_link {
  color: var(--text--color--text-white);
  letter-spacing: .015em;
  align-self: center;
  width: 100%;
  padding: 0;
  font-family: var(--font--font-family--barlow);
  font-size: 1rem;
  font-weight: 500;
  line-height: 1.5;
  text-decoration: none;
  display: inline-block;
}

.navbar_link.w--current {
  color: #0000;
}

.navbar_link.navbar-top {
  aspect-ratio: 1;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: auto;
  display: flex;
}

.navbar_menu-left {
  display: flex;
}

.navbar_menu {
  flex: 1;
  justify-content: flex-end;
  align-items: center;
  height: 100%;
  margin-left: 1.5rem;
  display: flex;
  position: static;
}

.navbar_logo {
  vertical-align: middle;
  width: 100%;
  height: 5rem;
  margin-top: -5px;
  margin-bottom: 0;
  padding-bottom: 0;
  display: inline-block;
}

.navbar_logo-link {
  width: auto;
  height: 4rem;
  padding-left: 0;
}

.navbar_component {
  background-color: var(--base--black);
  border: 1px solid #000c;
  align-items: center;
  width: 100%;
  min-height: 7rem;
  margin-top: -7rem;
  padding-left: 0%;
  padding-right: 0%;
  display: block;
}

.button-link-icon-text_size {
  flex-direction: column;
  flex: 1;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 1rem;
  font-family: var(--font--font-family--barlow);
  font-size: .875rem;
  display: none;
}

.navbar-2-component {
  z-index: 999;
  background-color: var(--transparent);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: auto;
  margin-top: 0;
  display: flex;
  inset: 0 0% auto;
}

.navbar-2-container {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  padding-left: 3rem;
  padding-right: 2.5rem;
  display: flex;
}

.navbar_menu-items {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.navbar-divider-vertical {
  border-style: solid;
  border-width: 0 1px 0 0;
  border-color: var(--brand--teal-bright--600);
  width: .5rem;
  height: auto;
  min-height: 20px;
  margin-right: .5rem;
  padding-right: 0;
}

.text-navbar-menu_section {
  color: var(--text--color--text-black);
  letter-spacing: 0;
  white-space: nowrap;
  font-size: 1.125rem;
  font-weight: 700;
  line-height: 1.25em;
}

.navbar-wrapper-text-section {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  padding-top: 0;
  padding-bottom: .5rem;
  display: flex;
}

.navbar-wrapper-text-section.span-with_divider-bottom {
  border-bottom: 1px solid #18191b4d;
  width: 100%;
  padding-bottom: .5rem;
}

.container-vflex {
  width: auto;
}

.container-vflex.fullspan-width {
  width: 100%;
}

.container-navbar-dropdown-content {
  z-index: 997;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #0009;
  background-image: linear-gradient(#17a3a073, #17a3a000 5%), linear-gradient(#17a3a073, #17a3a000 99%), linear-gradient(#fff6, #fff6);
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: 0;
  padding-top: 0;
  padding-bottom: 0;
  position: relative;
  top: 0;
  overflow: hidden;
}

.container-navbar-content {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  flex-flow: row;
  width: 100%;
  max-width: 1200px;
  height: auto;
  min-height: 24px;
  display: flex;
}

.container-navbar-content-left {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  justify-content: space-between;
  align-items: flex-start;
  width: auto;
  display: flex;
}

.navbar-container-menu-top {
  z-index: 998;
  -webkit-backdrop-filter: blur(15px);
  backdrop-filter: blur(15px);
  background-color: #18191b73;
  flex-flow: column;
  order: 0;
  justify-content: center;
  align-self: auto;
  align-items: center;
  width: 100%;
  height: 7rem;
  margin-top: 0;
  padding-left: 0;
  padding-right: 0;
  display: flex;
  position: relative;
}

.body-6 {
  background-color: var(--page-black);
  background-position: 50% 0;
  background-size: cover;
}

.navbar-icon-main {
  width: 1.75rem;
  height: auto;
}

.container-navbar-content-right {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  justify-content: space-between;
  align-items: stretch;
  width: 100%;
  display: flex;
}

.navbar-social-links {
  grid-column-gap: 1.25rem;
  grid-row-gap: 0rem;
  white-space: normal;
  flex-flow: row;
  grid-template-rows: auto;
  grid-template-columns: max-content;
  grid-auto-columns: max-content;
  grid-auto-flow: column;
  justify-content: flex-start;
  align-self: center;
  place-items: center start;
  width: 100%;
  display: flex;
}

.container-content-hflex {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  display: flex;
}

.container-content-hflex.fullspan {
  width: 100%;
  height: 100%;
}

.container-content-hflex.grid-3col {
  grid-column-gap: .5rem;
  grid-row-gap: 0rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr .25fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.container-column-vertical.fullspan {
  justify-content: space-between;
  width: 100%;
}

.section-content-wrapper.height-100 {
  width: 100%;
  height: 100%;
}

.section-content-wrapper.height-100.centered {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.section-content-wrapper.height-100.centered.padding-top_bottom {
  justify-content: flex-start;
  height: auto;
  padding-top: 2rem;
  padding-bottom: 7rem;
}

.section-content-wrapper.height-100.centered.padding-top_bottom.background-white {
  background-color: var(--white);
}

.wrapper-text {
  border: 1px #000;
  width: 100%;
  min-height: 16px;
}

.wrapper-text.width-small {
  max-width: 800px;
}

.wrapper-text.color-gradient {
  width: auto;
}

.wrapper-text.color-gradient._40em {
  width: 40em;
}

.wrapper-text.width-hug {
  width: auto;
}

.wrapper-text.centered {
  text-align: center;
  flex-flow: column;
  align-items: center;
  display: flex;
}

.wrapper-text.centered.width-rem {
  max-width: 56rem;
}

.wrapper-text.gap-2rem {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  align-items: center;
  display: flex;
}

.wrapper-text.has-underline {
  border-bottom: 1px solid #ffffff4d;
}

.wrapper-text.gap-1rem {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  display: flex;
}

.wrapper-text.width-30em {
  width: 16em;
}

.code-faqs {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
}

.container-wave-animated {
  z-index: 0;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  flex: 0 auto;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: flex-start;
  align-self: center;
  align-items: center;
  width: 100%;
  min-width: auto;
  height: 12rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.definition {
  color: var(--text--color--text-white);
  letter-spacing: -.01em;
  font-size: 1.125rem;
  font-weight: 300;
}

.group-container {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
  border: 1px none var(--white);
  background-color: var(--page-black);
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  background-image: linear-gradient(45deg, #00000026, #fff9 30% 70%, #00000026), image-set(
	url('../images/Background-hologram.jxl') 
	type("image/jxl"), 
	url('../images/Background-hologram.webp') 
	type("image/webp"));
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, fixed;
  border-radius: 1rem;
  flex-direction: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 60rem;
  margin-top: 0;
  padding: 3rem 2rem 2rem;
  text-decoration: none;
  display: flex;
  box-shadow: 0 0 10px #19132626;
}

.wrapper-logo-text {
  grid-row-gap: 8px;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
  width: auto;
  text-decoration: none;
  display: flex;
}

.image-logo-software {
  object-fit: cover;
  justify-content: center;
  align-items: center;
  width: auto;
  max-width: none;
  height: 100%;
  text-decoration: none;
  display: flex;
}

.text-regular-semibold {
  letter-spacing: -.015em;
  font-weight: 600;
}

.text-regular-semibold.wrap-none {
  white-space: nowrap;
}

.text-regular-semibold.wrap-none.centered {
  text-align: center;
}

.text-regular-semibold.wrap-none.centered.color-black, .text-regular-semibold.color-black {
  color: var(--text--color--text-black);
}

.wrapper-logo-software {
  width: auto;
  max-width: none;
  height: 5rem;
  max-height: none;
}

.wrapper-logo-software.horizontal {
  height: 3.5rem;
}

.wrapper-logo-software.large {
  height: 7rem;
}

.wrapper-logo-software.medium {
  height: 4rem;
}

.code-scale_box-animated {
  width: auto;
  height: auto;
}

.section-creative_workflow, .section-JPEG-Committee {
  display: flex;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: auto;
  padding: 100px 20px;
}

.section-creative_workflow.padding-global-sides, .section-JPEG-Committee.padding-global-sides {
  padding-left: 0;
  padding-right: 0;
}

.code-embed-5 {
  width: 100%;
}

.code-distance_vs_effort {
  text-align: left;
  width: 100%;
}

.footer-cookies-links-container {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  display: none;
}

.code_embed-photo_credits {
  flex-flow: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  display: block;
}

.section-avif-comparison {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  flex-flow: column;
  justify-content: flex-start;
  align-self: auto;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 100px;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
}

.rich-text-block {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  display: block;
}

.container-4col {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  display: grid;
}

.container-4col.gap-4rem {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
}

.text-small-regular {
  color: var(--text--color--text-white);
  text-align: left;
  letter-spacing: -.01em;
  font-size: 1.125rem;
  font-weight: 400;
  line-height: 1.45em;
}

.text-small-regular.centered {
  text-align: center;
  text-wrap: pretty;
}

.text-small-regular.color-black {
  color: var(--text--color--text-black);
  text-align: left;
}

.text-small-regular.color-black.centered {
  text-align: center;
}

.spacer-1rem {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 1rem;
  display: flex;
}

.container-3col {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  display: grid;
}

.image-example-animated, .image-example-transparency, .image-example-wide_gamut {
  width: auto;
  height: auto;
}

.image-example-comparison {
  width: 100%;
}

.section-test_page-size_comparison.height-100 {
  width: 100%;
  height: 100%;
}

.section-test_page-size_comparison.height-100.centered {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.section-test_page-size_comparison.height-100.centered.padding-top_bottom {
  justify-content: flex-start;
  height: auto;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.section-test_page-alpha_transparency.height-100 {
  width: 100%;
  height: 100%;
}

.section-test_page-alpha_transparency.height-100.centered {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.section-test_page-alpha_transparency.height-100.centered.padding-top_bottom {
  justify-content: flex-start;
  height: auto;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.section-test_page-wide_gamut.height-100 {
  width: 100%;
  height: 100%;
}

.section-test_page-wide_gamut.height-100.centered {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.section-test_page-wide_gamut.height-100.centered.padding-top_bottom {
  justify-content: flex-start;
  height: auto;
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.section-test_page-animations.height-100 {
  width: 100%;
  height: 100%;
}

.section-test_page-animations.height-100.centered {
  flex-flow: column;
  align-items: center;
  display: flex;
}

.section-test_page-animations.height-100.centered.padding-top_bottom {
  justify-content: flex-start;
  height: auto;
  padding-top: 4rem;
  padding-bottom: 8rem;
}

.spacer-4rem {
  background-color: var(--transparent);
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 2rem;
  display: flex;
}

.rtb-4col {
  grid-column-gap: 1rem;
  grid-row-gap: 0rem;
  text-align: left;
  flex-flow: column;
  place-content: stretch flex-start;
  align-items: flex-start;
  display: block;
}

.has-underline {
  border-bottom: 1px solid var(--brand--teal-bright--600);
}

.wrapper-footer-content {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 1200px;
  min-height: 100px;
  display: flex;
}

.container-2col {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  display: grid;
}

.container-2col.gap-4rem {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

.section-hero.hero-fullspan-graphic {
 background-image: image-set(
    url('../images/kamran-abdullayev-black-background-unsplash.jxl')
    type("image/jxl"),
    url('../images/kamran-abdullayev-black-background-unsplash.webp')
    type("image/webp"));
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 650px;
  margin-top: -7rem;
  padding-top: 14rem;
  padding-bottom: 7rem;
  display: flex;
}

.section-hero.hero-fullspan-graphic.gradient-bottom {
  background-image: linear-gradient(0deg, var(--page-black) 5%, #18191b00 45%), image-set(
    url('../images/kamran-abdullayev-black-background-unsplash.jxl')
    type("image/jxl"),
    url('../images/kamran-abdullayev-black-background-unsplash.webp')
    type("image/webp"));
  background-position: 0 0, 50% 0;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  height: auto;
  padding-bottom: 0;
}

.section-hero.hero-fullspan-graphic.gradient-bottom.news {
  background-image: linear-gradient(0deg, var(--page-black) 5%, #18191b00 45%), image-set(
    url('../images/kamran-abdullayev-black-background-unsplash.jxl')
    type("image/jxl"),
    url('../images/kamran-abdullayev-black-background-unsplash.webp')
    type("image/webp"));
}

.wrapper-image-example-transparency {
  background-image: url('../images/CheckerBackground.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  border: 1px #000;
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 24px;
  padding: 2rem;
  display: flex;
  box-shadow: inset 4px -4px 8px #00000080;
}

.text-all-caps-micro-medium {
  color: var(--brand--teal-bright--P3--600);
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow-wrap: normal;
  margin: 0;
  font-family: var(--font--font-family--barlow);
  font-size: .8rem;
  font-weight: 500;
  line-height: 1.25em;
  text-wrap: nowrap;
}

.wrapper-text-horizontal {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: auto;
  height: auto;
  display: flex;
}

.container-card-text {
  grid-column-gap: .75rem;
  grid-row-gap: .75rem;
  border: 1px none var(--white);
  background-color: var(--transparent);
  background-image: none;
  border-radius: 0;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  height: auto;
  min-height: 24px;
  padding: 1rem 1rem 1.5rem;
  display: flex;
}

.text-photo_credit-image_title {
  color: var(--text--color--text-white);
  margin-bottom: 0;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.1em;
}

.wrapper-image-photo_credit {
  box-sizing: border-box;
  aspect-ratio: 3 / 2;
  background-color: var(--white);
  object-fit: cover;
  border: 0 #000;
  border-radius: 0;
  flex-flow: column;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 24px;
  max-height: none;
  display: flex;
  overflow: hidden;
}

.card-photo_credit {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  background-color: var(--page-black);
  background-image: linear-gradient(#ffffff26, #ffffff0d 85%);
  border: 1px #ffffff73;
  border-radius: 1rem;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  min-width: auto;
  max-width: none;
  height: auto;
  min-height: 24px;
  display: flex;
  overflow: hidden;
  box-shadow: 0 16px 32px #00000073;
}

.text-photo_credit-link {
  color: var(--brand--blue--500);
  letter-spacing: 0;
  margin-bottom: 0;
  font-weight: 400;
  line-height: 1.1em;
}

.text-photo_credit-link:hover {
  color: var(--brand--teal-bright--600);
}

.wrapper-text-hug {
  border: 1px #000;
  width: auto;
}

.image-photo_credit {
  aspect-ratio: 3 / 2;
  object-fit: cover;
  width: 100%;
  max-width: none;
  height: 100%;
  overflow: hidden;
}

.container-photo_credits-cards {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  flex-flow: wrap;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  width: 100%;
  display: grid;
}

.container-logos {
  grid-column-gap: 3rem;
  grid-row-gap: 2rem;
  flex-flow: wrap;
  flex: 0 auto;
  justify-content: center;
  align-items: flex-end;
  padding: 0 4rem;
  text-decoration: none;
  display: flex;
}

.wrapper-logo-software-link {
  width: auto;
  max-width: none;
  height: 5rem;
  max-height: none;
}

.wrapper-logo-software-link.horizontal {
  height: 3.5rem;
}

.container-text-shaded {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  background-image: none;
  border: 1px #000;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  min-height: 16px;
  padding: 2rem 4rem 3rem;
  display: flex;
}

.container-text-shaded.centered {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border-style: solid;
  border-color: var(--page-black);
  text-align: center;
  background-image: none;
  border-radius: 1rem;
  align-items: center;
  margin-top: 0;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.text-all-caps-micro-medium-white {
  color: var(--text--color--text-white);
  letter-spacing: .1em;
  text-transform: uppercase;
  white-space: nowrap;
  overflow-wrap: normal;
  margin-bottom: 0;
  font-family: var(--font--font-family--barlow);
  font-size: .75rem;
  font-weight: 500;
  line-height: 1.25em;
}

.text-all-caps-micro-medium-white {
  font-size: 12px;
  color: #fff;
}


.utility-page-wrap {
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: 100%;
  height: 100vh;
  max-height: 100%;
  display: flex;
}

.utility-page-content {
  text-align: center;
  flex-direction: column;
  width: 260px;
  display: flex;
}

.utility-page-form {
  flex-direction: column;
  align-items: stretch;
  display: flex;
}

.link-text-body-underline {
  color: var(--text--color--text-black);
  font-weight: 600;
  text-decoration: underline;
}

.link-text-body-underline:hover {
  color: var(--brand--teal-bright--700);
}

.text-medium-semibold {
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.25em;
}

.text-medium-semibold.color-black {
  color: var(--text--color--text-black);
}

.text-medium-semibold.color-black.align-right {
  text-align: right;
}

.text-medium-semibold.color-black.align-left {
  text-align: left;
}

.text-medium-semibold.wrap-none {
  white-space: nowrap;
}

.text-medium-semibold.color-white {
  color: var(--text--color--text-white);
}

.text-medium-semibold.color-white.align-right {
  text-align: right;
}

.text-medium-semibold.color-white.align-left {
  text-align: left;
}

.container-grid-4col-contributors {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  grid-template: "Area Area Area Area"
                 ". . . ."
                 / 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: auto;
  display: grid;
}

.container-photo {
  aspect-ratio: 1;
  border: 3px solid var(--white);
  object-fit: cover;
  border-radius: 0;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  display: flex;
  overflow: hidden;
}

.container-photo.margin-negative {
  height: 100px;
  margin-left: -20px;
  display: block;
}

.container-photo.round {
  border-radius: 999px;
}

.photo-round {
  aspect-ratio: 1;
  object-fit: cover;
}

.wrapper-number-solid {
  border: 1px #000;
  border-radius: 999px;
  width: auto;
  min-height: 16px;
  padding: .375rem 1.125rem;
}

.wrapper-number-solid.centered {
  text-align: center;
}

.wrapper-number-solid.centered.color-lime {
  justify-content: center;
  align-items: center;
  min-height: 2.125rem;
  display: flex;
}

.wrapper-number-solid.color-lime {
  background-image: linear-gradient(to bottom, var(--accent--lime--700), var(--accent--lime--700));
  height: auto;
}

.container-images-timeline {
  grid-column-gap: 4rem;
  grid-row-gap: 4rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 320px;
  height: auto;
  display: flex;
}

.container-images-timeline.horizontal {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-flow: row;
  justify-content: center;
  align-items: center;
}

.container-images-timeline.horizontal.align-left {
  justify-content: flex-start;
  align-items: center;
  width: 100%;
}

.container-images-timeline.horizontal.align-right {
  justify-content: flex-end;
  align-items: center;
}

.wrapper-number-timeline {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 150px;
  height: 100%;
  display: flex;
}

.container-content-timeline {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  height: auto;
  min-height: 24px;
  padding: 2rem;
  display: flex;
}

.container-content-timeline.right {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border-left: 0 #000;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.container-content-timeline.left {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  border-left: 0 #000;
  border-right: 0 #000;
  justify-content: center;
  align-items: flex-end;
  width: 100%;
  padding-left: 0;
  padding-right: 0;
}

.container-content-timeline.border-1px {
  border: 1px solid #000;
  border-radius: 1rem;
}

.container-content-timeline.background-image {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  background-image: linear-gradient(#000000b3, #000000b3), image-set(
	url('../images/Background-hologram.jxl')
	type('image/jxl'),
	url('../images/Background-hologram.webp')
	type('image/webp'));
  background-position: 0 0, 50%;
  background-repeat: repeat, no-repeat;
  background-size: auto, cover;
  background-attachment: scroll, fixed;
  border-radius: 1rem;
}

.footer-logo-link {
  width: auto;
  height: 4rem;
  padding-left: 0;
}

.footer-logo {
  vertical-align: middle;
  width: 100%;
  height: 5rem;
  margin-top: -5px;
  margin-bottom: 0;
  padding-bottom: 0;
  display: inline-block;
}

.line-vertical-dotted {
  border-style: none none none solid;
  border-width: 0 0 0 1px;
  border-color: var(--white) var(--white) var(--white) #ffffff4d;
  height: 100%;
  min-height: 4rem;
}

.text-medium-normal {
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 1.25em;
}

.text-medium-normal.color-black {
  color: var(--text--color--text-black);
}

.text-medium-normal.color-black.align-right {
  text-align: right;
}

.text-medium-normal.color-black.align-left {
  text-align: left;
}

.text-medium-normal.wrap-none {
  white-space: nowrap;
}

.text-medium-normal.color-white {
  color: var(--text--color--text-white);
}

.text-medium-normal.color-white.align-right {
  text-align: right;
}

.text-medium-normal.color-white.align-left {
  text-align: left;
}

.container-section-padding {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  flex-flow: column;
  align-items: flex-start;
  width: 100%;
  height: auto;
  min-height: 24px;
  display: flex;
}

.container-section-padding.gap-1rem {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
}

.container-section-padding.gap-1rem.centered {
  align-items: center;
}

.container-section-padding.centered {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  align-items: center;
}

.container-section-padding.width-page-max {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 1200px;
  padding-left: 0;
  padding-right: 0;
}

.container-section-padding.width-page-max.centered {
  grid-column-gap: 0rem;
  grid-row-gap: 0rem;
  align-items: center;
  width: 100%;
  padding-left: 4rem;
  padding-right: 4rem;
}

.container-section-padding.width-page-max.centered.gap-medium {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
}

.container-section-padding.width-page-max.centered.gap-3rem {
  grid-column-gap: 3rem;
  grid-row-gap: 3rem;
}

.container-section-padding.width-1440 {
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  max-width: 1440px;
  padding-left: 4rem;
  padding-right: 4rem;
}

.container-section-padding.padding-sides {
  padding-left: 0;
  padding-right: 0;
}

@media screen and (min-width: 1440px) {
  li {
    font-size: 1.25rem;
  }

  img {
    order: 0;
  }

  .navbar-section {
    background-color: var(--page-black);
    box-shadow: 0 10px 40px 0 var(--brand--teal-bright--700);
    background-image: none;
    border-style: none;
    border-width: 0;
    height: 212px;
    padding-top: 40px;
    position: absolute;
    inset: 0% 0% auto;
  }

  .display-xl-bold {
    letter-spacing: -.02em;
    margin-bottom: 0;
    padding-bottom: 12px;
  }

  .display-xl-bold.fill-gradient {
    letter-spacing: -.02em;
    align-self: center;
    font-size: 5rem;
    font-weight: 700;
  }

  .page-wrapper {
    color: var(--text--color--text-white);
    justify-content: flex-start;
    height: auto;
    min-height: 100dvh;
    padding-top: 7rem;
    inset: 0% 0% auto;
  }

  .page-wrapper.background-black {
    background-color: var(--page-black);
    background-image: none;
    height: auto;
    padding-top: 7rem;
    padding-bottom: 0;
  }

  .page-wrapper.background-page_white {
    background-color: var(--neutrals--gray--100);
    background-image: none;
    height: auto;
    padding-top: 0;
    padding-bottom: 0;
  }

  .wrapper-content-full {
    background-image: none;
  }

  .container-grouped {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: 1200px;
  }

  .container-grouped.white-background-opacity-60 {
    background-color: var(--page-black);
  }

  .container-grouped.white-background-opacity-60.add-padding-100 {
    z-index: 500;
    background-color: var(--page-black);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: 40px;
    max-width: 1200px;
    margin-left: 0;
    margin-right: 0;
    padding: 80px 160px;
    position: relative;
  }

  .size-small-1rem-16px {
    height: 24px;
  }

  .display-l-bold {
    letter-spacing: -.01em;
    margin-bottom: 0;
    font-size: 60px;
  }
  .headline-l-semibold.white {
    color: var(--white);
    letter-spacing: .01em;
    font-size: 32px;
    line-height: 1.25;
  }

  .headline-s-semibold.centered.white._2line {
    max-width: 10em;
    font-size: 28px;
  }

  .text-xxl-regular {
    color: var(--text--color--text-white);
    font-size: 40px;
    font-weight: 500;
    line-height: 1.1em;
  }

  .text-xxl-regular.centered.teal {
    letter-spacing: -.03em;
    text-transform: none;
    column-count: auto;
    font-size: 44px;
    font-weight: 300;
    line-height: 1.1em;
  }

  .text-xxl-regular.white {
    color: var(--text--color--text-white);
    letter-spacing: -.014em;
    text-shadow: none;
    font-size: 32px;
    font-weight: 400;
    line-height: 1.45em;
  }

  .text-xl-regular.white {
    margin-bottom: 0;
    line-height: 1.45em;
  }

  .text-xl-regular.white.reduce-width {
    max-width: 16em;
    font-size: 32px;
  }

  .text-xl-regular.white.reduce-width.bold {
    text-align: center;
    max-width: none;
  }

  .container-content-fullspan {
    grid-column-gap: 80px;
    grid-row-gap: 80px;
    justify-content: flex-start;
    align-self: center;
    align-items: center;
    width: 100%;
    min-width: 100%;
    height: auto;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    position: static;
  }

  .section-jpeg-comparison {
    color: var(--page-black);
    padding-top: 0;
    padding-bottom: 0;
  }

  .container-headline {
    padding-left: 0;
    padding-right: 0;
  }

  .container-column-1 {
    justify-content: flex-start;
    align-items: flex-start;
  }

  .container-column-1.left {
    align-items: flex-start;
    width: auto;
    height: auto;
  }

  .container-column-1.right {
    flex: 0 auto;
    align-items: flex-end;
    width: auto;
    height: auto;
  }

  .container-column-1.centered {
    aspect-ratio: auto;
    border-top: 0px none var(--white);
    border-bottom: 0px none var(--white);
    border-left: 8px none var(--page-black);
    justify-content: flex-start;
    align-items: center;
    width: auto;
    height: auto;
    min-height: auto;
    margin: 0;
    padding: 0 20px;
    display: flex;
  }

  .container-text {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: flex-start;
    align-items: flex-start;
    width: 100%;
  }

  .container-text.align-left {
    justify-content: flex-start;
    align-items: center;
    width: auto;
  }

  .container-text.align-left.divider-above {
    border-top: 1px none var(--white);
    width: 100%;
    margin-top: 0;
  }

  .section-visually-lossless {
    padding-top: 0;
    padding-bottom: 0;
  }

  .continer-4col {
    place-items: start center;
  }

  .section-lossless-compression, .section-lossless-transcoding {
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-wide-gamut-hdr {
    flex-flow: column;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-progressive-decode {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-fast-encoding-decoding {
    background-color: var(--transparent);
    background-image: linear-gradient(180deg, #18191b00, var(--page-black) 49%);
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-environmental-impact {
    background-image: radial-gradient(circle farthest-corner at 50% 50%, #18191b00, var(--page-black) 74%), url('../images/clay-banks-8SXaMMWCTGc-unsplash.jxl'), url('../images/clay-banks-8SXaMMWCTGc-unsplash.webp');
    background-position: 0 0, 100% 100%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, fixed;
    flex-flow: column;
    justify-content: center;
    align-items: center;
    height: auto;
    padding-top: 0;
    padding-bottom: 0;
  }

  .container-text-grid {
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    background-color: #18191b99;
    background-image: linear-gradient(30deg, #ffffff0a, #fff0 25%, #18191b00 75%, #ffffff14);
    border: 2px #000;
    border-top-color: #ffffff4d;
    box-shadow: inset 0 2px 3px #ffffff1a;
  }

  .header-hero {
    width: auto;
    padding-bottom: 0;
  }

  .container-text_only {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 740px;
    padding-left: 0;
    padding-right: 0;
  }

  .container-text_only.align-center {
    justify-content: flex-start;
    align-items: center;
    max-width: none;
  }

  .container-text_only.fullspan {
    justify-content: center;
    align-items: flex-start;
    width: auto;
    height: auto;
  }

  .container-text_only.fullspan.divider-vertical {
    border-right: 5px solid var(--white);
    height: auto;
    padding-right: 40px;
  }

  .section-more-features {
    background-image: linear-gradient(0deg, #17a3a04d 10%, #17a3a000 35%), linear-gradient(180deg, var(--page-black) 10%, #18191b00 50%);
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    margin-top: 0;
    padding-top: 0;
    padding-bottom: 0;
  }

  .div-container-code {
    background-image: none;
    border-style: none;
    border-width: 0;
    justify-content: flex-start;
    align-items: center;
    min-height: auto;
    padding: 0;
    display: flex;
  }

  .footer_legal-link {
    color: #99f4f1b3;
    letter-spacing: .01em;
    white-space: nowrap;
    font-family: var(--font--font-family--barlow);
    line-height: 1.1;
  }

  .footer_credit-text {
    color: #99f4f1b3;
    letter-spacing: .01em;
    white-space: nowrap;
    word-break: keep-all;
    font-family: var(--font--font-family--barlow);
    line-height: 1.1;
  }

  .footer_bottom-wrapper {
    grid-column-gap: 3rem;
    grid-row-gap: 1.5rem;
    flex-flow: column;
    grid-template-rows: auto auto;
    grid-template-columns: max-content;
    grid-auto-columns: max-content;
    grid-auto-flow: column;
    place-content: start center;
    place-items: center;
    height: 100%;
    display: grid;
  }

  .social-link {
    width: 1.75rem;
    height: 1.75rem;
  }

  .footer_social-list {
    grid-column-gap: 1rem;
    justify-content: center;
    align-items: center;
    width: 100%;
    display: flex;
  }

  .padding-section-medium {
    padding-top: 2rem;
    padding-bottom: 2.5rem;
  }

  .container-large {
    max-width: 1440px;
    padding-left: 0;
    padding-right: 0;
  }

  .padding-global {
    width: 100%;
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .footer_component {
    background-color: var(--page-black);
    background-image: linear-gradient(180deg, #18191b00, black), linear-gradient(to bottom, #15b7b3, #15b7b3), linear-gradient(to bottom, var(--white), var(--white));
    box-shadow: none;
    justify-content: center;
    align-self: center;
    width: 100%;
    max-width: none;
    display: flex;
  }

  .footer_component.blend-teal {
    justify-content: center;
    align-items: flex-start;
    display: flex;
    position: relative;
    inset: auto 0% 0%;
    box-shadow: 0 -30px 90px #21e6e1b3;
  }

  .body {
    background-color: var(--page-black);
    flex-flow: column;
    justify-content: center;
    display: block;
  }

  .div-contain-carousel {
    align-self: center;
    width: 100%;
    max-width: 896px;
    min-height: 100px;
  }

  .div-contain-slide_contents {
    object-fit: contain;
    flex-flow: column;
    justify-content: center;
    width: 100%;
    height: auto;
    margin-bottom: 30px;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 0;
    padding-right: 0;
    display: flex;
  }

  .slider-graphs {
    background-color: #ddd0;
    justify-content: center;
    height: auto;
    display: flex;
  }

  .image-slide-graph {
    aspect-ratio: auto;
    vertical-align: middle;
    object-fit: contain;
    width: auto;
    height: 100%;
  }

  .slide-1-3 {
    aspect-ratio: auto;
    object-fit: contain;
  }

  .slide-3-3 {
    object-fit: contain;
  }

  .slide-nav-2 {
    margin-top: 40px;
  }

  .mask-3 {
    flex: 0 auto;
    padding-bottom: 30px;
    position: relative;
    overflow: hidden;
  }

  .icon-social {
    width: 100%;
    height: auto;
  }

  .container-horizontal {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    grid-template-rows: auto;
    grid-template-columns: 2fr 1fr;
    grid-auto-columns: 1fr;
    align-items: center;
    display: grid;
  }

  .container-horizontal.add-padding {
    padding: 40px 20px 40px 40px;
  }

  .container-horizontal.add-padding.add-background-w_curves {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    background-image: linear-gradient(#4c5b0dd9, #4c5b0dd9), url('../images/clay-banks-8SXaMMWCTGc-unsplash.jxl'), url('../images/clay-banks-8SXaMMWCTGc-unsplash.webp');
    background-position: 0 0, 50%;
    background-repeat: repeat, no-repeat;
    background-size: auto, cover;
    background-attachment: scroll, fixed;
    border-radius: 40px;
    grid-template-columns: 1.75fr 1fr;
    width: 100%;
    padding-top: 30px;
    padding-bottom: 30px;
    padding-left: 60px;
  }

  .container-horizontal.add-padding.add-background-w_curves.border-blur-right {
    background-image: linear-gradient(#18191b4d, #18191b4d), linear-gradient(#4c5b0dd9, #4c5b0dd9), url('../images/clay-banks-8SXaMMWCTGc-unsplash.jxl'), url('../images/clay-banks-8SXaMMWCTGc-unsplash.webp');
    background-position: 0 0, 0 0, 50%;
    background-repeat: repeat, repeat, no-repeat;
    background-size: auto, auto, cover;
    background-attachment: scroll, scroll, fixed;
    border-top: 2px solid #ffffff4d;
    border-right: 2px solid #ffffff4d;
    grid-template-columns: 1.75fr 1fr;
  }

  .container-column {
    grid-column-gap: 30px;
    grid-row-gap: 30px;
    grid-template-rows: auto;
    grid-template-columns: 2fr 1fr;
    grid-auto-columns: 1fr;
    align-items: center;
    display: block;
  }

  .container-column.horizontal {
    grid-column-gap: 48px;
    grid-row-gap: 48px;
    width: 100%;
    display: flex;
  }

  .logo-home-large {
    border-radius: var(--radius--xxlarge);
    width: 250px;
    height: auto;
    position: relative;
    inset: 0%;
  }

  .section-jpeg-xl-hero {
    z-index: 500;
    background-image: linear-gradient(180deg, #18191b00 55%, var(--page-black) 95%), image-set(
    url('../images/kamran-abdullayev-black-background-unsplash.jxl')
    type("image/jxl"),
    url('../images/kamran-abdullayev-black-background-unsplash.webp')
    type("image/webp"));
    background-position: 0 0, 50% 0;
    background-size: auto, cover;
    margin-top: -7rem;
    padding-top: 14rem;
    padding-bottom: 0;
    position: relative;
  }

  .section-jpeg-xl-hero.gradient-bottom {
    background-size: 100%;
    padding-top: 12rem;
  }

  .image-wave-2560 {
    width: 100%;
    height: auto;
    display: inline-flex;
  }

  .container-2col-span-text {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    flex: 0 auto;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    place-content: start stretch;
    place-items: start stretch;
    width: 100%;
    min-height: auto;
    display: grid;
  }

  .div-block-2 {
    aspect-ratio: 1;
    object-fit: cover;
    justify-content: flex-end;
    align-self: auto;
    width: auto;
    height: 100%;
    display: flex;
    overflow: hidden;
  }

  .div-block-2.right {
    justify-content: flex-end;
    align-items: center;
    width: 100%;
    height: auto;
  }

  .div-block-2.left {
    flex-flow: column;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: auto;
  }

  .image-6 {
    aspect-ratio: auto;
    object-fit: cover;
    width: 200%;
    max-width: 896px;
  }

  .container-grid-2col-comparison {
    grid-column-gap: 2px;
    grid-row-gap: 2px;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    place-content: start;
    justify-items: stretch;
    width: auto;
    height: 448px;
    min-height: auto;
    max-height: 448px;
    display: grid;
  }

  .container-column-1-grid.left {
    align-items: flex-start;
    width: 100%;
    height: auto;
  }

  .container-column-1-grid.right {
    flex: 0 auto;
    align-items: flex-end;
    width: 100%;
    height: auto;
  }

  .navbar-logo-left {
    background-color: #ffffff59;
  }

  .navbar-logo-left-container.shadow-three {
    max-width: 1440px;
    padding-top: 1em;
    padding-bottom: 1em;
  }

  .navbar-logo-left-container.shadow-three.padding-global {
    max-width: 1440px;
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .navbar-wrapper {
    max-width: none;
  }

  .navbar-brand {
    height: 80px;
  }

  .nav-menu-wrapper {
    align-items: center;
    display: flex;
  }

  .nav-menu-two {
    align-self: center;
  }

  .nav-link {
    color: var(--page-black);
    font-size: 18px;
    line-height: 1;
  }

  .nav-link:hover {
    color: var(--brand--teal-bright--700);
    text-shadow: 0 0 16px #21e6e1b3;
  }

  .nav-dropdown {
    font-size: 16px;
    line-height: 1em;
  }

  .nav-dropdown-toggle {
    align-items: center;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 16px;
    line-height: 1em;
    display: flex;
  }

  .nav-dropdown-icon {
    color: var(--black);
    align-self: center;
    line-height: 1;
  }

  .logo-nav-top {
    height: 100%;
  }

  .section-content {
    height: auto;
    min-height: auto;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-content.padding-global {
    height: auto;
    margin-bottom: 0;
    padding-top: 0;
  }

  .container-nav-top-items {
    max-width: none;
  }

  .text-block {
    color: var(--page-black);
    font-family: var(--font--font-family--barlow);
    font-size: 18px;
    font-weight: 600;
    line-height: 1;
  }

  .text-block:hover {
    color: var(--brand--teal-bright--700);
    text-shadow: 0 0 16px #21e6e1b3;
  }

  .list-item {
    color: var(--text--color--text-white);
    font-size: 1.25rem;
    display: block;
  }

  .container-page_width {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    flex-flow: column;
    justify-content: flex-start;
    max-width: 1440px;
    height: 100%;
    display: flex;
  }

  .link-text-medium {
    font-size: 22px;
  }

  .link-text-medium.white {
    color: var(--white);
    font-size: 22px;
    font-weight: 400;
  }

  .body-4 {
    background-color: var(--neutrals--gray--100);
  }

  .navigation-top_nav {
    z-index: 999;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    background-color: #ffffff59;
    justify-content: center;
    align-items: flex-start;
    width: 100%;
    height: 120px;
    display: flex;
    position: fixed;
    inset: 0% 0% auto;
  }

  .div-container-full_span-horizontal {
    justify-content: flex-start;
    width: 100%;
    display: flex;
  }

  .div-container-full_span-horizontal.centered {
    z-index: -1;
    justify-content: center;
    align-items: center;
    position: absolute;
    inset: 0%;
  }

  .div-contain-items-full_center {
    flex-flow: column;
    justify-content: center;
    align-self: center;
    align-items: center;
    width: 100%;
    height: 250px;
    display: flex;
    position: relative;
    inset: 0%;
  }

  .code {
    font-size: 18px;
    line-height: 1.45;
  }

  .div-container-rounded_text_box {
    background-color: #fff0;
    background-image: none;
    border: 1px solid var(--neutrals--gray--100);
    border-radius: 100px;
    justify-content: flex-end;
    align-items: center;
    padding: .5em 1.5em;
    display: block;
  }

  .label-menu-text {
    color: var(--neutrals--gray--100);
    letter-spacing: .01em;
    font-size: 1em;
    font-weight: 700;
  }

  .text-question-faq {
    color: var(--brand--teal-bright--700);
    font-size: 1.5rem;
    line-height: 1.45;
  }

  .container-content-vflex {
    width: 100%;
  }

  .container-content-vflex.centered {
    align-items: center;
  }

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

  .container-content-vflex.width-1440 {
    max-width: 1440px;
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .wrapper-content-wave.centered.align-middle {
    justify-content: center;
    align-items: center;
  }

  .wrapper-content-wave.centered.align-middle.height-cropped-width-full {
    height: 320px;
  }

  .code-tab_menu-animated {
    width: 100%;
  }

  .image-9 {
    display: none;
  }

  .image-wave-1440 {
    width: 100%;
    height: auto;
    display: none;
  }

  .navbar_dropdown-background-layer {
    background-color: #fff0;
    background-image: linear-gradient(#1ed1cd26, #3871e000);
  }

  .button-link-text {
    font-weight: 400;
  }

  .button-link-text:hover {
    color: var(--base--white);
    font-weight: 500;
  }

  .navbar_dropdown-list {
    display: none;
  }

  .navbar_dropdown-list.w--open {
    background-color: #ffffff59;
    background-image: linear-gradient(#18191b73, #18191b73);
  }

  .navbar_menu {
    text-align: left;
    justify-content: flex-end;
    align-items: center;
  }

  .navbar-2-container {
    padding-left: 4rem;
    padding-right: 3.5rem;
  }

  .container-navbar-content {
    width: 100%;
  }

  .navbar-container-menu-top {
    padding-left: 0;
    padding-right: 0;
  }

  .navbar-social-links {
    grid-column-gap: 1.25rem;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    display: flex;
  }

  .section-content-wrapper.height-100 {
    justify-content: center;
    align-items: flex-start;
    display: flex;
  }

  .section-content-wrapper.height-100.centered {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .section-content-wrapper.height-100.centered.padding-top_bottom {
    padding-top: 2rem;
  }

  .section-content-wrapper.height-100.centered.padding-top_bottom.background-white {
    background-color: var(--base--white);
    justify-content: flex-start;
  }

  .container-wave-animated {
    grid-column-gap: 80px;
    grid-row-gap: 80px;
    justify-content: flex-start;
    align-self: center;
    align-items: center;
    width: 100%;
    min-width: 100%;
    height: 14rem;
    padding-top: 0;
    padding-bottom: 0;
    display: flex;
    position: static;
  }

  .image-logo-software.large {
    height: 8rem;
  }

  .code-distance_vs_effort {
    width: 100%;
  }

  .footer-cookies-links-container {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    justify-content: center;
    align-self: center;
    align-items: flex-start;
    display: none;
  }

  .section-avif-comparison {
    color: var(--page-black);
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-test_page-size_comparison.height-100 {
    justify-content: center;
    align-items: flex-start;
    display: flex;
  }

  .section-test_page-size_comparison.height-100.centered {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .section-test_page-alpha_transparency.height-100 {
    justify-content: center;
    align-items: flex-start;
    display: flex;
  }

  .section-test_page-alpha_transparency.height-100.centered {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .section-test_page-wide_gamut.height-100 {
    justify-content: center;
    align-items: flex-start;
    display: flex;
  }

  .section-test_page-wide_gamut.height-100.centered {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .section-test_page-animations.height-100 {
    justify-content: center;
    align-items: flex-start;
    display: flex;
  }

  .section-test_page-animations.height-100.centered {
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .section-hero.hero-fullspan-graphic.gradient-bottom {
    background-image: linear-gradient(0deg, var(--page-black) 5%, #18191b00 45%), image-set(
    url('../images/kamran-abdullayev-black-background-unsplash.jxl')
    type("image/jxl"),
    url('../images/kamran-abdullayev-black-background-unsplash.webp')
    type("image/webp"));
    background-position: 0 0, 50% 0;
    background-size: auto, cover;
  }

  .container-card-text {
    background-image: none;
  }

  .wrapper-image-photo_credit {
    object-fit: cover;
    height: auto;
    max-height: none;
  }

  .card-photo_credit {
    width: 100%;
  }

  .container-photo_credits-cards {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
  }

  .link-text-body-underline {
    font-size: 1.125rem;
  }

  .container-content-timeline, .container-section-padding {
    width: 100%;
  }

  .container-section-padding.centered {
    align-items: center;
  }

  .container-section-padding.width-page-max.centered {
    width: 100%;
  }

  .container-section-padding.width-1440 {
    max-width: 1440px;
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media screen and (max-width: 991px) {
  p {
    color: var(--text--color--text-white);
    font-size: 1rem;
  }

  li {
    font-size: 1.125rem;
  }

  .display-xl-bold.fill-gradient {
    letter-spacing: -.02em;
    max-width: none;
    font-size: 4rem;
  }

  .text-xl-light {
    font-size: 24px;
    line-height: 1.45em;
  }

  .text-xl-light.is-centered {
    font-size: 24px;
    line-height: 1.45;
  }

  .text-xl-light.is-centered._2lines {
    width: 10ch;
    font-size: 20px;
    line-height: 1.2;
  }

  .page-wrapper {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    padding-top: 6rem;
    padding-left: 0;
    padding-right: 0;
  }

  .page-wrapper.background-black {
    height: auto;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .page-wrapper.background-page_white {
    padding-left: 0;
    padding-right: 0;
  }

  .container-grouped {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  .container-grouped.white-background-opacity-60.add-padding-100 {
    max-width: none;
    padding: 4em;
  }

  .container-grouped.padding-global-sides {
    padding-left: 2em;
    padding-right: 2em;
  }

  .header-subhead {
    width: auto;
    max-width: none;
    margin-bottom: 0;
  }

  .size-small-1rem-16px {
    height: 16px;
  }

  .spacer-2rem {
    height: 2rem;
  }

  .size-60px {
    height: 48px;
  }

  .size-xxhuge-12rem-192px {
    height: 120px;
  }

  .display-l-bold {
    letter-spacing: 0;
    width: 100%;
    margin-bottom: 0;
    font-size: 46px;
  }

  .headline-l-semibold.centered.white {
    font-size: 44px;
    font-weight: 500;
    line-height: 1.1em;
  }

  .headline-s-semibold.centered.white._2line {
    letter-spacing: 0;
    width: 10em;
    font-size: 28px;
    line-height: 1.15em;
  }

  .text-xxl-regular {
    margin-bottom: 16px;
    font-size: 40px;
    line-height: 44px;
  }

  .text-xxl-regular.centered.teal {
    letter-spacing: -.025em;
    margin-bottom: 0;
    font-size: 36px;
    font-weight: 400;
    line-height: 1.15;
  }

  .text-xxl-regular.white, .text-xl-regular.white.reduce-width.bold {
    margin-bottom: 0;
  }

  .text-xl-regular.color-black {
    font-size: 1.75rem;
  }

  .text-l-medium {
    color: var(--text--color--text-white);
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1.45em;
  }

  .text-l-medium.large {
    margin-bottom: 0;
    font-size: 1.25rem;
    font-weight: 300;
  }

  .container-content-fullspan {
    grid-column-gap: 0px;
    grid-row-gap: 32px;
    width: 100%;
    min-width: auto;
    height: auto;
  }

  .section-jpeg-comparison {
    padding: 0;
  }

  .container-headline {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }

  .container-column-1.centered {
    border-style: none solid;
    border-width: 1px 0;
    border-color: var(--white) black;
    width: 100%;
    margin-top: 24px;
    margin-bottom: 24px;
    padding-left: 0;
    padding-right: 0;
  }

  .container-text {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .section-visually-lossless {
    padding: 0;
  }

  .continer-4col {
    justify-content: center;
    place-items: start center;
    max-width: 600px;
  }

  .section-lossless-compression {
    padding: 0;
  }

  .section-lossless-transcoding, .section-wide-gamut-hdr, .section-progressive-decode {
    padding: 0 2.5em;
  }

  .section-fast-encoding-decoding {
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-environmental-impact {
    padding: 0 2em;
  }

  .icon-medium-64px {
    justify-content: center;
    align-items: center;
    display: flex;
  }

  .container-text-grid {
    padding: 32px;
  }

  .container-code {
    padding-bottom: var(--sizing--spacing--small);
    max-width: 896px;
  }

  .header-hero {
    width: 100%;
    max-width: none;
    margin-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .container-text_only {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    justify-content: flex-start;
    align-items: flex-start;
    max-width: 600px;
    padding-left: 0;
    padding-right: 0;
  }

  .container-text_only.fullspan.divider-vertical {
    padding-right: 40px;
  }

  .section-more-features {
    padding: 0 0;
  }

  .container-group.centered {
    border-style: none solid;
    border-width: 1px 0;
    border-color: var(--white) black;
    width: 60%;
    margin-top: 0;
    margin-bottom: 0;
  }

  .code-embed-3 {
    max-width: 896px;
  }

  .div-container-code {
    min-height: auto;
  }

  .footer_bottom-wrapper {
    grid-column-gap: 3rem;
    grid-row-gap: 1rem;
    flex-flow: column;
    grid-template-rows: auto auto auto;
    grid-template-columns: max-content;
    grid-auto-columns: max-content;
    grid-auto-flow: column;
    place-content: start center;
    place-items: flex-start center;
    height: auto;
    display: flex;
  }

  .social-link {
    width: 1.5rem;
    height: 1.5rem;
  }

  .footer_social-list {
    grid-column-gap: 1rem;
    justify-content: center;
    width: auto;
  }

  .padding-section-medium {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .container-large, .padding-global {
    max-width: none;
  }

  .container-horizontal.add-padding.add-background-w_curves.border-blur-right {
    padding-left: 40px;
  }

  .logo-home-large {
    width: 160px;
  }

  .section-jpeg-xl-hero {
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-jpeg-xl-hero.gradient-bottom {
    padding-top: 12rem;
  }

  .image-wave-2560 {
    width: 100%;
    max-width: none;
  }

  .container-2col-span-text, .container-grid-2col-comparison {
    width: 100%;
    max-width: 768px;
  }

  .navbar-logo-left {
    width: 100%;
    height: 100%;
  }

  .navbar-logo-left-container.shadow-three, .navbar-logo-left-container.shadow-three.padding-global {
    padding: 1em 2em;
  }

  .nav-menu-wrapper {
    background-color: #0000;
  }

  .nav-menu-two {
    background-color: #fff;
    border-radius: 50px;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: center;
    margin-top: 10px;
    padding: 20px;
    display: flex;
    box-shadow: 0 8px 50px #0000000d;
  }

  .nav-link {
    padding-left: 5px;
    padding-right: 5px;
  }

  .nav-dropdown-list.shadow-three.w--open {
    position: absolute;
  }

  .menu-button {
    padding: 12px;
  }

  .menu-button.w--open {
    color: #fff;
    background-color: #a6b1bf;
  }

  .section-content {
    height: 100%;
  }

  .section-content.padding-global {
    height: auto;
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-nav-top-items {
    max-width: none;
  }

  .body-4 {
    background-color: var(--page-black);
  }

  .navigation-top_nav {
    align-items: flex-start;
    height: 120px;
  }

  .div-container-full_span-horizontal.centered {
    height: 200px;
  }

  .div-contain-items-full_center {
    height: 200px;
    position: static;
  }

  .icon {
    color: var(--page-black);
    -webkit-text-stroke-color: var(--page-black);
  }

  .label-menu-text {
    white-space: nowrap;
    font-size: 1em;
  }

  .text-question-faq {
    line-height: 1.45em;
  }

  .container-content-vflex {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .container-content-vflex.width-page-max {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-content-vflex.width-page-max.centered {
    align-items: center;
  }

  .container-content-vflex.width-page-max.centered.gap-medium {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .container-content-vflex.width-1440 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-content-vflex.padding-sides {
    padding-left: 4rem;
    padding-right: 4rem;
  }

  .wrapper-image.centered.radius-small {
    border-radius: .375rem;
    overflow: hidden;
  }

  .image-wave-1440 {
    width: 100%;
    max-width: none;
  }

  .menu-icon_line-bottom {
    background-color: var(--base--white);
    width: 24px;
    height: 2px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .menu-icon_line-middle-inner {
    width: 4px;
    height: 0;
    padding-bottom: 0;
    padding-right: 0;
  }

  .menu-icon_line-middle {
    background-color: var(--base--white);
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 2px;
    margin-top: 6px;
    margin-bottom: 6px;
    padding-bottom: 0;
    padding-right: 0;
    display: flex;
  }

  .menu-icon_line-top {
    background-color: var(--base--white);
    width: 24px;
    height: 2px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .menu-icon {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 48px;
    height: 48px;
    margin-right: -.5rem;
    padding-bottom: 0;
    padding-right: 0;
    display: flex;
  }

  .navbar_menu-button.w--open {
    background-color: #0000;
  }

  .navbar_dropdown-background-layer {
    min-width: 100%;
  }

  .button-link-text {
    letter-spacing: .015em;
    flex: none;
    align-self: auto;
    align-items: center;
    font-size: 1rem;
    display: flex;
  }

  .button-link-text:hover {
    font-size: 1rem;
  }

  .button-group {
    height: 2rem;
    min-height: 2rem;
  }

  .rl_navbar5_large-item-content, .navbar_blog-item, .rl_navbar5_blog-list, .navbar_dropdown-content-wrapper {
    width: 100%;
  }

  .navbar_dropdown-content-right {
    align-items: flex-start;
    max-width: none;
  }

  .navbar_dropdown-link-list {
    align-items: flex-start;
    width: 100%;
  }

  .navbar_dropdown-content-left {
    align-content: start;
    align-items: start;
    padding-left: 0;
    padding-right: 0;
  }

  .navbar_dropdown-content {
    flex-direction: column;
    display: inline-flex;
  }

  .navbar_container {
    max-width: 100%;
  }

  .navbar_dropdown-list {
    display: none;
    position: relative;
    overflow: visible;
  }

  .navbar_dropdown-list.w--open {
    border-style: none;
    align-items: flex-start;
    min-width: auto;
    margin-bottom: 1.5rem;
    padding: 0 0 0;
    position: relative;
    top: 0;
    left: 0;
    right: 0;
  }

  .navbar_link-text {
    color: var(--text--color--text-black);
  }

  .dropdown-icon {
    margin-top: 0;
    margin-bottom: 0;
    margin-right: 0;
    display: none;
    inset: auto 0% auto auto;
  }

  .navbar_dropdown-toggle {
    align-items: center;
    padding-top: .75rem;
    padding-bottom: .75rem;
    padding-left: 0;
    font-size: 1.125rem;
    display: flex;
  }

  .navbar_menu-dropdown {
    width: 100%;
    position: relative;
  }

  .navbar_link {
    width: auto;
    padding: .75rem 0;
    font-size: 1.125rem;
  }

  .navbar_link.navbar-top {
    width: 3rem;
  }

  .navbar_menu {
    -webkit-text-fill-color: inherit;
    background-color: #fff;
    background-clip: border-box;
    border-bottom: 1px solid #000;
    align-items: flex-start;
    height: 100vh;
    margin-left: 0;
    padding: 1rem 5% 15rem;
    position: absolute;
    overflow: auto;
  }

  .navbar_logo {
    height: 100%;
    margin-top: 0;
  }

  .navbar_logo-link.w--current {
    align-items: center;
    height: 5rem;
    margin-top: .25rem;
    display: flex;
  }

  .navbar_component {
    margin-top: -7rem;
    padding-left: 2rem;
    padding-right: 2rem;
    display: flex;
  }

  .navbar-2-container {
    padding-left: 0;
    padding-right: 0;
  }

  .navbar-wrapper-text-section {
    width: 100%;
    padding-bottom: 0;
  }

  .container-vflex {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column;
    width: 100%;
    display: flex;
  }

  .container-navbar-dropdown-content {
    padding-top: 0;
    padding-bottom: 0;
    display: none;
  }

  .container-navbar-content {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
    flex-flow: column;
  }

  .navbar-container-menu-top {
    height: 6rem;
    padding-left: 2rem;
    padding-right: 1.5rem;
  }

  .navbar-icon-main {
    width: 1.75rem;
  }

  .navbar-social-links {
    grid-column-gap: 1rem;
    justify-content: flex-start;
    align-items: flex-start;
  }

  .container-content-hflex {
    align-items: flex-start;
    width: 50%;
    display: flex;
  }

  .container-content-hflex.fullspan {
    align-items: stretch;
  }

  .container-content-hflex.grid-3col {
    width: 100%;
  }

  .container-column-vertical {
    grid-column-gap: .5rem;
    grid-row-gap: .5rem;
    flex-flow: column;
    justify-content: flex-start;
    align-items: flex-start;
    height: auto;
    display: flex;
  }

  .section-content-wrapper {
    width: 100%;
    min-height: 100px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-content-wrapper.height-100.centered.padding-top_bottom {
    padding-top: 2rem;
    padding-bottom: 5rem;
  }

  .section-content-wrapper.padding-2rem {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .wrapper-text.width-small {
    max-width: 600px;
  }

  .container-wave-animated {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    width: 100%;
    min-width: auto;
    height: 8rem;
  }

  .group-container {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .footer-cookies-links-container {
    grid-column-gap: .875rem;
    grid-row-gap: .875rem;
    display: none;
  }

  .section-avif-comparison {
    padding: 0;
  }

  .container-4col.gap-4rem {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .text-small-regular.centered {
    font-size: 1rem;
  }

  .spacer-1rem {
    height: 1rem;
  }

  .section-test_page-size_comparison {
    width: 100%;
    min-height: 100px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-test_page-size_comparison.height-100.centered.padding-top_bottom {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .section-test_page-alpha_transparency {
    width: 100%;
    min-height: 100px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-test_page-alpha_transparency.height-100.centered.padding-top_bottom {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .section-test_page-wide_gamut {
    width: 100%;
    min-height: 100px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-test_page-wide_gamut.height-100.centered.padding-top_bottom {
    padding-top: 4rem;
    padding-bottom: 4rem;
  }

  .section-test_page-animations {
    width: 100%;
    min-height: 100px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-test_page-animations.height-100.centered.padding-top_bottom {
    padding-top: 4rem;
    padding-bottom: 8rem;
  }

  .spacer-4rem {
    height: 2rem;
  }

  .container-2col.gap-4rem {
    grid-column-gap: 2rem;
    grid-row-gap: 2rem;
  }

  .section-hero {
    width: 100%;
    min-height: 100px;
    padding-bottom: 0;
    padding-right: 0;
  }

  .section-hero.hero-fullspan-graphic.gradient-bottom {
    background-position: 0 0, 50% 0;
    background-size: auto, cover;
    height: auto;
    margin-top: -6rem;
    padding-top: 12rem;
    padding-bottom: 0;
  }

  .wrapper-image-example-transparency {
    padding: 1rem;
  }

  .container-card-text {
    padding: 1rem 1rem 1.25rem;
  }

  .text-photo_credit-image_title {
    letter-spacing: 0;
    font-size: 1.25rem;
  }

  .wrapper-image-photo_credit {
    height: auto;
    max-height: none;
  }

  .card-photo_credit {
    grid-column-gap: 0rem;
    grid-row-gap: 0rem;
    background-image: linear-gradient(#ffffff26, #ffffff0d 85%);
  }

  .text-photo_credit-link {
    line-height: 1.1em;
  }

  .text-photo_credit-link:hover {
    color: var(--brand--teal-bright--600);
  }

  .container-photo_credits-cards {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    align-items: flex-start;
    width: 100%;
    display: grid;
  }

  .container-text-shaded.centered {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-grid-4col-contributors {
    grid-column-gap: 1rem;
    grid-row-gap: .5rem;
    grid-template-columns: 1fr 1fr 1fr;
    grid-template-areas: "Area Area Area";
  }

  .container-images-timeline {
    align-items: flex-start;
    width: 50%;
    display: flex;
  }

  .container-content-timeline {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .footer-logo-link.w--current {
    align-items: center;
    height: 5rem;
    margin-top: .25rem;
    display: flex;
  }

  .footer-logo {
    height: 100%;
    margin-top: 0;
  }

  .container-section-padding {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .container-section-padding.width-page-max {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-section-padding.width-page-max.centered {
    align-items: center;
  }

  .container-section-padding.width-page-max.centered.gap-medium {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .container-section-padding.width-page-max.centered.gap-3rem, .container-section-padding.width-1440 {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-section-padding.padding-sides {
    padding-left: 4rem;
    padding-right: 4rem;
  }
}

@media screen and (max-width: 767px) {
  h1, h2 {
    letter-spacing: -.015em;
  }

  h3 {
    letter-spacing: 0;
    font-weight: 600;
  }

  h4 {
    letter-spacing: 0;
    font-size: 1.5rem;
  }

  h5 {
    letter-spacing: 0;
    font-size: 1.255rem;
  }

 /*  p, a, li {
    font-size: 1rem;
  }
 */
  .navbar-section {
    height: 80px;
  }

  .navbar_headertext {
    font-size: 4vw;
    margin-left: 0.5em;
    margin-right: 0.5em;
  }

  .display-xl-bold.fill-gradient {
    letter-spacing: 0;
    margin-bottom: 0;
    padding-bottom: 10px;
    font-size: 3rem;
  }

  .text-xl-light {
    font-size: 24px;
    line-height: 1.45em;
  }

  .text-xl-light.is-centered {
    letter-spacing: 0;
    font-size: 20px;
    line-height: 1.45em;
  }

  .text-xl-light.is-centered._2lines {
    width: 6em;
  }

  .page-wrapper {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: none;
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .page-wrapper.background-black, .page-wrapper.background-page_white {
    padding-top: 0;
  }

  .wrapper-content-full {
    margin-bottom: -70px;
  }

  .container-grouped {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: 568px;
    padding-left: 0;
    padding-right: 0;
  }

  .container-grouped.white-background-opacity-60.add-padding-100 {
    border-radius: 40px;
    padding: 3em 0;
  }

  .container-grouped.padding-global-sides {
    padding-left: 2em;
    padding-right: 2em;
  }

  .header-subhead {
    max-width: 568px;
  }

  .size-small-1rem-16px {
    height: 8px;
  }

  .spacer-2rem {
    height: 2rem;
  }

  .size-large-3rem-48px, .size-60px {
    height: 32px;
  }

  .size-xxhuge-12rem-192px {
    height: 80px;
  }

  .display-l-bold {
    font-size: 40px;
    line-height: 1.1;
  }

  .headline-l-semibold.centered.white {
    font-size: 32px;
    line-height: 1.1em;
  }

  .headline-l-semibold.white {
    font-size: 28px;
    line-height: 1.25;
  }

  .headline-s-semibold.centered.white._2line {
    font-size: 24px;
    line-height: 1.15;
  }

  .text-xxl-regular.centered.teal {
    letter-spacing: -.02em;
    margin-bottom: 0;
    font-size: 28px;
    font-weight: 400;
    line-height: 1.15em;
  }

  .text-xxl-regular.white {
    font-size: 24px;
  }

  .text-xl-regular.white.reduce-width.bold {
    margin-bottom: 0;
    font-size: 24px;
  }

  .text-l-medium {
    margin-bottom: .5rem;
    line-height: 1.45;
  }

  .text-l-medium.large {
    font-size: 1.125rem;
    font-weight: 300;
  }

  .container-content-fullspan {
    width: 100%;
    height: auto;
  }

  .section-jpeg-comparison {
    padding-top: 0;
    padding-bottom: 0;
  }

  .container-headline {
    padding-left: 0;
    padding-right: 0;
  }

  .container-column-1.centered {
    border-style: none;
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .continer-4col {
    max-width: 480px;
  }

  .section-lossless-compression {
    padding: 0;
  }

  .section-lossless-transcoding {
    padding-left: 0;
    padding-right: 0;
  }

  .section-wide-gamut-hdr {
    padding: 0 0;
  }

  .section-progressive-decode {
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-progressive-decode.padding-global-sides {
    padding-left: 0;
    padding-right: 0;
  }

  .section-fast-encoding-decoding {
    padding: 0 0;
  }

  .section-environmental-impact {
    padding: 0 2em;
  }

  .container-grid {
    grid-template-rows: auto auto auto auto auto auto;
    grid-template-columns: 1fr;
  }

  .container-text-grid {
    width: 100%;
  }

  .container-code {
    max-width: none;
  }

  .header-hero {
    max-width: 568px;
    padding-left: 2em;
    padding-right: 2em;
  }

  .container-text_only {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: 480px;
    padding-left: 0;
    padding-right: 0;
  }

  .container-text_only.fullspan.divider-vertical {
    border-bottom: 5px none var(--white);
    border-right-style: solid;
    padding-right: 20px;
  }

  .section-more-features {
    padding: 0 0;
  }

  .code-embed-3 {
    max-width: none;
  }

  .div-container-code {
    min-height: auto;
  }

  .footer_legal-link {
    color: #99f4f1b3;
    font-size: .75rem;
    text-decoration: none;
  }

  .footer_credit-text {
    color: #99f4f1b3;
    margin-top: 0;
    font-size: .75rem;
  }

  .footer_bottom-wrapper {
    grid-column-gap: .5rem;
    grid-row-gap: .5rem;
    grid-template-rows: auto auto;
    grid-template-columns: max-content;
    grid-auto-columns: max-content;
    grid-auto-flow: row;
    justify-content: start;
    place-items: start;
    height: auto;
    display: grid;
  }

  .social-link {
    width: 24px;
  }

  .footer_social-list {
    grid-column-gap: 1rem;
    justify-content: flex-start;
    align-items: center;
  }

  .padding-section-medium {
    padding-top: 1rem;
    padding-bottom: 1.5rem;
  }

  .padding-global {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-horizontal.add-padding.add-background-w_curves.border-blur-right {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    border-radius: 0;
    flex-flow: column;
    grid-template-rows: auto;
    grid-template-columns: 2fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .container-column.horizontal.add-padding-width {
    padding-left: 4em;
    padding-right: 4em;
  }

  .logo-home-large {
    width: 120px;
    height: auto;
  }

  .section-jpeg-xl-hero {
    padding-top: 0;
    padding-bottom: 0;
  }

  .section-jpeg-xl-hero.gradient-bottom {
    margin-top: -7rem;
    padding-top: 14rem;
  }

  .navbar-logo-left {
    width: 100%;
    height: 100%;
  }

  .navbar-logo-left-container {
    max-width: 100%;
  }

  .navbar-logo-left-container.shadow-three, .navbar-logo-left-container.shadow-three.padding-global {
    padding: .5em 1em;
  }

  .navbar-brand {
    height: 60px;
    padding-left: 0;
  }

  .nav-menu-two {
    border-radius: 20px;
    flex-direction: column;
    padding-bottom: 30px;
  }

  .nav-link {
    padding-top: 10px;
    padding-bottom: 10px;
    display: inline-block;
  }

  .nav-dropdown {
    flex-direction: column;
    align-items: center;
    display: flex;
  }

  .nav-dropdown-toggle {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .nav-dropdown-list.shadow-three {
    box-shadow: 0 8px 50px #0000000d;
  }

  .nav-dropdown-list.shadow-three.w--open {
    position: relative;
  }

  .nav-dropdown-list.shadow-three.mobile-shadow-hide {
    box-shadow: none;
  }

  .nav-divider {
    width: 200px;
    max-width: 100%;
    height: 1px;
    margin-top: 10px;
    margin-bottom: 10px;
  }

  .section-content.padding-global {
    padding-bottom: 100px;
  }

  .navigation-top_nav {
    align-items: flex-start;
    height: 72px;
  }

  .div-container-full_span-horizontal.centered, .div-contain-items-full_center {
    height: 150px;
  }

  .div-container-rounded_text_box {
    padding-left: 1.25em;
    padding-right: 1.25em;
  }

  .label-menu-text {
    white-space: nowrap;
    font-size: .875em;
  }

  .container-content-vflex.width-page-max, .container-content-vflex.width-page-max.centered {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .container-content-vflex.width-page-max.centered.gap-medium {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-content-vflex.width-1440 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .container-content-vflex.padding-sides {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .wrapper-content {
    flex-flow: column;
    align-items: center;
    display: flex;
  }

  .wrapper-image {
    width: 100%;
    max-width: none;
    height: auto;
    max-height: none;
  }

  .button-link-text {
    font-size: .875rem;
  }

  .button-link-text:hover {
    letter-spacing: .015em;
    font-size: .875rem;
  }

  .rl_navbar5_spacing-block2, .rl_navbar5_spacing-block1 {
    padding-bottom: .75rem;
  }

  .navbar_blog-item {
    grid-template-columns: .6fr 1fr;
  }

  .navbar_dropdown-content-right {
    padding: 1.5rem;
  }

  .navbar_dropdown-link-list {
    grid-row-gap: .5rem;
    max-width: none;
  }

  .navbar_dropdown-content-left {
    grid-row-gap: 1.5rem;
    flex-direction: column;
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
  }

  .navbar_link.navbar-top {
    width: 2.5rem;
  }

  .navbar_logo {
    height: 100%;
    margin-top: 0;
  }

  .navbar_logo-link, .navbar_logo-link.w--current {
    height: 3rem;
  }

  .navbar_component {
    min-height: 4rem;
  }

  .text-navbar-menu_section {
    font-size: 1rem;
  }

  .container-navbar-content {
  }

  .navbar-container-menu-top {
    height: 5rem;
    padding-right: 1.5rem;
  }

  .navbar-icon-main {
    width: 1.5rem;
  }

  .navbar-social-links {
    grid-column-gap: 1rem;
  }

  .container-content-hflex.fullspan {
    grid-column-gap: 3rem;
    grid-row-gap: 3rem;
  }

  .section-content-wrapper.height-100.centered.padding-top_bottom {
    padding-top: 2.5rem;
    padding-bottom: 5rem;
  }

  .section-content-wrapper.padding-2rem {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    padding-left: 1rem;
    padding-right: 1rem;
    display: flex;
  }

  .wrapper-text.width-small {
    max-width: 480px;
  }

  .container-wave-animated {
    width: 100%;
    min-width: 568px;
    height: 7rem;
  }
  
  .code-scale_box-animated {
    object-fit: cover;
  }

  .footer-cookies-links-container {
    align-items: flex-start;
  }

  .section-avif-comparison {
    padding-top: 0;
    padding-bottom: 0;
  }

  .container-4col.gap-4rem {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-auto-columns: 1fr;
    align-items: flex-start;
    display: grid;
  }

  .text-small-regular.centered {
    font-size: .875rem;
  }

  .image-example-wide_gamut {
    width: auto;
    height: auto;
    max-width: 100%;
    object-fit: contain;
  }

  .image-example-comparison {
    aspect-ratio: 2 / 3;
    object-fit: cover;
    width: 100%;
    height: auto;
    overflow: hidden;
  }

  .section-test_page-size_comparison.height-100.centered.padding-top_bottom, .section-test_page-alpha_transparency.height-100.centered.padding-top_bottom, .section-test_page-wide_gamut.height-100.centered.padding-top_bottom {
    padding-top: 3rem;
    padding-bottom: 3rem;
  }

  .section-test_page-animations.height-100.centered.padding-top_bottom {
    padding-top: 3rem;
    padding-bottom: 6rem;
  }

  .wrapper-footer-content {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .container-2col.gap-4rem {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    align-items: flex-start;
    display: grid;
  }

  .section-hero.hero-fullspan-graphic.gradient-bottom {
    margin-top: -5rem;
    padding-top: 14rem;
    padding-bottom: 0;
  }

  .wrapper-image-example-transparency {
    width: 100%;
    max-width: none;
    height: auto;
    max-height: none;
  }

  .container-card-text {
    padding: .75rem .75rem 1rem;
  }

  .wrapper-image-photo_credit {
    width: 100%;
    max-width: none;
    height: auto;
    max-height: none;
  }

  .text-photo_credit-link {
    color: var(--brand--blue--500);
    line-height: 1.1em;
  }

  .text-photo_credit-link:hover {
    color: var(--brand--teal-bright--600);
  }

  .container-photo_credits-cards {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    grid-template-columns: 1fr 1fr 1fr;
  }

  .container-logos {
    grid-column-gap: 3rem;
    grid-row-gap: 3rem;
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .text-all-caps-micro-medium-white {
    font-size: .625rem;
  }

  .text-medium-semibold {
    font-size: 1.25rem;
  }

  .text-medium-semibold.wrap-none {
    font-size: 1rem;
  }

  .container-grid-4col-contributors {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
  }

  .container-content-timeline.background-image {
    padding: 1.5rem 1rem 1rem;
  }

  .footer-logo-link {
    height: 3rem;
  }

  .footer-logo-link.w--current {
    height: 4rem;
  }

  .footer-logo {
    height: 100%;
    margin-top: 0;
  }

  .text-medium-normal {
    font-size: 1.25rem;
  }

  .container-section-padding.width-page-max, .container-section-padding.width-page-max.centered {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .container-section-padding.width-page-max.centered.gap-medium, .container-section-padding.width-page-max.centered.gap-3rem {
    padding-left: 2rem;
    padding-right: 2rem;
  }

  .container-section-padding.width-1440 {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .container-section-padding.padding-sides {
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media screen and (max-width: 479px) {
  .navbar-section {
    height: 80px;
  }

  .display-xl-bold.fill-gradient {
    width: 100%;
    font-size: 2.5rem;
  }
  .text-xl-light {
    font-size: 18px;
    line-height: 1.45em;
  }

  .text-xl-light.is-centered {
    letter-spacing: 0;
    width: 100%;
    font-size: 18px;
    line-height: 1.45em;
  }

  .text-xl-light.is-centered._2lines {
    width: 6em;
  }

  .page-wrapper {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    padding-left: 0;
    padding-right: 0;
  }

  .page-wrapper.background-black {
    padding-top: 0;
  }

  .wrapper-content-full {
    margin-bottom: -70px;
  }

  .container-grouped {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  .container-grouped.padding-global-sides {
    padding: 0 1.5em;
  }

  .header-subhead {
    padding-right: var(--sizing--spacing--small);
    padding-left: var(--sizing--spacing--small);
    width: 100%;
    max-width: none;
  }

  .size-small-1rem-16px {
    height: 8px;
  }

  .spacer-2rem {
    height: 1.5rem;
  }

  .size-large-3rem-48px {
    height: 24px;
  }

  .size-60px {
    height: 32px;
  }

  .size-xxhuge-12rem-192px {
    height: 80px;
  }

  .display-l-bold {
    letter-spacing: .01em;
    width: 100%;
    font-size: 32px;
    line-height: 1.05;
  }

  .headline-l-semibold.centered.white {
    letter-spacing: -.016em;
    font-size: 32px;
  }

  .headline-s-semibold.centered.white {
    font-size: 26px;
    line-height: 1.2em;
  }

  .headline-s-semibold.centered.white._2line {
    letter-spacing: 0;
    width: auto;
    font-weight: 700;
  }

  .text-xxl-regular.centered.teal {
    letter-spacing: -.03em;
    width: 100%;
    max-width: none;
    font-size: 22px;
    font-weight: 400;
    line-height: 1.15em;
  }

  .text-xxl-regular.white {
    margin-bottom: 0;
  }

  .text-xl-regular.color-black {
    text-align: center;
    white-space: normal;
    word-break: keep-all;
    overflow-wrap: normal;
    font-size: 1.5rem;
  }

  .text-l-medium {
    font-size: 18px;
    line-height: 1.4em;
  }

  .text-l-medium.large {
    font-size: 1.125rem;
    font-weight: 300;
  }

  .container-content-fullspan {
    width: 100%;
    min-width: auto;
    height: auto;
  }

  .section-jpeg-comparison {
    padding: 0;
  }

  .container-headline {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
  }

  .container-column-1.left {
    overflow: visible;
  }

  .container-column-1.right {
    height: auto;
    overflow: clip;
  }

  .container-column-1.centered {
    border-top-style: none;
    border-top-width: 0;
    border-bottom-style: none;
    border-bottom-width: 0;
    width: 80%;
    margin-top: 0;
    margin-bottom: 0;
  }

  .container-column-1.width-15em {
    width: 15em;
  }

  .section-visually-lossless {
    padding: 0;
  }

  .continer-4col {
    grid-column-gap: 2em;
    grid-row-gap: 2em;
    flex-flow: column;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    justify-content: space-between;
    place-items: start center;
    width: 100%;
    display: grid;
  }

  .section-lossless-compression, .section-lossless-transcoding, .section-wide-gamut-hdr {
    padding: 0;
  }

  .section-progressive-decode {
    padding: 100px 20px;
  }

  .section-progressive-decode.padding-global-sides, .section-fast-encoding-decoding, .section-environmental-impact {
    padding: 0;
  }

  .icon-medium-64px {
    width: 48px;
    height: 48px;
  }

  .container-grid {
    grid-template-rows: auto auto auto auto auto auto;
    grid-template-columns: 1fr;
    grid-auto-flow: column;
    align-self: center;
    justify-items: center;
    max-width: none;
  }

  .container-text-grid {
    padding: 2em;
  }

  .container-code {
    max-width: none;
  }

  .header-hero {
    width: 100%;
    max-width: none;
    padding-left: 2em;
    padding-right: 2em;
  }

  .container-text_only {
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    max-width: 320px;
    padding-left: 0;
    padding-right: 0;
  }

  .container-text_only.align-center {
    width: 100%;
    max-width: none;
  }

  .section-more-features {
    background-image: linear-gradient(0deg, #17a3a04d, #17a3a000 5%), linear-gradient(#00000080, #00000080);
    padding: 0;
  }

  .container-group.centered {
    border-top-style: none;
    border-bottom-style: none;
    width: 100%;
    margin-top: 0;
    margin-bottom: 0;
  }

  .div-container-code {
    min-height: auto;
  }

  .footer_legal-link, .footer_credit-text {
    color: #99f4f1b3;
  }

  .footer_bottom-wrapper {
    grid-column-gap: .5rem;
    grid-row-gap: .5rem;
    grid-template-rows: auto auto;
    grid-template-columns: max-content;
    grid-auto-columns: max-content;
    justify-content: center;
    place-items: start center;
    width: 100%;
    display: grid;
  }

  .social-link {
    width: 24px;
  }

  .padding-section-medium {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .padding-global {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .body {
    height: auto;
  }

  .logo-home-large {
    width: 80px;
    height: auto;
  }

  .container-column-1-grid.left {
    overflow: visible;
  }

  .container-column-1-grid.right {
    height: auto;
    overflow: clip;
  }

  .navbar-logo-left-container.shadow-three, .navbar-logo-left-container.shadow-three.padding-global {
    padding: .5em 1em;
  }

  .navbar-brand {
    height: 60px;
  }

  .nav-menu-two {
    flex-direction: column;
  }

  .container-nav-top-items {
    max-width: none;
  }

  .navigation-top_nav {
    align-items: flex-start;
    height: 72px;
  }

  .div-container-full_span-horizontal.centered {
    height: 100px;
    margin-top: 0;
  }

  .div-contain-items-full_center {
    height: 110px;
  }

  .label-menu-text {
    font-size: 12px;
  }

  .container-content-vflex.width-page-max {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .container-content-vflex.width-page-max.centered {
    padding-left: 0;
    padding-right: 0;
  }

  .container-content-vflex.padding-sides {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .rl_navbar5_large-item-content {
    margin-top: 1rem;
  }

  .navbar_blog-item {
    flex-direction: column;
    display: flex;
  }

  .rl_navbar5_blog-list {
    grid-column-gap: 0px;
    grid-row-gap: .5rem;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .navbar_dropdown-content-left {
    grid-template-columns: 1fr;
    padding-top: 1rem;
    padding-bottom: 1rem;
  }

  .navbar_link.navbar-top {
    width: 2.5rem;
  }

  .navbar_logo-link {
    height: 3rem;
  }

  .container-navbar-content {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
  }

  .navbar-container-menu-top {
    height: 5rem;
    padding-left: 0.7rem;
    padding-right: 0.5rem;
  }

  .navbar-icon-main {
    width: 1.5rem;
  }

  .container-content-hflex.fullspan {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    flex-flow: column;
  }

  .container-content-hflex.grid-3col {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    display: flex;
  }

  .container-column-vertical.fullspan {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
  }

  .section-content-wrapper.height-100.centered.padding-top_bottom {
    padding-top: 2rem;
    padding-bottom: 4rem;
  }

  .wrapper-text.color-gradient._40em {
    width: 12em;
  }

  .wrapper-text.centered.width-rem {
    max-width: 24em;
  }

  .container-wave-animated {
    width: 100%;
    min-width: auto;
    height: 4rem;
  }

  .group-container {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .wrapper-logo-text {
    grid-row-gap: 0rem;
  }

  .text-regular-semibold.wrap-none.centered.color-black {
    font-size: 1em;
  }

  .footer-cookies-links-container {
    grid-column-gap: .25rem;
    grid-row-gap: .25rem;
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
  }

  .section-avif-comparison {
    padding: 0;
  }

  .container-4col.gap-4rem {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1rem;
    flex-flow: wrap;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .container-3col {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1rem;
    grid-template-columns: 1fr 1fr;
  }

  .container-2col.gap-4rem {
    grid-column-gap: 1.5rem;
    grid-row-gap: 1.5rem;
    flex-flow: wrap;
    grid-template-rows: auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .section-hero.hero-fullspan-graphic.gradient-bottom {
    margin-top: -5rem;
    padding-top: 10rem;
    padding-bottom: 0;
  }

  .container-card-text {
    padding: .75rem .75rem 1rem;
  }

  .text-photo_credit-image_title {
    font-size: 1.125rem;
  }

  .text-photo_credit-link {
    color: var(--brand--blue--500);
  }

  .text-photo_credit-link:hover {
    color: var(--brand--teal-bright--600);
  }

  .container-photo_credits-cards {
    grid-template-columns: 1fr 1fr;
    padding-left: 0;
    padding-right: 0;
  }

  .container-logos {
    grid-column-gap: 3rem;
    grid-row-gap: 1.5rem;
    flex-flow: wrap;
    justify-content: center;
  }

  .wrapper-logo-software-link {
    height: 3.5rem;
  }

  .wrapper-logo-software-link.horizontal {
    height: 2rem;
  }

  .container-text-shaded.centered {
    padding: 1rem;
  }

  .text-all-caps-micro-medium-white {
    font-size: .625rem;
    line-height: 1.1em;
  }

  .text-medium-semibold.wrap-none {
    font-size: 1rem;
  }

  .container-grid-4col-contributors {
    grid-column-gap: .5rem;
    grid-row-gap: .5rem;
    flex-flow: wrap;
    grid-template: "Area Area"
                   ". ."
                   / 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .container-content-timeline.left {
    order: 1;
    justify-content: center;
    align-items: center;
  }

  .container-content-timeline.background-image {
    padding: 1.5rem 1rem 1rem;
  }

  .footer-logo-link {
    height: 3rem;
  }

  .text-medium-normal.color-white.align-right, .text-medium-normal.color-white.align-left {
    text-align: center;
  }

  .container-section-padding.width-page-max {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }

  .container-section-padding.width-page-max.centered {
    padding-left: 0;
    padding-right: 0;
  }

  .container-section-padding.width-page-max.centered.gap-3rem, .container-section-padding.padding-sides {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .heading {
    font-size: 1.125rem;
  }
}

#w-node-c1cf0a6d-8a65-f374-860d-0e00537420fd-8c10331b {
  place-self: start center;
}

#w-node-_82ecf1c9-12f9-3d75-15b4-fc4d518fb85a-8c10331b {
  justify-self: center;
}

#w-node-_8e9aaa5d-c4ff-899a-79da-79764703422e-4703421c {
  justify-self: end;
}

#w-node-fedcfc71-bc17-af3f-285c-68c798bcef4e-4703421c {
  place-self: center;
}

#w-node-c0d3ad9f-7ad0-819a-9ca1-7b24d38a2a6f-4703421c {
  justify-self: center;
}

#w-node-_565da8bc-df19-7576-cee6-b50f2a6dc655-e6b058c4, #w-node-_35a987ad-a930-0a0a-5ea8-f2edc14d1069-e6b058c4, #w-node-_2309e2c2-090b-5fd9-4053-343238b595d0-e6b058c4 {
  grid-area: span 1 / span 4 / span 1 / span 4;
}

@media screen and (min-width: 1440px) {
  #w-node-_7d1a97ec-0ecc-5c45-864a-4a78a4574593-8c10331b {
    place-self: start;
  }

  #w-node-_7d1a97ec-0ecc-5c45-864a-4a78a4574597-8c10331b {
    place-self: auto;
  }

  #w-node-_82ecf1c9-12f9-3d75-15b4-fc4d518fb85a-8c10331b {
    align-self: start;
  }

  #w-node-_82ecf1c9-12f9-3d75-15b4-fc4d518fb860-8c10331b {
    place-self: start;
  }

  #w-node-_82ecf1c9-12f9-3d75-15b4-fc4d518fb865-8c10331b {
    place-self: auto;
  }

  #w-node-_6b3ac082-f695-e649-a203-cf78ce46e2a5-8c10331b {
    place-self: start;
  }

  #w-node-_6b3ac082-f695-e649-a203-cf78ce46e2a9-8c10331b {
    place-self: auto;
  }
}

@media screen and (max-width: 991px) {
  #w-node-_82ecf1c9-12f9-3d75-15b4-fc4d518fb85a-8c10331b {
    justify-self: center;
  }

  #w-node-f2a46d6f-fb7c-446b-3280-fc1fe782d216-8c10331b {
    justify-self: auto;
  }

  #w-node-_8e9aaa5d-c4ff-899a-79da-79764703422e-4703421c {
    justify-self: center;
  }

  #w-node-_565da8bc-df19-7576-cee6-b50f2a6dc655-e6b058c4, #w-node-_35a987ad-a930-0a0a-5ea8-f2edc14d1069-e6b058c4, #w-node-_2309e2c2-090b-5fd9-4053-343238b595d0-e6b058c4 {
    grid-area: span 1 / span 3 / span 1 / span 3;
  }
}

@media screen and (max-width: 767px) {
  #w-node-_8e9aaa5d-c4ff-899a-79da-79764703422e-4703421c {
    grid-area: span 1 / span 1 / span 1 / span 1;
    justify-self: center;
  }

  #w-node-_8e9aaa5d-c4ff-899a-79da-79764703423d-4703421c {
    grid-area: 4 / 1 / 5 / 2;
  }
}

@media screen and (max-width: 479px) {
  #w-node-_837906b7-65e2-65e5-2959-e6f05b442a36-8c10331b {
    align-self: center;
  }

  #w-node-_8e9aaa5d-c4ff-899a-79da-79764703422e-4703421c {
    grid-area: span 1 / span 1 / span 1 / span 1;
    justify-self: center;
  }

  #w-node-a89a5031-0ff7-675b-f7d6-29d42dd985eb-4703421c {
    justify-self: center;
  }

  #w-node-_565da8bc-df19-7576-cee6-b50f2a6dc655-e6b058c4, #w-node-_35a987ad-a930-0a0a-5ea8-f2edc14d1069-e6b058c4, #w-node-_2309e2c2-090b-5fd9-4053-343238b595d0-e6b058c4 {
    grid-area: span 1 / span 2 / span 1 / span 2;
  }
}