@import url("../setup/variables.css?v=1.6");
@import url("../setup/general.css?v=1.6");
@import url("../setup/skeleton-loader.css?v=1.6");
/* components */
@import url("../components/navigation.css?v=1.6");
@import url("../components/header.css?v=1.6");
@import url("../components/footer.css?v=1.6");
@import url("../components/cards.css?v=1.6");
@import url("../components/profile.css?v=1.6");
@import url("../components/lesson.css?v=1.6");
@import url("../components/quiz.css?v=1.6");
@import url("../components/learning-path.css?v=1.6");
@import url("../components/course-detail.css?v=1.6");
@import url("../components/banner.css?v=1.6");
/* pages */
@import url("../pages/courses.css?v=1.6");
@import url("../pages/learning-paths.css?v=1.6");
@import url("../pages/path-detail.css?v=1.6");


:root {
    --ctaGreen: rgb(0, 130, 70);
    --ctaHover: rgb(12, 95, 52);
    --cta-hover: var(--ctaHover);
    --theme-link: var(--green);
}

.link-button.link-button-full.link-button--blue {
    background-color: rgb(var(--blue-rgb));
}

.link-button.link-button--full.link-button--blue:hover {
    background-color: rgb(var(--light-blue-rgb));
}

.link-button.link-button--blue:not(.link-button--full) {
    color: rgb(var(--blue-rgb));
}

/*@import url("./setup/font.css");*/
/*@import url("./setup/typography.css");*/

.mobile {
    display: block !important;
}

.desktop {
    display: none !important;
}

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

    .desktop {
        display: block !important;
    }
}

input[type='radio'],
input[type='checkbox'] {
    width: auto;
}

.relative {
    position: relative;
}

.float-right {
    float: right;
}

.display-flex {
    display: flex;
}

.text-center {
    text-align: center;
}

.row-center {
    align-items: center;
}

.vertical-center {
    position: relative;
    transform: translateY(-50%);
    top: 50%;
}

/*.wrapper {*/
/*  max-width: 1400px;*/
/*  margin: 0 auto;*/
/*  padding: 0 2rem;*/
/*}*/

.form-error {
    margin-top: 1rem;
    color: #dc3545;
}

.hide {
    display: none;
}

.backdrop {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
}

@keyframes rotate {
    to {
        transform: rotate(360deg);
    }
}

.spinner {
    display: inline-block;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    box-shadow: inset -1px 0 0 1px #599900;
    animation: rotate 1.5s linear infinite;
}

/* BUTTONS */

/*[class^='btn'] {*/
/*  position: relative;*/
/*  display: inline-block;*/
/*  min-width: 8rem;*/
/*  padding: 0.35rem 1.5rem;*/
/*  border: none;*/
/*  border-radius: 8rem;*/
/*  background: #1e1f1c;*/
/*  color: #fff;*/
/*  text-align: center;*/
/*  font-size: inherit;*/
/*  font-weight: bold;*/
/*  line-height: inherit;*/
/*  cursor: pointer;*/
/*  transition: background-color 200ms, color 200ms;*/
/*}*/

/*.btn-2 {*/
/*  background: #599900;*/
/*}*/

/*.btn-3 {*/
/*  background: #fff;*/
/*  border: 1px solid;*/
/*  color: #1e1f1c;*/
/*}*/

/*.btn-small {*/
/*  display: block;*/
/*  padding: 0.3rem 0.8rem;*/
/*  font-size: 0.8rem;*/
/*  min-width: auto;*/
/*  background: transparent;*/
/*  border: 1px solid #1e1f1c;*/
/*  color: #1e1f1c;*/
/*}*/

/* TOP */

/*.platform-switcher {*/
/*  position: relative;*/
/*  display: inline-block;*/
/*  margin-right: 0.5rem;*/
/*  z-index: 10;*/
/*}*/

/*.platform-switcher svg {*/
/*  width: 0.5rem;*/
/*  height: 0.5rem;*/
/*  margin-left: 0.5rem;*/
/*}*/

/*.platform-switcher button {*/
/*  padding: 0.5rem 1rem;*/
/*  border-radius: 1rem;*/
/*  border: 1px solid #e7e7e7;*/
/*  color: #525252;*/
/*  background: #f5f5f5;*/
/*}*/

/*.platform-switcher.show button svg {*/
/*  transform: rotate(180deg);*/
/*}*/

/*.platform-switcher ul {*/
/*  position: absolute;*/
/*  top: 100%;*/
/*  left: 0;*/
/*  height: 0;*/
/*  width: 12rem;*/
/*  margin: 0;*/
/*  padding: 0;*/
/*  list-style: none;*/
/*  overflow: hidden;*/
/*  background: #f5f5f5;*/
/*  border-radius: 1rem;*/
/*  border: 1px solid #e7e7e7;*/
/*}*/

/*.platform-switcher.show ul {*/
/*  height: auto;*/
/*}*/

/*.platform-switcher li {*/
/*  padding: 0.5rem 1rem;*/
/*  color: #525252;*/
/*}*/

/*.platform-switcher li:first-child {*/
/*  cursor: pointer;*/
/*}*/

/*.platform-switcher a {*/
/*  color: #525252;*/
/*}*/

/*.platform-switcher a svg {*/
/*  transform: rotate(-90deg);*/
/*}*/


/*.top {*/
/*  display: flex;*/
/*  flex-wrap: wrap;*/
/*  align-items: center;*/
/*  justify-content: space-between;*/
/*  padding: 2rem 0;*/
/*}*/

/*.logo {*/
/*  display: block;*/
/*  max-width: 10rem;*/
/*}*/

/*.top-link {*/
/*  margin: 0 0.3rem;*/
/*  padding: 0.35rem 0.89rem;*/
/*  color: inherit;*/
/*  font-weight: bold;*/
/*  width: auto;*/
/*  font-size: 0.85rem;*/
/*  border-radius: 1.4rem;*/
/*}*/

/*#profile,*/
/*#logout {*/
/*  min-width: auto;*/
/*  padding: 0.35rem 0.89rem;*/
/*  font-size: 0.85rem;*/
/*  border-radius: 1.4rem;*/
/*}*/

.trigram {
    min-width: auto;
    padding: 0.4rem 1rem;
}

.trigram-switcher {
    display: none;
    background: #fff;
    border-radius: 5px;
    z-index: 1;
    box-shadow: 0 0 15px -5px rgba(0, 0, 0, 0.2);
}

.trigram-switcher .top-link {
    display: block;
}

.trigram-switcher.show {
    display: block;
    position: absolute;
    top: calc(100% + 5px);
    right: 0;
}

/* HEADER */

/*.header-img {*/
/*  border-radius: 1rem;*/
/*}*/

/*.header-with-img h1 {*/
/*  position: absolute;*/
/*  top: 1rem;*/
/*  left: 2rem;*/
/*  color: #fff;*/
/*  max-width: calc(8 / 12 * 100% - 1rem);*/
/*}*/

/*footer {*/
/*  margin-top: 4rem;*/
/*  padding: 2rem 0;*/
/*  border-top: 1px solid #eef0ed;*/
/*}*/

/*.footer-grid {*/
/*  display: grid;*/
/*  justify-content: space-between;*/
/*  align-items: center;*/
/*  gap: 1rem;*/
/*}*/

/*@media (min-width: 800px) {*/
/*  .footer-grid {*/
/*    grid-template-columns: max-content max-content max-content;*/
/*  }*/
/*}*/

/*.contact {*/
/*  font-family: 'NationalCompressed';*/
/*  font-weight: bold;*/
/*  font-size: 3rem;*/
/*  margin-bottom: 4rem;*/
/*}*/

/*.contact a {*/
/*  display: block;*/
/*  font-weight: normal;*/
/*}*/

/*.socials,*/
/*.additional-links {*/
/*  display: flex;*/
/*  align-items: center;*/
/*}*/

/*@media (min-width: 800px) {*/
/*  .footer-grid {*/
/*    justify-content: space-between;*/
/*  }*/
/*}*/

/*.socials {*/
/*  margin: 0;*/
/*  padding: 0;*/
/*  list-style: none;*/
/*  gap: 0.5rem;*/
/*}*/

/*.socials li {*/
/*  width: 1.5rem;*/
/*}*/

/*.additional-links {*/
/*  margin: 0;*/
/*  padding: 0;*/
/*  list-style: none;*/
/*  font-size: 0.8rem;*/
/*  gap: 1rem;*/
/*}*/

/*.additional-links a {*/
/*  color: #1e1f1c;*/
/*}*/

/*.additional-links picture {*/
/*  display: inline-block;*/
/*  width: 1rem;*/
/*  margin-right: 0.1rem;*/
/*  vertical-align: middle;*/
/*}*/

/*.copy {*/
/*  margin-top: 2rem;*/
/*  padding-top: 2rem;*/
/*  border-top: 1px solid #e9ebe8;*/
/*  font-size: 0.8rem;*/
/*}*/

/*.component {*/
/*  margin-bottom: 2rem;*/
/*}*/

/*.box {*/
/*  position: relative;*/
/*  padding: 2rem;*/
/*  border-radius: 0.5rem;*/
/*  background: #e9eae8;*/
/*  color: #1e1f1c;*/
/*}*/

/*.box a h3 {*/
/*  color: #1e1f1c;*/
/*  text-decoration: none;*/
/*}*/

/*.box-img {*/
/*  margin: -2rem -2rem 2rem;*/
/*  background-size: cover;*/
/*  background-position: 50%;*/
/*  height: 170px;*/
/*  border-top-right-radius: 0.5rem;*/
/*  border-top-left-radius: 0.5rem;*/
/*}*/

/*@media (min-width: 1250px) {*/
/*  .box-img {*/
/*    height: 200px;*/
/*  }*/
/*}*/

/*.tags {*/
/*  display: flex;*/
/*  flex-wrap: wrap;*/
/*  gap: 0.5rem;*/
/*  list-style: none;*/
/*  padding-left: 0;*/
/*  font-size: 0.8rem;*/
/*}*/

/*.tags a {*/
/*  display: inline-block;*/
/*  padding: 0.3rem 0.8rem;*/
/*  border-radius: 10rem;*/
/*  border: 1px solid #bbb;*/
/*  color: inherit;*/
/*}*/

/*.tags .free a {*/
/*  background: #599900;*/
/*  color: #fff;*/
/*}*/

/*.tags .archived a {*/
/*  background: grey;*/
/*  color: #fff;*/
/*}*/

/* LOGIN */
.login {
    max-width: 30rem;
    margin: 0 auto;
}

/* LESSON */

/*.search {*/
/*  display: block;*/
/*  margin: 0 auto 4rem;*/
/*  max-width: 30rem;*/
/*  border-width: 0 0 1px;*/
/*  border-radius: 0;*/
/*  font-family: 'NationalCompressed';*/
/*  font-size: 2rem;*/
/*}*/

/* #courses {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 2rem;
} */

.course-top {
    background-color: #082260;
    height: 40%;
    padding: 25px;
    background-size: cover;
}

.course-bottom {
    background-color: #e3dddd;
    color: black;
    padding: 25px;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
}


/*
* COMPONENTS
*/

/*.components {*/
/*  max-width: 1200px;*/
/*  margin: 4rem auto 0;*/
/*}*/

/* CODE */
/*.code {*/
/*  padding: 1rem;*/
/*  background: #f5f5f5;*/
/*  overflow: auto;*/
/*}*/

/* FILE */
.file {
    display: inline-block;
    margin-right: 0.5rem;
    padding: 1rem;
    background: #f5f5f5;
}

.file i {
    margin-right: 0.5rem;
    vertical-align: middle;
    font-size: 2rem;
}

/* VIDEO */
/*.video {*/
/*  padding: 1rem;*/
/*}*/

.video-btn {
    margin-top: 1rem;
    text-align: right;
}

.video-btn button {
    position: relative;
    background: none;
    border: none;
    cursor: pointer;
}

.video-transcript {
    height: 0;
    font-style: italic;
    overflow: hidden;
}

.show-transcript .video-transcript {
    height: auto;
    padding: 1rem;
}

/*.show-transcript svg {*/
/*  transform: rotate(180deg);*/
/*}*/

.course-button {
    background-color: black;
    border: none;
    color: white;
    padding: 8px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    border-radius: 8px;
    width: 180px;
}

/* BANNER */

/*.banner {*/
/*  position: relative;*/
/*  padding: 4rem 2rem;*/
/*  border-radius: 1rem;*/
/*  overflow: hidden;*/
/*  text-align: center;*/
/*  color: #fff;*/
/*  background-repeat: no-repeat;*/
/*  background-position: 50%;*/
/*  background-size: cover;*/
/*}*/

/* QUIZ */
/*.quiz {*/
/*  padding-bottom: 2rem;*/
/*  border-bottom: 1px solid #e9eae8;*/
/*}*/

/*.chevron {*/
/*  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M8 13.1l-8-8 2.1-2.2 5.9 5.9 5.9-5.9 2.1 2.2z'/%3E%3C/svg%3E");*/
/*}*/

/* ACCORDION */
/*.accordion-item {*/
/*  margin-bottom: 1rem;*/
/*}*/

/*.accordion-title {*/
/*  position: relative;*/
/*  padding: 0 3rem 0 1rem;*/
/*  font-family: 'NationalCompressed';*/
/*  font-size: 1.7rem;*/
/*  cursor: pointer;*/
/*}*/

/*.accordion-title .chevron {*/
/*  display: block;*/
/*  position: absolute;*/
/*  top: 50%;*/
/*  right: 1rem;*/
/*  height: 0.6rem;*/
/*  width: 0.6rem;*/
/*}*/

/*.accordion-item.show .accordion-title span {*/
/*  transform: rotate(180deg);*/
/*}*/

/*.accordion-title:after {*/
/*  position: absolute;*/
/*  top: 100%;*/
/*  left: 0;*/
/*  content: '';*/
/*  width: 100%;*/
/*  height: 5px;*/
/*  border: 1px solid;*/
/*  border-width: 0 1px 1px 1px;*/
/*  opacity: 0.3;*/
/*  transition: all 200ms;*/
/*}*/

/*.accordion-item.show .accordion-title:after {*/
/*  opacity: 1;*/
/*}*/

/*.accordion-richText {*/
/*  height: 0;*/
/*  transform: scaleY(0);*/
/*  transform-origin: top;*/
/*  transition: all 200ms;*/
/*  padding: 1rem;*/
/*  opacity: 0;*/
/*}*/

/*.accordion-item.show .accordion-richText {*/
/*  height: auto;*/
/*  transform: scaleY(1);*/
/*  opacity: 1;*/
/*}*/

/* CKEDITOR */

[class*='alert-'] {
    padding: 1rem;
    margin: 1rem 0;
    border: 1px solid;
    border-radius: 4px;
}

.alert-blue {
    background: #d0e1ff;
    border-color: #b6d4fe;
    color: #084298;
}

.alert-green {
    background: #d1e7dd;
    border-color: #badbcc;
    color: #0f5132;
}

.alert-red {
    background: #f8d7da;
    border-color: #f5c2c7;
    color: #842029;
}

.alert-yellow {
    background: #fff3cd;
    border-color: #ffecb5;
    color: #664d03;
}

.quote {
    padding: 1rem;
    margin: 1rem 0;
    border-left: 0.5rem solid #ddd;
}

/*@media (hover: hover) {*/
/*  a:hover,*/
/*  button.a:hover {*/
/*    color: #1e1f1c;*/
/*    cursor: pointer;*/
/*  }*/

/*  .btn:hover {*/
/*    background: #599900;*/
/*    color: #fff;*/
/*    text-decoration: none;*/
/*  }*/

/*  .btn-2:hover {*/
/*    background: #1e1f1c;*/
/*    color: #fff;*/
/*  }*/

/*  .btn-3:hover {*/
/*    background: #1e1f1c;*/
/*    color: #fff;*/
/*  }*/

/*  .platform-switcher button:hover {*/
/*    cursor: pointer;*/
/*  }*/

/*  .platform-switcher a:hover span {*/
/*    text-decoration: underline;*/
/*  }*/

/*  .top-link:hover {*/
/*    background: #e9ebe8;*/
/*  }*/

/*  .box a:hover h3 {*/
/*    text-decoration: underline;*/
/*  }*/

/*  .tags a:hover {*/
/*    background: #c8c8c7 !important;*/
/*    color: inherit !important;*/
/*  }*/

/*  .icon:hover + .tooltip {*/
/*    display: block;*/
/*  }*/

/*  .course-button:hover {*/
/*    background-color: #ffffff;*/
/*  }*/

/*  .accordion-title:hover:after {*/
/*    opacity: 1;*/
/*  }*/

/*  .save-for-later:hover {*/
/*    cursor: pointer;*/
/*    background-color: #599900;*/
/*  }*/

/*  .save-for-later-icon:hover {*/
/*    cursor: pointer;*/
/*    color: #599900;*/
/*  }*/

/*  .save-for-later-delete:hover {*/
/*    background-color: #842029;*/
/*    border: 1px solid #f5c2c7;*/
/*    color: #f8d7da;*/
/*    cursor: pointer;*/
/*  }*/
/*}*/