@charset "UTF-8";
/*
   If you are changing the location of these files,
   see the readme in this directory for more detail on manual steps to take when uploading new files.
 */
/*
   If you are changing the location of these files,
   see the readme in this directory for more detail on manual steps to take when uploading new files.
 */
/*
 * File is used in dashboard/app/assets/stylesheets/application.scss and pegasus/sites.v3/code.org/public/hourofcode/overview.haml
 * In order to add font to the Pegasus pages you should manually add this file to every page. In case you'll need
 * to add this font to many Pegasus page - you should probably think of other solution and not forget to update
  the Pegasus pages that were using font already.
 */
@font-face {
  font-family: 'Barlow Semi Condensed Semibold';
  font-style: normal;
  font-weight: 600;
  src: url("/fonts/barlowSemiCondensed/BarlowSemiCondensed-SemiBold.ttf") format("truetype"), local("?"); }
@font-face {
  font-family: 'Barlow Semi Condensed Medium';
  font-style: normal;
  font-weight: 500;
  src: url("/fonts/barlowSemiCondensed/BarlowSemiCondensed-Medium.ttf") format("truetype"), local("?"); }
/* This file is an adopted copy of apps/src/componentLibrary/typography/typography.module.scss.
   Updating styles in this file will require a manual sync with the that file.
*/
/* — example: all h3s in a ul need to look like h5s
    ul.icon-list {
      h3 { @include heading-sm }
    }
*/
h1,
.heading-xxl {
  color: #292F36;
  margin: 0 0 0.5em 0;
  font-family: "Barlow Semi Condensed Semibold", sans-serif;
  font-size: 3rem;
  line-height: 1.16; }

h2,
.heading-xl {
  color: #292F36;
  margin: 0 0 0.5em 0;
  font-family: "Barlow Semi Condensed Semibold", sans-serif;
  font-size: 2.125rem;
  line-height: 1.24; }

h3,
.heading-lg {
  color: #292F36;
  margin: 0 0 0.5em 0;
  font-family: "Barlow Semi Condensed Semibold", sans-serif;
  font-size: 1.75rem;
  line-height: 1.28; }

h4,
.heading-md {
  color: #292F36;
  margin: 0 0 0.5em 0;
  font-family: "Barlow Semi Condensed Medium", sans-serif;
  font-size: 1.5rem;
  line-height: 1.32; }

h5,
.heading-sm {
  color: #292F36;
  margin: 0 0 0.5em 0;
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1.25rem;
  line-height: 1.40; }

h6,
.heading-xs {
  color: #292F36;
  margin: 0 0 0.5em 0;
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 1rem;
  line-height: 1.48; }

.body-one {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-size: 1.25rem;
  line-height: 1.4; }

.body-two {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-size: 1rem;
  line-height: 1.48; }

.body-three {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-size: 0.875rem;
  line-height: 1.54; }

.body-four {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-size: 0.75rem;
  line-height: 1.64; }

.overline-one {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.04rem;
  font-size: 0.875rem;
  line-height: 1.6; }

.overline-two {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.04rem;
  font-size: 0.75rem;
  line-height: 1.64; }

.overline-three {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  text-transform: uppercase;
  letter-spacing: 0.04rem;
  font-size: 0.625rem;
  line-height: 1.76; }

strong,
.strong {
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal; }

.extra-strong {
  font-family: "Metropolis", sans-serif;
  font-weight: 700;
  font-style: normal; }

em,
.em {
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  font-style: italic; }

strong em,
em strong,
em.strong,
.strong em {
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-style: italic; }

em.extra-strong,
.extra-strong em {
  font-family: "Metropolis", sans-serif;
  font-weight: 700;
  font-style: normal;
  font-style: italic; }

figcaption,
.figcaption {
  font-family: "Metropolis", sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 0.875rem;
  margin: 0.5em 0 1em;
  line-height: 1.64; }

p {
  color: #292F36;
  font-family: "Metropolis", sans-serif;
  font-weight: 400;
  font-style: normal;
  margin-bottom: 1em;
  font-size: 1rem;
  line-height: 1.48; }

section.bg-neutral-light {
  background-color: var(--neutral_light); }

section.bg-neutral-dark {
  background-color: var(--neutral_dark); }

section.bg-secondary {
  background-color: var(--brand_secondary_light); }

section.bg-primary-light {
  background-color: rgba(171, 223, 229, 0.5); }
  section.bg-primary-light p {
    font-family: "Metropolis", sans-serif;
    font-weight: 600;
    font-style: normal; }
    section.bg-primary-light p.body-three {
      color: #292F36;
      font-family: "Metropolis", sans-serif;
      font-weight: 400;
      font-style: normal;
      margin-bottom: 1em;
      font-size: 0.875rem;
      line-height: 1.54; }
  section.bg-primary-light a {
    color: var(--neutral_dark) !important; }
    section.bg-primary-light a:hover {
      color: var(--brand_secondary_dark) !important; }
    section.bg-primary-light a.link-button {
      color: var(--neutral_white) !important; }

section.bg-pattern-dark {
  background: url("/images/banners/banner-bg-lines-neutral-dark.png") center repeat;
  background-size: 12rem;
  background-color: var(--neutral_dark); }

.container_responsive_full_width > .desktop-feature {
  display: none; }

.show-desktop {
  display: block; }
  @media (max-width: 1024px) {
    .show-desktop {
      display: none; } }

.show-tablet-and-mobile {
  display: none; }
  @media (max-width: 1024px) {
    .show-tablet-and-mobile {
      display: block; } }

.centered {
  text-align: center !important; }

.no-margin-bottom {
  margin-bottom: 0 !important; }

.no-padding-bottom {
  padding-bottom: 0 !important; }

i.fa-fw {
  line-height: 1.25em; }

.icon::before {
  display: inline-block;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased; }

.flex-container {
  display: flex; }
  .flex-container.flex-direction-column {
    flex-direction: column; }
  .flex-container.flex-direction-row {
    flex-direction: row; }
  .flex-container.justify-space-between {
    justify-content: space-between; }
  .flex-container.justify-center {
    justify-content: center; }
  .flex-container.justify-end {
    justify-content: end; }
  .flex-container.align-content-baseline {
    align-content: baseline; }
  .flex-container.align-items-center {
    align-items: center; }
  .flex-container.align-items-start {
    align-items: flex-start; }
  .flex-container.wrap {
    flex-wrap: wrap; }
  .flex-container.wrap-reverse {
    flex-wrap: wrap-reverse; }
  .flex-container.gap-1 {
    gap: 1rem; }
  .flex-container.gap-1-5 {
    gap: 1.5rem; }
  .flex-container.gap-2 {
    gap: 2rem; }

.grid-container {
  display: grid; }

div.divider {
  max-width: 960px;
  margin: 1rem auto 0; }
  @media screen and (max-width: 992px) {
    div.divider {
      padding: 0 2rem; } }
  div.divider hr {
    border: 0;
    border-top: 1px solid var(--neutral_dark60);
    margin: 0;
    width: 100%; }

.rounded-corners {
  border-radius: 4px; }

.has-border {
  border: 1px solid var(--neutral_dark10); }

.box-shadow-primary {
  box-shadow: 8px 8px 0 var(--brand_primary_light); }

hr {
  border-top: 1px solid var(--neutral_dark20);
  margin: 3rem 0; }
  hr.dark {
    border-top: 1px solid var(--neutral_dark60); }

.button-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem; }
  .button-wrapper.centered {
    justify-content: center; }

.hero-banner-basic {
  position: relative;
  overflow: hidden; }
  .hero-banner-basic .text-wrapper {
    position: relative;
    z-index: 1; }

ul {
  margin: 1rem; }
  ul li {
    line-height: 1.4;
    margin: 0.5rem 0; }
    ul li:before {
      color: var(--neutral_dark); }
    ul li p {
      color: #292F36;
      font-family: "Metropolis", sans-serif;
      font-weight: 400;
      font-style: normal;
      margin-bottom: 1em;
      font-size: 0.875rem;
      line-height: 1.54; }
      ul li p:last-child {
        margin-bottom: 0; }
  ul.clear-styles {
    margin: 0;
    padding: 0; }
    ul.clear-styles li {
      padding: 0;
      text-indent: 0; }
      ul.clear-styles li:before {
        content: ""; }
  ul.icon-bullet-list {
    margin: 1rem 0;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap; }
    ul.icon-bullet-list.full-width li {
      width: 100%; }
    ul.icon-bullet-list li {
      padding-left: 0 !important;
      text-indent: 0 !important;
      display: flex;
      width: 47%;
      margin: 1.5rem 0;
      gap: 1rem; }
      @media screen and (max-width: 640px) {
        ul.icon-bullet-list li {
          width: 100%; } }
      ul.icon-bullet-list li:before {
        content: none; }
      ul.icon-bullet-list li i {
        font-size: 2rem; }
      ul.icon-bullet-list li h3 {
        color: #292F36;
        margin: 0 0 0.5em 0;
        font-family: "Metropolis", sans-serif;
        font-weight: 600;
        font-style: normal;
        font-size: 1.25rem;
        line-height: 1.40;
        margin-bottom: 0.25rem; }
      ul.icon-bullet-list li p {
        color: #292F36;
        font-family: "Metropolis", sans-serif;
        font-weight: 400;
        font-style: normal;
        margin-bottom: 1em;
        font-size: 0.875rem;
        line-height: 1.54; }
  ul.link-list {
    margin: 2rem 0 0;
    display: flex;
    justify-content: start;
    flex-wrap: wrap;
    gap: 1rem 3rem; }
    ul.link-list li {
      text-indent: 0 !important;
      padding: 0;
      display: flex;
      gap: 0 0.5rem; }
      ul.link-list li::before {
        content: none; }
      ul.link-list li i {
        font-size: 1.25em; }
        ul.link-list li i:before {
          color: var(--brand_secondary_default);
          transition: color ease-in-out .2s; }
      ul.link-list li a {
        color: #292F36;
        margin: 0 0 0.5em 0;
        font-family: "Metropolis", sans-serif;
        font-weight: 600;
        font-style: normal;
        font-size: 1rem;
        line-height: 1.48;
        color: var(--brand_secondary_default);
        margin-bottom: 0; }
        ul.link-list li a:hover {
          color: var(--brand_secondary_dark); }
      ul.link-list li:hover i:before {
        color: var(--brand_secondary_dark); }
  ul.progressive-list {
    margin: 3rem 0 0;
    display: grid;
    grid-gap: 1.5rem; }
    @media screen and (min-width: 1024px) {
      ul.progressive-list.three-col {
        grid-template-columns: repeat(3, 1fr); } }
    ul.progressive-list li {
      position: relative;
      text-indent: 0 !important;
      margin: 1.5rem 0;
      padding: 1.25rem 1.25rem 1.35rem;
      background: var(--neutral_light);
      border-radius: 4px; }
      ul.progressive-list li:before {
        content: "";
        position: absolute;
        top: -10px;
        left: 1.25rem;
        border-bottom: 10px solid var(--neutral_light);
        border-left: 8px solid transparent;
        border-right: 8px solid transparent; }
      ul.progressive-list li span {
        position: absolute;
        top: -1.5rem;
        left: 0;
        width: 100%;
        height: 0.5rem;
        border-radius: 1rem; }
      ul.progressive-list li:nth-of-type(1) span {
        background: var(--brand_primary_light); }
      ul.progressive-list li:nth-of-type(2) span {
        background: var(--brand_primary_default);
        opacity: 0.75; }
      ul.progressive-list li:nth-of-type(3) span {
        background: var(--brand_primary_dark); }
      ul.progressive-list li h3 {
        color: #292F36;
        margin: 0 0 0.5em 0;
        font-family: "Metropolis", sans-serif;
        font-weight: 600;
        font-style: normal;
        font-size: 1.25rem;
        line-height: 1.40; }
  ul.supporters-list {
    margin: 3rem auto;
    display: grid;
    justify-items: center;
    gap: 1.5rem; }
    @media screen and (min-width: 640px) {
      ul.supporters-list {
        grid-template-columns: repeat(2, 1fr); } }
    @media screen and (min-width: 992px) {
      ul.supporters-list {
        grid-template-columns: repeat(3, 1fr); } }
    ul.supporters-list li {
      all: unset;
      text-align: center; }
      ul.supporters-list li:before {
        content: ""; }

ol.steps-list {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: baseline;
  margin: unset;
  padding: unset; }
  ol.steps-list.four-col li {
    width: 20%; }
    @media screen and (max-width: 640px) {
      ol.steps-list.four-col li {
        width: 100%; } }
  ol.steps-list.three-col li {
    width: 28%; }
    @media screen and (max-width: 640px) {
      ol.steps-list.three-col li {
        width: 100%; } }
  ol.steps-list li {
    padding-left: 0 !important;
    text-indent: 0 !important;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    text-align: center;
    margin: 3rem 0 2.5rem; }
    ol.steps-list li a.link-button,
    ol.steps-list li button,
    ol.steps-list li .btn {
      min-width: unset; }
  ol.steps-list h3 {
    width: 100%; }
    ol.steps-list h3 > span {
      background: var(--neutral_white);
      display: block;
      width: 2em;
      height: 2em;
      margin: 0 auto 0.5rem;
      line-height: 1.7;
      border: 2px solid;
      border-radius: 100%;
      position: relative; }
      ol.steps-list h3 > span::before {
        content: "";
        position: absolute;
        top: -8px;
        right: -8px;
        bottom: -8px;
        left: -8px;
        border: 6px solid var(--brand_primary_light);
        border-radius: 100%; }
  ol.steps-list h4 {
    color: #292F36;
    margin: 0 0 0.5em 0;
    font-family: "Metropolis", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1.25rem;
    line-height: 1.40;
    width: 100%; }
  ol.steps-list p {
    color: #292F36;
    font-family: "Metropolis", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 1em;
    font-size: 0.875rem;
    line-height: 1.54; }

details {
  padding: 1.5rem 1rem 1rem;
  border-bottom: 1px solid var(--neutral_dark80);
  transition: background ease-in-out .2s; }
  details:hover {
    background: var(--neutral_light); }
  details summary {
    color: #292F36;
    margin: 0 0 0.5em 0;
    font-family: "Metropolis", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1rem;
    line-height: 1.48;
    display: flex;
    justify-content: space-between;
    align-items: end; }
    @media screen and (max-width: 640px) {
      details summary {
        align-items: baseline; } }
    details summary:hover {
      cursor: pointer; }
  details summary::marker {
    content: ""; }
  details summary::-webkit-details-marker {
    display: none; }
  details summary::after {
    font: var(--fa-font-solid);
    content: "\f107"; }
  details[open] summary::after {
    font: var(--fa-font-solid);
    content: "\f106"; }
  details p {
    color: #292F36;
    font-family: "Metropolis", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 1em;
    font-size: 0.875rem;
    line-height: 1.54; }

form label {
  display: block;
  text-align: left;
  font-size: 1rem;
  font-weight: var(--semi-bold-font-weight); }
form input[type="text"], form select {
  display: block;
  width: 100%;
  margin: .25rem auto 1.5rem;
  padding: 0.5rem;
  border: 1px solid;
  border-radius: 4px;
  font-family: var(--main-font);
  font-weight: var(--regular-font-weight);
  font-size: 1rem;
  transition: all ease-in-out .2s; }
  form input[type="text"]:focus, form select:focus {
    outline: var(--brand_primary_default) solid 2px;
    outline-offset: 2px; }
form button, form[type=submit] {
  margin-top: 1rem; }
  @media screen and (max-width: 640px) {
    form button, form[type=submit] {
      width: 100%; } }
form .form-group {
  margin: 0; }
  form .form-group input[type="text"], form .form-group select {
    margin: 0; }
form select#professionalRoleSelect {
  margin: 0; }

.action-block__wrapper {
  margin-top: 2rem;
  display: grid;
  grid-gap: 1.5rem; }
  @media screen and (min-width: 640px) {
    .action-block__wrapper {
      grid-template-columns: repeat(2, 1fr); } }
  @media screen and (min-width: 1024px) {
    .action-block__wrapper.action-block__wrapper--three-col {
      grid-template-columns: repeat(3, 1fr); } }
  @media screen and (min-width: 1024px) {
    .action-block__wrapper.action-block__wrapper--four-col {
      grid-template-columns: repeat(4, 1fr); } }

.action-block {
  background: var(--neutral_light);
  border: 1px solid var(--neutral_dark20);
  border-radius: 4px;
  display: flex;
  align-content: baseline; }
  .action-block.white {
    background: var(--neutral_white); }
  .action-block .new {
    color: var(--neutral_white);
    background: var(--brand_accent_default);
    font-size: 0.75rem;
    font-family: var(--main-font);
    font-weight: var(--medium-font-weight);
    line-height: 1;
    letter-spacing: 1px;
    text-transform: uppercase;
    margin: -2px -8px 0 0;
    padding: 6px 8px 5px;
    border-radius: 1rem; }
  .action-block h3 {
    width: 100%;
    color: #292F36;
    margin: 0 0 0.5em 0;
    font-family: "Barlow Semi Condensed Medium", sans-serif;
    font-size: 1.5rem;
    line-height: 1.32; }
  .action-block p {
    color: #292F36;
    font-family: "Metropolis", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 1em;
    font-size: 0.875rem;
    line-height: 1.54; }
    .action-block p.overline {
      color: #292F36;
      font-family: "Metropolis", sans-serif;
      font-weight: 400;
      font-style: normal;
      margin-bottom: 1em;
      font-family: "Metropolis", sans-serif;
      font-weight: 600;
      font-style: normal;
      text-transform: uppercase;
      letter-spacing: 0.04rem;
      font-size: 0.75rem;
      line-height: 1.64;
      color: var(--brand_primary_default);
      width: 100%; }
  .action-block figure.video-responsive {
    margin-bottom: 1rem; }
  .action-block ul {
    margin: 0 1rem 1rem;
    color: #292F36;
    font-family: "Metropolis", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 1em;
    font-size: 0.875rem;
    line-height: 1.54; }
  .action-block.secondary h3 {
    color: #292F36;
    margin: 0 0 0.5em 0;
    font-family: "Metropolis", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1.25rem;
    line-height: 1.40; }
  .action-block .video_caption_link {
    display: none; }

.action-block--one-col {
  flex-wrap: wrap;
  flex-direction: column;
  padding: 1.25rem; }
  .action-block--one-col.flex-space-between {
    justify-content: space-between; }
  @media screen and (max-width: 992px) {
    .action-block--one-col {
      height: 100%; } }
  .action-block--one-col img {
    width: 100%;
    margin-bottom: 1rem; }
  .action-block--one-col a.link-button {
    width: 100%;
    text-align: center;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    margin: 1rem 0 0; }
  .action-block--one-col .videothumbnail {
    margin-bottom: 1rem; }
    .action-block--one-col .videothumbnail .thumbnail-wrapper .thumbnail-image {
      margin-bottom: 0; }
  .action-block--one-col .modal-body img {
    width: unset;
    margin-bottom: 0; }

.action-block--two-col {
  flex-wrap: wrap;
  overflow: hidden; }
  .action-block--two-col .media-wrapper > * {
    margin: 1.25rem;
    width: calc(100% - 1.25rem); }
    @media (max-width: 992px) {
      .action-block--two-col .media-wrapper > * {
        margin: 0;
        width: 100%; } }
  .action-block--two-col .media-wrapper.right > * {
    float: right; }
    html[dir="rtl"] .action-block--two-col .media-wrapper.right > * {
      float: left; }
  .action-block--two-col .text-wrapper {
    padding: 1rem 1.5rem; }
  .action-block--two-col h3 {
    color: #292F36;
    margin: 0 0 0.5em 0;
    font-family: "Metropolis", sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 1.25rem;
    line-height: 1.40; }
    .action-block--two-col h3.heading-md {
      color: #292F36;
      margin: 0 0 0.5em 0;
      font-family: "Barlow Semi Condensed Medium", sans-serif;
      font-size: 1.5rem;
      line-height: 1.32;
      font-weight: unset; }
  .action-block--two-col figure.video-responsive {
    margin: 0 !important;
    max-width: unset; }
    .action-block--two-col figure.video-responsive > div {
      border: 0; }
  @media screen and (max-width: 640px) {
    .action-block--two-col a.link-button, .action-block--two-col button {
      width: 100%;
      text-align: center; } }

.editorial-cards-wrapper {
  display: grid;
  margin-top: 4rem;
  gap: 2.5rem; }
  @media screen and (min-width: 640px) {
    .editorial-cards-wrapper {
      grid-template-columns: repeat(3, 1fr); } }
  .editorial-cards-wrapper .flex-container {
    gap: 1.5rem;
    flex-direction: column; }
    .editorial-cards-wrapper .flex-container.self-paced-english {
      gap: 1.3rem; }
      @media screen and (max-width: 992px) {
        .editorial-cards-wrapper .flex-container.self-paced-english {
          gap: 0; } }
  .editorial-cards-wrapper img {
    width: 12rem;
    height: 12rem;
    border-radius: 50%; }
  .editorial-cards-wrapper p {
    color: #292F36;
    font-family: "Metropolis", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 1em;
    font-size: 0.875rem;
    line-height: 1.54; }

.editorial-cards-wrapper-2x2 {
  display: grid;
  margin-top: 5rem;
  gap: 4rem; }
  @media screen and (min-width: 640px) {
    .editorial-cards-wrapper-2x2 {
      grid-template-columns: repeat(2, 1fr); } }
  .editorial-cards-wrapper-2x2 .flex-container {
    gap: 2rem; }
  .editorial-cards-wrapper-2x2 img {
    width: 8rem;
    height: 8rem;
    border-radius: 50%; }
  .editorial-cards-wrapper-2x2 p {
    color: #292F36;
    font-family: "Metropolis", sans-serif;
    font-weight: 400;
    font-style: normal;
    margin-bottom: 1em;
    font-size: 0.875rem;
    line-height: 1.54; }

.carousel-wrapper {
  margin: 2rem 0 0; }
  @media screen and (max-width: 640px) {
    .carousel-wrapper {
      padding-bottom: 1rem; } }
  .carousel-wrapper button.carousel__prev,
  .carousel-wrapper button.carousel__next {
    display: none !important; }
  @media screen and (min-width: 1280px) {
    .carousel-wrapper button.carousel__prev {
      position: absolute;
      left: -3.5rem; }
    .carousel-wrapper button.carousel__next {
      position: absolute;
      right: -3.5rem; }
    .carousel-wrapper button.carousel__prev,
    .carousel-wrapper button.carousel__next {
      display: block !important;
      top: calc(50% - 50px);
      background: none;
      border: none;
      transform: translateY(-50%);
      transition: .3s;
      padding: 0;
      width: 1.75rem; }
      .carousel-wrapper button.carousel__prev:hover,
      .carousel-wrapper button.carousel__next:hover {
        background: none;
        opacity: .8; }
      .carousel-wrapper button.carousel__prev img,
      .carousel-wrapper button.carousel__next img {
        width: 100%; } }
  .carousel-wrapper .carousel {
    overflow: hidden; }
    @media screen and (max-width: 992px) {
      .carousel-wrapper .carousel {
        height: unset !important;
        overflow: unset; } }
  .carousel-wrapper .slides.rtl {
    inset: 0 !important; }
  .carousel-wrapper .pagination {
    margin: 1rem 0 0 0; }
    @media screen and (max-width: 640px) {
      .carousel-wrapper .pagination {
        margin-top: 3rem; } }
    .carousel-wrapper .pagination.left-align {
      text-align: left; }
      @media screen and (max-width: 992px) {
        .carousel-wrapper .pagination.left-align {
          text-align: center; } }
      .carousel-wrapper .pagination.left-align a:first-child {
        margin-left: 0; }
    .carousel-wrapper .pagination a {
      background: var(--brand_primary_light); }
      .carousel-wrapper .pagination a.selected {
        background: var(--brand_primary_default); }
      .carousel-wrapper .pagination a:focus {
        outline: var(--brand_primary_default) solid 2px;
        outline-offset: 2px; }
        .carousel-wrapper .pagination a:focus:not(:focus-visible) {
          outline: none; }

.quotes-wrapper img {
  border-radius: 4px;
  width: 100%; }
  @media screen and (max-width: 992px) {
    .quotes-wrapper img {
      display: none; } }
  @media screen and (max-width: 640px) {
    .quotes-wrapper img {
      display: block;
      margin-bottom: 2rem; } }
.quotes-wrapper .carousel-wrapper .with-image {
  display: flex;
  justify-content: space-between;
  align-items: center; }
  @media screen and (max-width: 640px) {
    .quotes-wrapper .carousel-wrapper .with-image {
      justify-content: center;
      flex-wrap: wrap; } }
  .quotes-wrapper .carousel-wrapper .with-image img {
    width: 150px;
    height: 150px;
    margin-right: 3rem; }
    @media screen and (max-width: 992px) {
      .quotes-wrapper .carousel-wrapper .with-image img {
        display: block; } }
    @media screen and (max-width: 640px) {
      .quotes-wrapper .carousel-wrapper .with-image img {
        margin-right: 0; } }
.quotes-wrapper .carousel-wrapper p {
  font-size: 1.25rem; }
  .quotes-wrapper .carousel-wrapper p.quote-text {
    font-size: 1.5rem;
    line-height: 1.3; }
    .quotes-wrapper .carousel-wrapper p.quote-text:before, .quotes-wrapper .carousel-wrapper p.quote-text:after {
      font: var(--fa-font-solid);
      color: var(--brand_primary_default); }
    .quotes-wrapper .carousel-wrapper p.quote-text::before {
      content: "\f10d";
      margin: 0 4px 0 0; }
    .quotes-wrapper .carousel-wrapper p.quote-text::after {
      content: "\f10e";
      margin: 0 0 0 4px; }
.quotes-wrapper .carousel-wrapper span {
  color: var(--brand_accent_default);
  margin: 0 2px; }

.photo-carousel-wrapper .with-image {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 5rem; }
  @media screen and (max-width: 992px) {
    .photo-carousel-wrapper .with-image {
      gap: 3rem; } }
  @media screen and (max-width: 640px) {
    .photo-carousel-wrapper .with-image {
      justify-content: center;
      flex-wrap: wrap;
      gap: 1rem; } }
  .photo-carousel-wrapper .with-image img {
    width: 450px;
    height: auto;
    border-radius: 1rem; }
    @media screen and (max-width: 992px) {
      .photo-carousel-wrapper .with-image img {
        width: 300px; } }
    @media screen and (max-width: 640px) {
      .photo-carousel-wrapper .with-image img {
        width: 100%; } }
.photo-carousel-wrapper p {
  font-size: 1.25rem; }
  @media screen and (max-width: 992px) {
    .photo-carousel-wrapper p {
      margin-bottom: 1rem; } }
.photo-carousel-wrapper .pagination {
  margin-top: 2rem; }
  @media screen and (max-width: 992px) {
    .photo-carousel-wrapper .pagination {
      margin-top: 3rem; } }

section.quote {
  background: url("/images/banners/banner-bg-lines-neutral-dark.png") center repeat;
  background-size: 12rem;
  background-color: var(--neutral_dark); }
  section.quote p {
    font-size: 1.25rem;
    color: var(--neutral_white);
    font-family: var(--barlowSemiCondensed-medium); }
    section.quote p.quote-text {
      font-size: 1.35rem; }
      section.quote p.quote-text.large {
        font-size: 1.5rem; }
      section.quote p.quote-text:before, section.quote p.quote-text:after {
        font: var(--fa-font-solid);
        color: var(--brand_primary_default); }
      section.quote p.quote-text::before {
        content: "\f10d";
        margin: 0 8px 0 0; }
      section.quote p.quote-text::after {
        content: "\f10e";
        margin: 0 0 0 8px; }
  section.quote span {
    color: var(--brand_accent_default);
    margin: 0 2px; }

.video-series {
  display: grid;
  grid-gap: 1.5rem;
  margin-top: 2rem; }
  @media screen and (min-width: 640px) {
    .video-series {
      grid-template-columns: repeat(2, 1fr); } }
  .video-series > div.col-50 {
    padding: 0 !important;
    margin: 0 !important;
    width: 100%; }
  .video-series .video_caption_link {
    margin-bottom: 0; }

.blog-post-callout .wrapper {
  display: flex;
  justify-content: space-between;
  gap: 1rem; }
.blog-post-callout i {
  font-size: 2rem; }
.blog-post-callout .text-wrapper {
  width: 100%; }

.tabs-section {
  margin-top: 2rem;
  min-height: 408px; }
  .tabs-section nav {
    border-bottom: 6px solid var(--brand_primary_default);
    margin: 0 0 3rem;
    align-items: end;
    gap: 0.25rem; }
    .tabs-section nav button.tab {
      color: var(--neutral_dark);
      background: var(--neutral_white);
      border: 1px solid var(--neutral_dark20);
      border-bottom: 0;
      border-radius: 6px 6px 0 0;
      padding: 0.75rem 0.25rem 0.7rem;
      margin: 0;
      width: 11.75rem;
      cursor: pointer;
      white-space: normal;
      height: -webkit-fit-content;
      flex: 1; }
      .tabs-section nav button.tab:hover {
        background-color: var(--neutral_dark10); }
      .tabs-section nav button.tab.active, .tabs-section nav button.tab.active:focus:not(:focus-visible) {
        background-color: var(--brand_primary_default);
        color: var(--neutral_white);
        border-color: var(--brand_primary_default); }
      .tabs-section nav button.tab:focus {
        outline: unset;
        border-color: var(--brand_primary_default);
        background-color: var(--neutral_dark10);
        color: var(--neutral_dark); }
      .tabs-section nav button.tab.hide {
        display: none; }
  .tabs-section div.content {
    display: none; }
    .tabs-section div.content.show {
      display: initial; }
  .tabs-section .video_caption_link {
    margin-bottom: 0; }
  .tabs-section.show-tablet-and-mobile {
    height: unset !important;
    min-height: unset !important; }
    .tabs-section.show-tablet-and-mobile details {
      padding-left: 0;
      padding-right: 0; }
      .tabs-section.show-tablet-and-mobile details:hover {
        background: none; }
      .tabs-section.show-tablet-and-mobile details summary {
        color: #292F36;
        margin: 0 0 0.5em 0;
        font-family: "Barlow Semi Condensed Medium", sans-serif;
        font-size: 1.5rem;
        line-height: 1.32; }
    .tabs-section.show-tablet-and-mobile .flex-container {
      align-items: start;
      flex-direction: row-reverse;
      gap: 2rem; }
      @media screen and (max-width: 640px) {
        .tabs-section.show-tablet-and-mobile .flex-container {
          flex-wrap: wrap-reverse; } }
    .tabs-section.show-tablet-and-mobile figure {
      margin-bottom: 1rem; }
    .tabs-section.show-tablet-and-mobile h3 {
      display: none; }

.at-a-glance {
  background: var(--neutral_white);
  border: 1px solid var(--neutral_dark10);
  border-radius: 4px;
  padding: 1.5rem;
  display: grid; }
  .at-a-glance.two-col {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem; }
    @media screen and (max-width: 992px) {
      .at-a-glance.two-col {
        grid-template-columns: unset;
        gap: 1rem; } }
  .at-a-glance ul {
    margin: 0;
    gap: 1.25rem; }
    .at-a-glance ul li {
      all: unset;
      font-size: 1rem;
      margin: 0;
      display: flex;
      align-items: baseline;
      gap: 0.75rem; }
      .at-a-glance ul li:before {
        display: none; }
      .at-a-glance ul li p {
        color: #292F36;
        font-family: "Metropolis", sans-serif;
        font-weight: 400;
        font-style: normal;
        margin-bottom: 1em;
        font-size: 1rem;
        line-height: 1.48;
        margin-bottom: 0;
        width: 100%; }

.subscribe-form {
  background: url("/images/banners/banner-bg-lines-neutral-dark.png") center repeat;
  background-size: 22%;
  background-color: var(--neutral_dark);
  border-radius: 4px;
  padding: 2rem; }
  .subscribe-form.no-bg {
    background: none; }
  @media screen and (max-width: 992px) {
    .subscribe-form {
      gap: 1rem; } }
  @media screen and (max-width: 640px) {
    .subscribe-form {
      padding: 1rem;
      background-size: 50%; } }
  .subscribe-form .text-wrapper {
    width: 48%; }
    @media screen and (max-width: 992px) {
      .subscribe-form .text-wrapper {
        width: 100%; } }
    .subscribe-form .text-wrapper h2, .subscribe-form .text-wrapper p {
      color: var(--neutral_white); }
  .subscribe-form figure {
    background: var(--neutral_light);
    border-radius: 4px;
    padding: 1rem 0 0; }
    @media screen and (max-width: 640px) {
      .subscribe-form figure iframe {
        height: 500px !important; } }

.action-wrapper {
  background: url("/images/banners/banner-bg-lines-neutral-light.png") center repeat;
  background-size: 10rem;
  background-color: var(--brand_primary_default);
  border-radius: 4px;
  padding: 2rem; }

table {
  border: 1px solid var(--neutral_dark20);
  width: 100%; }
  table th {
    background-color: var(--neutral_light);
    border: 1px solid var(--neutral_dark20);
    color: var(--neutral_dark);
    font-size: 1rem;
    font-weight: var(--semi-bold-font-weight);
    text-align: initial; }
  table td {
    border: 1px solid var(--neutral_dark20); }

/*# sourceMappingURL=design-system-pegasus.css.map */