@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@400;700&display=swap");

:root {
  --shadow-color: 210deg 6% 6%;
  --shadow-elevation-low: 0px 0.4px 0.5px hsl(var(--shadow-color) / 0.2), 0px 0.5px 0.6px -1.2px hsl(var(--shadow-color) / 0.2),
    0px 1.2px 1.3px -2.5px hsl(var(--shadow-color) / 0.2);
  --shadow-elevation-medium: 0px 0.4px 0.5px hsl(var(--shadow-color) / 0.21), 0px 1px 1.1px -0.8px hsl(var(--shadow-color) / 0.21),
    0px 2.4px 2.7px -1.7px hsl(var(--shadow-color) / 0.21), 0.1px 5.8px 6.5px -2.5px hsl(var(--shadow-color) / 0.21);
  --shadow-elevation-high: 0px 0.4px 0.5px hsl(var(--shadow-color) / 0.19), 0px 1.4px 1.6px -0.4px hsl(var(--shadow-color) / 0.19),
    0px 2.5px 2.8px -0.7px hsl(var(--shadow-color) / 0.19), 0.1px 4px 4.5px -1.1px hsl(var(--shadow-color) / 0.19), 0.1px 6.2px 7px -1.4px hsl(var(--shadow-color) / 0.19),
    0.2px 9.6px 10.8px -1.8px hsl(var(--shadow-color) / 0.19), 0.2px 14.6px 16.4px -2.1px hsl(var(--shadow-color) / 0.19),
    0.4px 21.4px 24.1px -2.5px hsl(var(--shadow-color) / 0.19);
}

.pink {
  color: #ffaac2;
}

.pink--border {
  border-color: #ffaac2;
}

.yellow {
  color: #fff111 !important;
}

.yellow--border {
  border-color: #fff111 !important;
}

.orchid {
  color: #bf66fe !important;
}

.orchid--border {
  border-color: #bf66fe !important;
}

.blue-light {
  color: #46edff !important;
}

.blue-light--border {
  border-color: #46edff !important;
}

.turquoise {
  color: #1cffc5 !important;
}

.turquoise--border {
  border-color: #1cffc5 !important;
}

.han-purple {
  color: #6320ee !important;
}

.han-purple--border {
  border-color: #6320ee !important;
}

.magneta {
  color: #fc3186 !important;
}

.magneta--border {
  border-color: #fc3186 !important;
}

.lime {
  color: #e4ff71 !important;
}

.lime--border {
  border-color: #e4ff71 !important;
}

.orange {
  color: #fd9206 !important;
}

.orange--border {
  border-color: #fd9206 !important;
}

.green {
  color: #0eb152 !important;
}

.green--border {
  border-color: #0eb152 !important;
}

/* .container {
  width: auto;
  padding-right: var(--bs-gutter-x, 0.75rem);
  padding-left: var(--bs-gutter-x, 0.75rem);
  margin-right: auto;
  margin-left: auto;
} */
/* 
@media (min-width: 320px) {
  .container {
    max-width: 95%;
  }
}

@media (min-width: 576px) {
  .container {
    max-width: 540px;
  }
}

@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
}

@media (min-width: 992px) {
  .container {
    max-width: 960px;
  }
}

@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
} */

/* .container-fluid {
    width: auto;
    padding-right: var(--bs-gutter-x, 0.75rem);
    padding-left: var(--bs-gutter-x, 0.75rem);
    margin-right: 0;
    margin-left: 0;
} */

/* .row {
    --bs-gutter-x: 1.5rem;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1 * var(--bs-gutter-y));
    margin-right: calc(-0.5 * var(--bs-gutter-x));
    margin-left: calc(-0.5 * var(--bs-gutter-x));
} */

/* .row > * {
        box-sizing: border-box;
        flex-shrink: 0;
        width: 100%;
        max-width: 100%;
        padding-right: calc(var(--bs-gutter-x) * 0.5);
        padding-left: calc(var(--bs-gutter-x) * 0.5);
        margin-top: var(--bs-gutter-y);
    }

.col {
    flex: 1 0 0%;
} */

/* * ::-webkit-scrollbar {
  width: 9px;
  border-radius: 0px;
}

* ::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px transparent;
  border-radius: 0px;
}

* ::-webkit-scrollbar-thumb {
  background: rgba(49, 51, 54, 0.5);
}

* ::-webkit-scrollbar-thumb:hover {
  background: #bb052c;
} */

/* body,
main {
  letter-spacing: 0px;
  width: 100%;
  height: 100%;
  padding: 0;
  font-size: 100%;
  font-family: "Raleway", sans-serif;
  overflow-x: hidden;
  overflow-y: overlay;
  background-color: #1c1d20;
  background-attachment: fixed;
  background-repeat: no-repeat;
} */

a {
  text-decoration: none;
}
/* 
.btn {
  height: 35px;
  text-decoration: none;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  font-weight: 300;
  color: #ccd2d8;
  text-align: center;
  justify-content: center;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid #bb052c;
  padding: 0px 15px;
  font-size: 0.8rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}

.btn .im {
  font-size: 1rem;
  margin: 2px 10px 0px 0;
}

.btn a {
  text-decoration: none;
} */

/* @media (prefers-reduced-motion: reduce) {
  .btn {
    transition: none;
  }
} */

.btn-primary {
  outline: none;
  color: #ccd2d8;
  background-color: #bb052c;
  border-color: #bb052c !important;
  border-width: 1px;
  border-style: solid;
  border-radius: 2px;
}

.btn-primary:hover {
  background-color: #a20426 !important;
  border-width: 1px;
  border-style: solid;
}

.btn-primary:active {
  color: #ccd2d8 !important;
  background-color: #d40632 !important;
  border-color: transparent !important;
}

.btn-primary-small {
  min-width: 80px;
  padding: 0 5px;
  height: 25px;
  outline: none;
  font-size: 0.6rem;
  color: #ccd2d8;
  background-color: #bb052c;
  border-color: transparent;
  border-width: 1px;
  border-style: solid;
  border-radius: 2px;
}

.btn-primary-small:hover {
  background-color: #a20426;
  border-color: transparent;
  border-width: 1px;
  border-style: solid;
}

.btn-primary-small:active {
  color: #ccd2d8;
  background-color: #d40632;
  border-color: transparent;
}

.btn-primary-small .im {
  font-size: 1rem;
  margin-right: 10px;
}

.btn-save-small {
  min-width: 80px;
  padding: 0 5px;
  height: 25px;
  outline: none;
  font-size: 0.6rem;
  color: #fff;
  background-color: #31992e;
  border-color: transparent;
  border-width: 1px;
  border-style: solid;
  border-radius: 2px;
}

.btn-save-small:hover {
  background-color: rgba(49, 153, 46, 0.8);
  border-color: transparent;
  border-width: 1px;
  border-style: solid;
}

.btn-save-small:active {
  background-color: #31992e;
  border-color: transparent;
}

.btn-save-small .im {
  font-size: 1rem;
  margin-right: 10px;
}

.btn-light-small {
  min-width: 80px;
  padding: 0 5px;
  height: 25px;
  outline: none;
  font-size: 0.6rem;
  color: #ccd2d8;
  background-color: transparent;
  border-color: #3f4144;
  border-width: 1px;
  border-style: solid;
  border-radius: 2px;
}

.btn-light-small:hover {
  background-color: rgba(63, 65, 68, 0.3);
  border-width: 1px;
  border-style: solid;
}

.btn-light-small:active {
  color: #ccd2d8;
  background-color: rgba(63, 65, 68, 0.5);
}

.btn-light-small .im {
  font-size: 1rem;
  margin-right: 10px;
}

.btn-save {
  outline: none;
  color: #ccd2d8;
  background-color: #31992e;
  border-color: transparent;
  border-width: 1px;
  border-style: solid;
  border-radius: 2px;
}

.btn-save:hover {
  background-color: #2d8d2a;
  border-color: transparent;
  border-width: 1px;
  border-style: solid;
}

.btn-save:active {
  color: #ccd2d8;
  background-color: #2b8528;
  border-color: transparent;
}

/* input {
  display: block;
  background-color: #313336 !important;
  box-sizing: border-box;
  font-size: 0.9rem;
  padding: 0 0.5rem;
  color: #ccd2d8;
  outline: none;
  border-width: 0px;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #3f4144 !important;
  margin: 0px 0 0 0;
  height: 40px;
  width: 100%;
  border-radius: 2px;
}

input:hover {
  transition: none !important;
} */

/* ::-moz-placeholder {
  color: #787d81;
  opacity: 1;
}

::placeholder {
  color: #787d81;
  opacity: 1;

} */

/* -------------------------------------------------------------------------- */
/*                               STYLE Textarea                               */
/* -------------------------------------------------------------------------- */
textarea {
  width: 100%;
  font-size: 0.9rem;
  display: block;
  background-color: #313336;
  padding: 10px;
  color: #ccd2d8;
  overflow: auto;
  outline: none;
  box-shadow: none;
  border-width: 1px;
  border-style: solid;
  border-color: #3f4144;
  resize: none;
  box-sizing: border-box;
  border-radius: 2px;
}

.pointer-none {
  pointer-events: none !important;
}

.pointer-all {
  pointer-events: all !important;
}

.input-validation-error {
  color: #dd0333 !important;
}

.field-validation-error {
  color: #dd0333 !important;
}

/* .footer li a,
.footer-t li a,
.overlay li a {
  text-decoration: none;
  list-style: none;
} */

.transparent {
  position: fixed;
  background-color: transparent;
  transition: linear 0.3s;
}

.hiden {
  opacity: 0;
  visibility: hidden;
}

/* TEXT BOX HOME 1 */
.box0 {
  margin: 8% 0;
  border-radius: 0.2em;
}

.box1 {
  margin: 160px 0 0% 0;
}

.title-home {
  font-weight: bolder;
  font-size: min(9vw, 3.5rem);
}

/* .textcc {
    padding: 1.5rem 0.75rem;
    width: auto;
    color: #fff;
}

    .textcc h2 {
        font-weight: bolder;
    }

.textcc-02 {
    margin-top: 0rem;
    width: auto;
    color: #fff;
}

    .textcc-02 h2 {
        text-align: center;
        font-weight: bolder;
        margin: 2rem 0;
    } */

/* .cont-info-main {
    padding: 0.75rem;
    position: absolute;
    margin: auto;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    left: 0;
    z-index: 3;
    display: flex;
    width: auto;
    max-width: 992px;
    align-items: center;
    justify-content: center;
    height: auto;
} */

/* .home-text-manifest {
    display: grid;
    gap: 0.75rem;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
} */

/* .textcc-3 {
    text-align: center;
    padding: 0.75rem;
    width: 100%;
    max-width: 800px;
    color: #a2a7ac;
    margin: 3rem auto;
}

    .textcc-3 h2 {
        color: #a2a7ac;
        font-weight: bolder;
        max-width: 600px;
        margin: 1rem auto;
    } */

/* .home-slide-content-02 {
  padding: 3rem;
  display: block;
  height: 100%;
  color: #fff;
  min-height: 700px;
  background-color: #282a2c;
} */

.home-slide-content-02 h4 {
  color: #a2a7ac;
  font-weight: bolder;
  margin: 2rem 0;
}

.home-slide-content-02 p {
  color: #a2a7ac;
}

.text-title h2 {
  color: #bb052c;
  font-weight: bolder;
}

/* .textcc-mesaje {
    border-left: 1px solid #bb052c;
    font-size: 0.8em;
    font-style: italic;
    padding: 4em;
    color: #fff;
} */

/* .boxtextbg {
  max-width: 80%;
} */

/* .boxtextbg-2 {
  max-width: 80%;
} */

/* TEXT BOX HOME 2 */
.box-card {
  border: 1px solid #313336 !important;
  border-radius: 5px !important;
  color: #ccd2d8;
  background-color: #282a2c;
  overflow: hidden;
  width: 100%;
}

/* .card-title {
  color: #a2a7ac;
  font-weight: bolder;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid #3f4144;
} */

/* .card-cus-01 {
  background-color: #282a2c;
}

.card-cus-01 p {
  color: #787d81;
  font-size: 0.9rem;
} */

/* .card-img-bottom {
  border-radius: 0 0 0.2em 0.2em;
} */

.box-cardm {
  margin: 0 3% 0 3%;
}

/* CAROUSEL MAIN FADE */
.carrousel-opt {
  width: 100%;
  height: 1080px;
  background-size: cover;
  background-position: center center;
}

/* .img-bg-00 {
  overflow: hidden;
  background-image: url(/images/home/etiopia-corecon-01.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 1000px;
  transition: linear 1s;
} */

/* .img-bg-02 {
  background-image: url(/images/home/etiopia-corecon-02.jpg);
  background-position: 0% 0%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 900px;
}

.img-bg-03 {
  background-image: url(/images/home/etiopia-corecon-03.jpg);
  background-position: 0% 0%;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 900px;
} */

/* CAROUSEL TRANSITION DURATION OPT */
#carouselFademain .carousel-item {
  transition-duration: 1.8s;
  transition-property: opacity;
}

.card-bg-color1 {
  background-color: #1c1d20;
}

.card-bg-color2 {
  background-color: #1c1d20;
}

.card-bg-color3 {
  background-color: #1c1d20;
}

.btn-info-main {
  max-width: 130px;
  margin: 0 auto;
}

/* SLIDE 2 MAIN INFO */
.carousel-btn {
  font-size: 1.3em;
  margin: auto 0 auto 0;
  width: 30px;
  height: 60px;
}

.icon-nav-l {
  padding: 0.2em 0.3em 0 0;
}

.icon-nav-r {
  padding: 0.2em 0 0 0.2em;
}

.img-s {
  width: 100%;
  height: 700px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

/* .img-s1 {
  background-image: url(/images/home/noticia-corecon-03.jpg);
}

.img-s2 {
  background-image: url(/images/home/noticia-corecon-02.jpg);
}

.img-s3 {
  background-image: url(/images/home/noticia-corecon-01.jpg);
} */

.carousel,
.slide,
.border-cus-01 {
  border-radius: 5px;
  overflow: hidden;
}

.contact-box-bg {
  display: block;
  width: 100%;
  background-color: #272829;
  height: auto;
  margin: 150px auto;
  color: #ccd2d8;
  border-radius: 2px;
}

.contact-box-bg h2 {
  font-weight: bolder;
  color: #ccd2d8;
  margin: 2rem 0 2rem 0;
}

/* PAGE CONTACT STYLES */
.contact-box {
  margin: 30px auto;
}

.img-bg-05 {
  margin: 2em 0 2em 0;
  width: 100%;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  -o-border-radius: 2px;
}

.form-container {
  padding: 1.7em 0.8em 0.8em 0.8em;
}

.contact-bg-img {
  display: block;
  background-image: url("/images/contact/contact-corecon-00.jpg");
  background-position: center;
  width: 100%;
  height: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}

.contact-info {
  padding: 0 0 2em 0;
}

.contact-info .card-title {
  color: #bb052c;
  text-align: left;
  font-size: min(4vw, 1.6rem);
}

.contact-info-01 {
  text-align: center;
  background-color: #31992e;
}

.submit-home {
  padding-top: 2em;
  list-style: none;
}

/* PAGE ABOUT STYLES */
.textcc-01 {
  display: flex;
  pointer-events: none;
  color: #fff;
  border-radius: 0.2em;
  background-image: url(/images/about/nosotros-corecon-04.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  width: auto;
  height: 900px;
  margin: 0 0 30px 0;
  padding: 0.75rem;
}

.textcc-01 .textcc-01-content {
  padding: 1.5rem 0.75rem;
  text-align: left;
  margin: auto auto auto auto;
  display: block;
  border-radius: 5px;
  color: #ccd2d8;
}

.textcc-01 .textcc-01-content h1 {
  pointer-events: none;
  font-weight: bolder;
  text-align: left;
  margin: 0 0 1rem 0;
}

.textcc-01 .textcc-01-content p {
  color: #ccd2d8;
  pointer-events: none;
  margin: 0 auto;
  max-width: 550px;
  font-size: 1.2em;
}

@media only screen and (min-width: 768px) {
  .textcc-01 .textcc-01-content {
    margin: 10% 0 auto 10%;
  }

  .textcc-01 .textcc-01-content h1 {
    pointer-events: none;
    font-weight: bolder;
    margin: 0 0 1rem 0;
  }
}

.about-imag-00 {
  padding: 0.75rem;
  display: flex;
  border-radius: 5px;
  background-image: url(/images/about/nosotros-corecon-00.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  width: auto;
  height: 600px;
  margin: 0 0 30px 0;
}

.about-imag-02 {
  padding: 0.75rem;
  display: flex;
  background-image: url(/images/about/nosotros-corecon-02.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  width: auto;
  height: 600px;
  border-radius: 5px;
}

.about-container-box {
  border-radius: 5px;
  background-color: #bb052c;
  height: auto;
  display: inline-flex;
  max-width: 500px;
  margin: auto auto auto auto;
}

@media only screen and (min-width: 768px) {
  .about-container-box {
    margin: 10% auto auto 10%;
  }
}

.about-content {
  display: block;
  margin-bottom: 30px;
  overflow: hidden;
  border-radius: 5px;
  background-color: #313336;
  width: auto;
}

.about-content .textcc-3 {
  width: auto;
  text-align: left;
}

.about-content .textcc-3 h2 {
  max-width: none;
  color: #a2a7ac;
}

.about-content--img01 {
  display: block;
}

.about-content--img01 img {
  -o-object-fit: cover;
  object-fit: cover;
  width: 100%;
  height: auto;
}

@media only screen and (min-width: 768px) {
  .about-content--img01 {
    display: flex;
  }

  .about-content--img01 img {
    max-width: 400px;
  }
}

.about-info-00 {
  background-color: #bb052c;
  color: #fff;
  margin: auto;
  max-width: 500px;
  height: auto;
  border-radius: 5px;
}

@keyframes fadein {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.banner-content .img-banner-news .textcc h2 {
  color: #fff;
  margin-top: 220px;
}

.img-banner-news {
  background-image: url(/images/news/news-corecon-bg.jpg);
  background-position: center center;
  background-size: cover;
  height: 600px;
  width: 100%;
}

.img-banner-news .textcc {
  max-width: 800px;
}

.text-title {
  max-width: 100%;
}

/* Fondo de la sección de noticias */
.news-container {
  background-color: #313336;
  width: 100%;
  height: auto;
  border: 1px solid #3f4144;
  border-radius: 2px;
  overflow: hidden;
}

.news-1 {
  width: 100%;
  height: auto;
}

.news-text-date {
  font-size: 0.8em;
  color: #fff;
  margin: auto 0;
  top: 0;
  bottom: 0;
  right: 0;
  position: absolute;
  display: block;
  width: 150px;
  height: 80px;
  background-color: #bb052c;
}

.news-text-date a {
  display: block;
  top: 0;
  bottom: 0;
  margin: auto 0;
  width: 100%;
  height: 20px;
  text-align: center;
  position: absolute;
}

/* Imágenes para la sección de noticias */
.new-img-container {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 400px;
}

.new-img-01 {
  background-image: url(/images/news/corecon-news-img-1.jpg);
}

.new-img-02 {
  background-image: url(/images/news/corecon-news-img-2.jpg);
}

.new-img-03 {
  background-image: url(/images/news/corecon-news-img-3.jpg);
}

.new-img-04 {
  background-image: url(/images/news/corecon-news-img-4.jpg);
}

.news-emprendedurismo {
  background-image: url(/images/news/emprendedurismo-101.jpg);
}

.news-efectividad {
  background-image: url(/images/news/efectividad.jpg);
}

.news-text,
.news-text-extra {
  color: #a2a7ac;
  height: auto;
  background-color: #282a2c;
}

.news-text h3 {
  color: #a2a7ac;
  font-weight: bolder;
}

.news-text-extra h5 {
  color: #a2a7ac;
  font-weight: bolder;
}

.news-text a.text-reveal {
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #bb052c;
}

.news-text span {
  display: block;
  text-align: center;
  justify-content: center;
  transition: linear 0.3s;
  -webkit-transition: linear 0.3s;
  -moz-transition: linear 0.3s;
  -ms-transition: linear 0.3s;
  -o-transition: linear 0.3s;
}

.news-text i {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 5px 0 0;
  font-size: 1.7em;
  width: 20px;
  height: 30px;
  transition: linear 0.2s;
  -webkit-transition: linear 0.2s;
  -moz-transition: linear 0.2s;
  -ms-transition: linear 0.2s;
  -o-transition: linear 0.2s;
}

.news-text i:hover {
  cursor: pointer;
  color: #bb052c;
}

.news-text-extra {
  overflow: hidden;
  color: #a2a7ac;
  height: auto;
  display: block;
  height: 0;
  visibility: hidden;
}

/* FOOTER */
/* .footer-div-bottom {
  padding-top: 2rem;
  display: flex;
  border-top: 1px solid #3f4144;
  width: 100%;
  margin: 50px auto;
}

.footer-div-bottom .img-2 {
  display: block;
  width: 90px;
  height: auto;
} */

/* .footer-container {
  padding: 5rem 0 0 0;
  max-width: 992px;
  margin: 0 auto;
} */

#footer {
  bottom: 0;
  margin: 150px 0 0 0;
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #282a2c;
  z-index: 1;
  padding-bottom: 0;
}

#footer .nav-link {
  border-bottom: none;
}

#footer .input-group .btn {
  border-radius: 0 2px 2px 0;
}

.footer-link-optional {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0.5rem 0;
  font-size: min(5vw, 0.8rem);
}

.footer-link-optional .alt-drop-link {
  color: #787d81;
}

.footer-link-optional .alt-drop-link .icon {
  margin: 0.2rem 0.5rem 0.2rem 0;
  width: min(10vw, 16px);
  height: min(10vw, 16px);
}

.d-cursor {
  pointer-events: none;
  cursor: default;
}

/* .footer-t a {
  color: #ccd2d8;
  font-size: 1em;
  transition: color 0.2s ease-in-out;
} */

/* .footer-t i {
  color: #bb052c;
} */

/* .footer-t {
  color: #ccd2d8;
  padding: 0;
} */

/* .footer-t a:hover {
  color: #bb052c;
} */

.footer-i {
  padding-top: 0.5em;
  color: #ccd2d8;
  text-align: center;
  font-size: 1.2em;
}

.box-btn-imput {
  background-color: #313336;
  border-width: 1px 0 1px 1px;
  border-style: solid;
  border-color: #3f4144;
  border-radius: 2px 0 0 2px;
}

.form-control::-moz-placeholder {
  color: #787d81;
}

.form-control::placeholder {
  color: #787d81;
}

.form-control:focus {
  color: #787d81;
  background-color: #282a2c;
}

.btn-congig1 {
  margin: 5px 0 0 2px;
  border: none;
  height: 23px;
  font-size: 0.7em;
  padding: 0 10px 0 10px;
}

/* .nav-item {
  display: flex;
  align-items: center;
  list-style: none;
  border-bottom: 1px solid #313336;
} */

/* .nav-item--link a {
  padding: 0.75rem 0;
} */

/* .box-imput {
    max-width: 500px;
} */
@media (max-width: 1200px) {
  .fill {
    height: 600px;
  }

  /* .boxtextbg {
    max-width: 95%;
  } */

  /* .boxtextbg-2 {
    max-width: 95%;
  } */
}

@media (max-width: 991px) {
  .img-story {
    height: 530px;
  }

  .fill {
    height: 400px;
  }

  .box0 {
    margin: 8% 0 0 0;
  }
}

@media (max-width: 767px) {
  .img-story {
    height: auto;
  }

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

  .wrap {
    max-width: 30px auto;
  }

  nav ul {
    opacity: 0;
    visibility: hidden;
  }

  .icon-s {
    margin: 0.5em;
  }

  .img-s {
    height: 400px;
  }

  .card-custom {
    flex: unset;
    margin-top: 5px;
  }

  .carrousel-opt {
    height: 1135px;
  }

  .box-card {
    margin: 0;
    width: auto;
  }

  /* .boxtextbg {
    max-width: 70%;
  } */

  .box-card {
    margin: 5% 0 5% 0;
  }

  /* .textcc-mesaje {
        border-top: 1px solid #bb052c;
        border-left: none;
        margin: 0 auto;
    } */

  .box0 {
    margin: 10% auto;
  }

  .overlay {
    background-position: 80% center;
  }

  .box1 {
    margin: 20px 0 0% 0;
    font-size: 0.9em;
  }

  #nav-icon {
    left: 0;
    right: 0;
    margin: 0 auto;
  }

  .img {
    visibility: hidden;
  }

  .new-img-container {
    height: 400px;
    width: 100%;
  }

  .news-container-01 {
    margin: 30px 0 0 0;
  }

  .carousel {
    padding: 0;
    width: 100% !important;
  }
}

@media (min-width: 767px) {
  .overflow {
    overflow: visible;
  }

  .img {
    visibility: visible;
  }

  .transparent {
    background-color: #282a2c;
  }

  .hiden {
    opacity: 1;
    visibility: visible;
  }
}

/* @media (max-width: 576px) {
  .boxtextbg {
    max-width: 95%;
  }
} */

#courses-contact-form {
  display: flex;
  width: 100%;
  height: 100%;
  min-height: 1100px;
  justify-content: center;
  align-items: center;
  /* ------------------------------- ANCHOR Form ------------------------------ */
  /* --------------------------- ANCHOR Media query --------------------------- */
}

#courses-contact-form::after {
  content: "";
  z-index: -1;
  position: fixed;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #1c1d20;
}

#courses-contact-form .content {
  color: #ccd2d8;
  display: flex;
  position: relative;
  width: 100%;
  margin: auto;
}

@media only screen and (min-width: 400px) {
  #courses-contact-form .content {
    min-width: 350px;
  }
}

@media only screen and (min-width: 576px) {
  #courses-contact-form .content {
    min-width: 550px;
  }
}

@media only screen and (min-width: 768px) {
  #courses-contact-form .content {
    min-width: 620px;
  }
}

#courses-contact-form .menu-dot-container {
  display: flex;
  align-items: center;
  width: 100%;
  height: 45px;
  background-color: #bb052c;
  border: 1px solid #bb052c;
}

#courses-contact-form .menu-dot-container span {
  color: #fff;
  cursor: pointer;
  margin-left: 15px;
  display: flex;
  align-items: center;
  font-size: 0.9rem;
}

#courses-contact-form .menu-dot-container span .im {
  font-size: 0.6rem;
  margin-right: 6px;
  margin-top: 2px;
  height: 100%;
}

#courses-contact-form form {
  overflow: hidden;
  background-color: #282a2c;
  width: 100%;
  max-width: 700px;
  margin: auto;
  display: block;
  border-radius: 2px;
}

#courses-contact-form form .form-container {
  border: 1px solid #3f4144;
  padding: 15px;
}

#courses-contact-form form .form-container label {
  display: block;
}

#courses-contact-form form .title {
  display: block;
  text-align: center;
  max-width: 500px;
  margin: 0 auto 50px auto;
}

#courses-contact-form form .title::after {
  content: "";
  display: block;
  width: 150px;
  height: 4px;
  background-color: #bb052c;
  margin: 25px auto;
}

#courses-contact-form form .form-input {
  margin-bottom: 50px;
  display: block;
  width: 100%;
}

#courses-contact-form form .form-input .input {
  display: block;
  width: auto;
}

#courses-contact-form form .form-input .input span {
  font-size: 0.9rem;
  display: block;
  margin-top: 10px;
  margin-bottom: 10px;
  color: #787d81;
}

#courses-contact-form form .form-input .input input {
  color: #ccd2d8;
  margin-bottom: 0;
  border-color: #3f4144;
  background-color: #313336;
}

@media only screen and (min-width: 768px) {
  #courses-contact-form form .form-input .input input {
    margin-bottom: 0;
  }
}

#courses-contact-form form textarea {
  color: #ccd2d8;
  margin-top: 10px;
  display: block;
  width: 100%;
  border-color: #3f4144;
  background-color: #313336;
}

#courses-contact-form form .btn {
  margin: 40px auto 20px auto;
}

#courses-contact-form form .social-icons {
  margin: 40px 0;
  display: flex;
  width: 100%;
  justify-content: center;
}

#courses-contact-form form .social-icons a {
  margin: 0 20px;
  color: #bb052c;
}

#courses-contact-form form .social-icons a .im {
  font-size: 1rem;
}

@media only screen and (min-width: 768px) {
  #courses-contact-form .content {
    display: flex;
    align-items: center;
  }

  #courses-contact-form form .form-input {
    display: flex;
  }

  #courses-contact-form form .form-input .input {
    width: 100%;
  }

  #courses-contact-form form .form-input .input:first-child {
    margin-right: 15px;
  }
}

.main-contact-form {
  display: block !important;
  height: auto !important;
  overflow: hidden !important;
  padding: 12px !important;
}

.answer-wrong {
  background-color: #bb052c !important;
  border: 1px solid #bb052c !important;
}

.answer-correct {
  background-color: #31992e !important;
  border: 1px solid #31992e !important;
}

.btn-flag-active {
  color: #31992e !important;
}

.btn-active-session {
  background-color: #bb052c !important;
  color: #e8ecee !important;
  border: 1px solid #bb052c;
}

#course {
  padding: 100px 0;
  color: #a2a7ac;
  width: 100%;
  height: 100%;
  display: block;
  justify-content: center;
  /* -------------------------- ANCHOR navbar curses -------------------------- */
  /* ------------------------------ ANCHOR Video ------------------------------ */
  /* ------------------------------- ANCHOR Test ------------------------------ */
  /* ----------------------------- ANCHOR Section ----------------------------- */
  /* --------------------------- ANCHOR Media query --------------------------- */
}

#course::after {
  content: "";
  z-index: -1;
  position: fixed;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #1c1d20;
}

#course .content {
  display: block;
  margin: 0 auto;
}

#course .course-container {
  width: 100%;
  display: flex;
}

#course .navar-curses {
  transform: scale(0.8);
  transform-origin: top;
  /* ------------------------ ANCHOR Session container ------------------------ */
}

#course .navar-curses .session-container {
  display: block;
  margin: 0 auto;
  /* -------------------------- ANCHOR Session title -------------------------- */
  /* ------------------------------ ANCHOR Lesson ----------------------------- */
}

#course .navar-curses .session-container .session-title {
  width: 35px;
  height: 35px;
  border-radius: 15%;
  background-color: #bb052c;
  position: relative;
  list-style: none;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 10px 0;
}

#course .navar-curses .session-container .session-title::after {
  content: "";
  display: block;
  position: absolute;
  top: 37px;
  width: 2px;
  height: 15px;
  background-color: #3f4144;
}

#course .navar-curses .session-container .session-title .btn-course-var {
  cursor: pointer;
  pointer-events: none;
  display: flex;
  height: auto;
  align-items: center;
  color: #ccd2d8;
  font-weight: 700;
  margin: auto;
}

#course .navar-curses .session-container .lesson {
  position: relative;
  list-style: none;
  display: flex;
  justify-content: center;
  /* ------------------------------- ANCHOR Flag ------------------------------ */
}

#course .navar-curses .session-container .lesson .flag {
  pointer-events: none;
  cursor: pointer;
  margin: 18px 0 10px 0;
  background-color: transparent !important;
}

#course .navar-curses .session-container .lesson .flag .im {
  font-size: 1rem;
  color: #ccd2d8;
}

#course .navar-curses .session-container .lesson::after {
  content: "";
  display: block;
  position: absolute;
  top: 37px;
  width: 2px;
  height: 15px;
  background-color: #3f4144;
}

#course .navar-curses .session-container .lesson:last-child::after {
  content: "";
  display: block;
  position: absolute;
  top: 30px;
  width: 0px;
  height: 25px;
  background-color: #3f4144;
}

#course .navar-curses .session-container .lesson .btn-course-var {
  cursor: pointer;
  display: flex;
  width: 25px;
  height: 25px;
  background-color: #313336;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  color: #ccd2d8;
  font-size: 0.9rem;
  margin: 10px 0;
}

#course #course-content {
  display: block;
}

#course #course-content .btn-next {
  margin-top: 0;
  text-align: right;
  display: block;
}

#course .video-container {
  width: 100%;
  height: auto;
  display: block;
  padding: 0.75rem;
  /* ---------------------- ANCHOR Frame video container ---------------------- */
}

#course .video-container h2 {
  margin: 20px 0 -10px 0;
  padding: 0;
}

#course .video-container h3 {
  color: #787d81;
  align-items: center;
  font-weight: 300;
  font-size: 1rem;
  margin-bottom: 50px;
}

#course .video-container h3 span {
  font-weight: 700;
  margin-right: 10px;
}

#course .video-container .description {
  padding-bottom: 30px;
  margin-bottom: 60px;
  border-bottom: 1px solid #3f4144;
  background-color: #282a2c;
}

#course .video-container .video-embed {
  display: block;
  width: 100%;
  height: 100%;
}

#course .video-container .video-embed .video-wrapper {
  display: flex;
  width: 100%;
  position: relative;
  padding-bottom: 56.25%;
  /* 16:9 */
  height: 0;
}

#course .video-container .video-embed .video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

#course .video-container .video-info-footer {
  display: block;
  margin-top: 25px;
}

#course .video-container .video-info-footer a {
  margin-top: 25px;
  display: flex;
  align-items: center;
  color: #ccd2d8;
  max-width: 200px;
}

#course .video-container .video-info-footer a .im {
  font-size: 1rem;
  margin-right: 15px;
}

#course #test-form-wrapper {
  overflow: hidden;
  width: 100%;
  height: 750px;
  position: relative;
  display: block;
}

#course .test-container {
  width: 100%;
  height: 100%;
  position: absolute;
}

#course .test-container .test-form {
  position: relative;
  padding: 0.75rem;
}

#course .test-container .test-form h1 .im {
  color: #31992e;
}

#course .test-container .test-form form .question p {
  display: block;
  font-size: 1rem;
  margin-bottom: 50px;
}

#course .test-container .test-form form .question p::after {
  margin-top: 20px;
  content: "";
  display: block;
  position: relative;
  width: 100%;
  height: 1px;
  background-color: #313336;
}

#course .test-container .test-form form .answer-content {
  /* --------------------------- ANCHOR Button test --------------------------- */
}

#course .test-container .test-form form .answer-content .btn {
  text-align: left;
  background-color: #282a2c;
  padding: 10px 10px !important;
  height: auto;
  min-height: 55px;
  width: 100%;
  margin: 20px 0;
  border: 1px solid #3f4144 !important;
}

#course .test-container .test-form form .answer-content .btn:hover {
  /*                        background-color: #37393b !important;*/
  border: 1px solid #f6f8fa !important;
}

#course .test-container .test-form form .answer-content .btn.answer-correct:hover {
  background-color: #31992e !important;
  border: 1px solid #31992e !important;
}

#course .test-container .btn-next {
  margin-left: auto;
  margin-right: 0.75rem;
}

#course .attempts-container {
  position: relative;
  display: flex;
  width: auto;
  margin-left: 0.75rem;
  background-color: #313336;
}

#course .attempts-container .attempts {
  width: auto;
  height: 30px;
  position: relative;
  display: flex;
  align-items: center;
  color: #ccd2d8;
  font-size: 0.8rem;
}

#course .attempts-container .attempts-number {
  width: auto;
  height: 30px;
  position: relative;
  display: flex;
  align-items: center;
  color: #ccd2d8;
  font-size: 0.8rem;
  margin: 0 8px;
}

#course .attempts-container .bg-progress {
  position: absolute;
  display: block;
  width: 0%;
  height: 100%;
  background-color: #bb052c;
  background: #bb052c;
  background: linear-gradient(45deg, #1c1d20 0%, #bb052c 100%);
}

#course .attempts-container .test-completed {
  z-index: 2;
  position: absolute;
  margin: auto 0;
  left: 50px;
  top: 0;
  bottom: 0;
  font-size: 0.8rem;
  margin-left: 15px;
  display: flex;
  align-items: center;
}

#course .attempts-container .test-completed .im {
  margin-left: 10px;
  padding-top: 2px;
  color: #ccd2d8;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 23px;
  height: 23px;
  border-radius: 50%;
  font-size: 0.6rem;
  background-color: #31992e;
}

#course .section-btn {
  opacity: 0.3;
}

#course #section-contr,
#course #section-quest {
  display: block;
  width: 100%;
  max-height: 100%;
  overflow: hidden;
  font-size: 0.9rem;
  padding: 0.75rem;
  margin-top: 0;
  /* ------------------------------- ANCHOR Form ------------------------------ */
}

#course #section-contr form,
#course #section-quest form {
  display: block;
  overflow: auto;
  padding-bottom: 25px;
  max-height: 900px;
  scrollbar-width: none;
  /* ------------------------------- ANCHOR Card ------------------------------ */
}

#course #section-contr form::-webkit-scrollbar,
#course #section-quest form::-webkit-scrollbar {
  display: none;
}

#course #section-contr form textarea,
#course #section-quest form textarea {
  color: #a2a7ac;
  border-color: #313336;
}

#course #section-contr form .btn-send,
#course #section-quest form .btn-send {
  margin-top: 15px;
}

#course #section-contr form .commentary-text,
#course #section-quest form .commentary-text {
  height: 7rem;
}

#course #section-contr form .contributions,
#course #section-quest form .contributions {
  display: block;
  position: relative;
}

#course #section-contr form .contributions .header,
#course #section-quest form .contributions .header {
  display: flex;
  justify-content: space-between;
}

#course #section-contr form .contributions .header li,
#course #section-quest form .contributions .header li {
  cursor: pointer;
  width: 100%;
  list-style: none;
  display: flex;
  justify-content: center;
  padding-bottom: 10px;
  border-bottom: 2px solid #bb052c;
}

#course #section-contr form .contributions .header li .contr,
#course #section-contr form .contributions .header li .quest,
#course #section-quest form .contributions .header li .contr,
#course #section-quest form .contributions .header li .quest {
  margin-right: 10px;
}

#course #section-contr form .contributions .order,
#course #section-quest form .contributions .order {
  display: block;
  margin-top: 50px;
}

#course #section-contr form .contributions .order h3,
#course #section-quest form .contributions .order h3 {
  margin-bottom: 30px;
}

#course #section-contr form .contributions .order .order-options,
#course #section-quest form .contributions .order .order-options {
  display: flex;
  align-items: center;
}

#course #section-contr form .contributions .order .btn,
#course #section-quest form .contributions .order .btn {
  color: #e8ecee;
  margin: 0 5px;
  background-color: #313336;
  border: 1px solid #3f4144;
}

#course #section-contr form .contributions .order .btn:hover,
#course #section-quest form .contributions .order .btn:hover {
  background-color: #bb052c;
  border: 1px solid #bb052c;
}

#course #section-contr form .card-container,
#course #section-quest form .card-container {
  margin-top: 25px;
  display: flex;
}

#course #section-contr form .card-container .card,
#course #section-quest form .card-container .card {
  display: flex;
  width: 100%;
  padding: 0.75rem;
  background-color: #282a2c;
  border: 1px solid #3f4144;
  border-radius: 2px;
  /* --------------------------- ANCHOR Card content -------------------------- */
}

#course #section-contr form .card-container .card .var,
#course #section-quest form .card-container .card .var {
  gap: 1rem;
  display: flex;
  align-items: center;
}

#course #section-contr form .card-container .card .var img,
#course #section-quest form .card-container .card .var img {
  display: block;
  width: 50px;
  height: 50px;
  border-radius: 50%;
}

#course #section-contr form .card-container .card .var .like,
#course #section-quest form .card-container .card .var .like {
  transform: scale(0.8);
  padding: 0.3rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  justify-content: center;
  width: 50px;
  height: auto;
  align-items: center;
  border-bottom: 1px solid #3f4144;
}

#course #section-contr form .card-container .card .var .like .im,
#course #section-quest form .card-container .card .var .like .im {
  font-size: 1.2rem;
  margin-bottom: 0;
}

#course #section-contr form .card-container .card .card-content,
#course #section-quest form .card-container .card .card-content {
  display: block;
  margin: 1rem 0 0 0;
}

#course #section-contr form .card-container .card .card-content .textarea-container,
#course #section-quest form .card-container .card .card-content .textarea-container {
  position: relative;
  overflow: hidden;
}

#course #section-contr form .card-container .card .card-content .textarea-answer,
#course #section-quest form .card-container .card .card-content .textarea-answer {
  display: none;
  visibility: hidden;
  opacity: 0;
  transform: translateY(-100%);
  height: 0;
  margin: 0.75rem 0;
}

#course #section-contr form .card-container .card .card-content .btn-reply-cancel,
#course #section-quest form .card-container .card .card-content .btn-reply-cancel {
  visibility: hidden;
  opacity: 0;
}

#course #section-contr form .card-container .card .card-content h4,
#course #section-quest form .card-container .card .card-content h4 {
  padding: 0;
  margin: 0;
}

#course #section-contr form .card-container .card .card-content .time,
#course #section-quest form .card-container .card .card-content .time {
  color: #787d81;
  font-size: 0.8rem;
}

#course #section-contr form .card-container .card .card-content p,
#course #section-quest form .card-container .card .card-content p {
  font-size: 0.8rem;
}

#course #section-contr form .card-container .card .card-content .card-content-body,
#course #section-quest form .card-container .card .card-content .card-content-body {
  position: relative;
  background-color: #3f4144;
  padding: 0.5rem;
  border-radius: 2px;
  margin: 0 auto 0 0.75rem;
}

#course #section-contr form .card-container .card .card-content .card-content-body h4,
#course #section-quest form .card-container .card .card-content .card-content-body h4 {
  font-size: min(4vw, 1rem);
}

#course #section-contr form .card-container .card .card-content .card-content-body:before,
#course #section-quest form .card-container .card .card-content .card-content-body:before {
  content: "";
  display: block;
  position: absolute;
  top: -5.5px;
  left: -10px;
  width: 20px;
  height: 20px;
  -webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  transform: rotate(-63deg);
  background-color: #3f4144;
}

#course #section-contr form .card-container .card .card-content--answer .card-content-body,
#course #section-quest form .card-container .card .card-content--answer .card-content-body {
  position: relative;
  background-color: #313336;
  padding: 0.5rem;
  border-radius: 2px;
  margin: 0 0.75rem 0 auto;
}

#course #section-contr form .card-container .card .card-content--answer .card-content-body .header-answer,
#course #section-quest form .card-container .card .card-content--answer .card-content-body .header-answer {
  width: 100%;
  border-bottom: 1px solid #3f4144;
  padding-bottom: 0.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}

#course #section-contr form .card-container .card .card-content--answer .card-content-body .header-answer img,
#course #section-quest form .card-container .card .card-content--answer .card-content-body .header-answer img {
  width: 35px;
  height: 35px;
}

#course #section-contr form .card-container .card .card-content--answer .card-content-body h4,
#course #section-quest form .card-container .card .card-content--answer .card-content-body h4 {
  font-size: min(4vw, 0.8rem);
}

#course #section-contr form .card-container .card .card-content--answer .card-content-body:before,
#course #section-quest form .card-container .card .card-content--answer .card-content-body:before {
  content: "";
  display: block;
  position: absolute;
  top: -5.6px;
  left: auto;
  right: -11px;
  width: 20px;
  height: 20px;
  -webkit-clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  transform: rotate(63deg);
  background-color: #313336;
}

@media only screen and (min-width: 768px) {
  #course #course-content {
    display: flex;
    width: 100%;
  }

  #course #course-content .btn-next {
    margin-top: 0;
  }

  #course #section-quest,
  #course #section-contr {
    max-width: 350px;
    margin-top: 0;
  }

  #course #section-quest .commentary-text,
  #course #section-contr .commentary-text {
    height: 7rem;
  }
}

#services-main {
  padding: 5rem 0 0 0;
  color: #a2a7ac;
  width: 100%;
  height: 100vh;
  display: block;
}

#services-main::after {
  content: "";
  z-index: -1;
  position: fixed;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #1c1d20;
}

#services-main .container {
  max-width: 800px;
}

.content {
  display: none;
  padding: 0rem 0 4rem 0;
  max-width: 1140px;
  width: 100%;
  margin: auto;
}

.content--active {
  display: block;
}

.description-content {
  position: relative;
  gap: 1rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  margin-top: 0rem;
}

.description-image {
  display: inline-flex;
  gap: 2rem;
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 5px;
}

.description-image img {
  -o-object-fit: cover;
  object-fit: cover;
  display: block;
  width: 200px;
  height: auto;
}

.description {
  display: block;
  margin-top: 0rem;
  padding: 1.2rem 0.75rem;
  font-size: min(5vw, 1rem);
  background-color: #282a2c;
  border-radius: 2px;
  border: 1px solid #313336;
}

.description-text--lan {
  max-width: 350px;
}

.title-description {
  position: relative;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: baseline;
  margin-bottom: 0rem;
}

.title-description h2 {
  margin: 0;
}

.title-description p {
  font-size: min(7vw, 2rem);
  padding: 0 0 0.75rem 0;
  margin: 0 0 1rem 0;
}

.title-description p::after {
  content: "";
  position: absolute;
  bottom: 0;
  display: block;
  height: 1px;
  background-color: #3f4144;
  width: 40%;
}

.sections-nav {
  margin-top: 2rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 6rem), 1fr));
  width: auto;
  gap: 0.75rem;
}

@media only screen and (min-width: 576px) {
  .sections-nav {
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 7rem), 1fr));
  }
}

.sections-label {
  pointer-events: none;
  display: block;
  text-align: center;
  width: 100%;
  font-size: min(3.5vw, 0.9rem);
}

.sections-nav-button {
  position: relative;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: auto;
  padding: 0.75rem;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #313336;
  border-radius: 2px;
  padding-bottom: 2rem;
  opacity: 0.5;
}

.sections-nav-button .icon {
  margin: 1rem auto;
  width: min(7vw, 35px);
  height: min(7vw, 35px);
}

.sections-nav-button::after {
  content: "";
  display: block;
  position: absolute;
  z-index: -1;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 0;
  transition: width 0.3s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.sections-nav-button:hover::after {
  width: 100%;
  background-color: #313336;
}

.sections-nav-button--active {
  opacity: 1;
  background-color: #282a2c;
}

.table-container {
  display: none;
  width: auto;
}

.table-container--active {
  display: flex;
}

.table-title-container {
  padding: 0.75rem;
  border-radius: 2px;
  border: 1px solid #313336;
  margin: 2rem 0;
}

.table-title-container .table-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.table-title-container .table-title .icon {
  width: min(10vw, 18px);
  height: min(10vw, 18px);
}

.table-title-container p {
  color: #787d81;
}

.table {
  display: block;
  width: 100%;
}

.table-header {
  display: block;
  border-width: 1px 1px 1px 1px;
  border-color: #bb052c;
  border-style: solid;
  margin-bottom: 0px;
  border-radius: 2px 2px 0 0;
  background-color: #bb052c;
}

.table-header .table-cell {
  font-weight: bold;
  font-size: min(3vw, 0.9rem);
  border-width: 0px 0px 0px 1px;
  border-color: #bb052c;
  border-style: solid;
}

.table-body {
  display: block;
  border-width: 0px 1px 1px 1px;
  border-color: #3f4144;
  border-style: solid;
  border-radius: 0 0 2px 2px;
}

.table-row {
  width: auto;
  display: flex;
  border-width: 0px 0px 1px 0px;
  border-color: #3f4144;
  border-style: solid;
}

.table-row:last-child {
  border-width: 0px 0px 0px 0px;
}

.table-row--border-b-0 {
  border-bottom: 0;
}

.table-row--border-r-0 {
  border-right: 0;
}

.table-row--border-l-0 {
  border-left: 0;
}

.table-row--border-t-0 {
  border-top: 0;
}

.table-cell {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  padding: 0.75rem 0.75rem;
  width: 100%;
  border-width: 0px 0px 0px 1px;
  border-color: #3f4144;
  border-style: solid;
}

.table-cell:first-child {
  border-width: 0px 0px 0px 0px;
}

.table-cell--elements-left {
  text-align: left;
  justify-content: left;
}

.table-cell--elements-right {
  text-align: right;
  justify-content: right;
}

.table-cell--elements-center {
  text-align: center;
  justify-content: center;
}

.first-detail {
  font-size: min(4vw, 0.9rem);
}

.second-detail,
.third-detail,
.four-detail,
.header-second-detail,
.header-third-detail,
.header-four-detail {
  text-align: center;
  justify-content: center;
  width: 200px;
}

.table-detail-simbol {
  color: #fd9206;
  font-size: min(3vw, 0.9rem);
}

.table-detail-price {
  font-size: min(3vw, 0.9rem);
}

.first-detail {
  color: #787d81;
}

.detail-icon .icon {
  color: #31992e;
}

.section {
  position: relative;
  margin-top: 0rem;
  display: flex;
  width: 100%;
  height: auto;
  background-color: transparent;
  padding-bottom: 0rem;
  overflow: hidden;
}

.section-bg {
  display: flex;
  z-index: 0;
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-image: url("https://images.pexels.com/photos/3415148/pexels-photo-3415148.jpeg?cs=srgb&dl=pexels-bali-demiri-3415148.jpg&fm=jpg?auto=compress&cs=tinysrgb&dpr=2&h=600&w=480");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: 0.05;
}

.section-bg--lan {
  background-image: url("https://images.pexels.com/photos/7077970/pexels-photo-7077970.jpeg?cs=srgb&dl=pexels-laura-tancredi-7077970.jpg&fm=jpg&fm=jpg?auto=compress&cs=tinysrgb&dpr=2&h=600&w=480");
}

.card-containers {
  width: 100%;
  padding: 0rem;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: 0rem;
  margin: 0 0 0 0;
}

.card-containers--lan {
  gap: 2rem;
}

.card {
  padding: 0rem;
  background-color: transparent;
  border: 1px solid transparent;
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  width: 100%;
}

.div-line {
  display: none;
  position: absolute;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 1px;
  height: 50%;
  background-color: #787d81;
}

.div-line--lan {
  height: 70%;
}

@media only screen and (min-width: 768px) {
  .div-line {
    display: flex;
  }
}

.card__header {
  margin-top: 0rem;
}

.card__header-image {
  display: flex;
  margin: -0.75rem;
  justify-content: center;
  margin-bottom: 0rem;
}

.card__header-image img {
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center;
  width: 100%;
  height: 250px;
}

.card__body-line {
  display: inline-flex;
  align-items: center;
  gap: 1rem;
}

.card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}

.card__body-title {
  margin: 2rem 0 0 0;
}

.card__body-list {
  padding: 0;
  width: 100%;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
}

.card__body-list li {
  font-size: min(4vw, 0.9rem);
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0;
  list-style: none;
  border-bottom: 1px solid #bb052c;
}

.card__body-list li .icon {
  width: min(10vw, 18px);
  height: min(10vw, 18px);
}

.card__icon {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  border: 1px solid #3f4144;
  border-radius: 50%;
  padding: 0.75rem;
}

.card__icon .icon {
  width: min(10vw, 30px);
  height: min(10vw, 30px);
}

.button-container {
  display: flex;
  width: 100%;
  margin: 2rem 0 1rem 0;
}

.button-container .btn {
  margin: 0 0 0 auto;
}

#course-preview {
  color: #a2a7ac;
  display: flex;
  width: 100%;
  height: 100vh;
  min-height: 1600px;
  justify-content: center;
  align-items: center;
  /* ------------------------------- ANCHOR Info ------------------------------ */
  /* --------------------------- ANCHOR List topics --------------------------- */
  /* --------------------------- ANCHOR Media query --------------------------- */
}

#course-preview::after {
  content: "";
  z-index: -1;
  position: fixed;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #1c1d20;
}

#course-preview .content {
  max-width: 370px;
  display: block;
  margin: 0 auto;
}

#course-preview .info {
  padding: 0rem;
  position: relative;
  margin-bottom: 0.75rem;
  display: flex;
  flex-direction: column;
}

#course-preview .info h1::after {
  content: "";
  display: block;
  margin-top: 10px;
  width: 150px;
  height: 5px;
  background-color: #bb052c;
}

#course-preview .info .info-score {
  width: 100%;
  display: block;
  align-items: center;
  /* ---------------------- ANCHOR Íconos de calificación ---------------------- */
}

#course-preview .info .info-score .course-duration {
  display: flex;
  margin-right: 10px;
}

#course-preview .info .info-score .course-duration b {
  margin-left: 5px;
  margin-right: 40px;
}

#course-preview .info .info-score span {
  font-size: 0.8rem;
}

#course-preview .info .info-score .icons-stars {
  display: flex;
  align-items: center;
  margin: 10px 0;
}

#course-preview .info .info-score .icons-stars span {
  margin-right: 10px;
}

#course-preview .info .info-score .icons-stars .im {
  font-size: 0.9rem;
}

#course-preview .info .info-score .rating-0 .im {
  color: #787d81;
}

#course-preview .info .info-score .rating-1 .im {
  color: #787d81;
}

#course-preview .info .info-score .rating-1 .im:nth-child(1) {
  color: #fdd806;
}

#course-preview .info .info-score .rating-2 .im {
  color: #787d81;
}

#course-preview .info .info-score .rating-2 .im:nth-child(-n + 2) {
  color: #fdd806;
}

#course-preview .info .info-score .rating-3 .im {
  color: #787d81;
}

#course-preview .info .info-score .rating-3 .im:nth-child(-n + 3) {
  color: #fdd806;
}

#course-preview .info .info-score .rating-4 .im {
  color: #787d81;
}

#course-preview .info .info-score .rating-4 .im:nth-child(-n + 4) {
  color: #fdd806;
}

#course-preview .info .info-score .rating-5 .im {
  color: #787d81;
}

#course-preview .info .info-score .rating-5 .im:nth-child(-n + 5) {
  color: #fdd806;
}

#course-preview .info a {
  margin-top: auto;
}

#course-preview .course-description {
  display: block;
  border-bottom: 1px solid #3f4144;
  padding-bottom: 0.75rem;
  /* ------------------------------ ANCHOR Banner ----------------------------- */
}

#course-preview .course-description .course-banner {
  display: block;
  width: 100%;
}

#course-preview .course-description .course-banner img {
  -o-object-fit: cover;
  object-fit: cover;
  display: block;
  width: 100%;
  height: 100%;
}

#course-preview .course-topics {
  display: block;
  width: 100%;
  padding: 0 0 3rem 0;
}

#course-preview .course-topics .list-group {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
  gap: 0.75rem;
}

#course-preview .course-topics .list-group .list {
  display: block;
  width: 100%;
}

#course-preview .course-topics .list-group .list span {
  width: 100%;
  align-items: center;
  display: flex;
  margin: 10px 0;
  border-bottom: 1px solid #bb052c;
}

#course-preview .course-topics .list-group .list .number {
  font-weight: 700;
  font-size: 0.9rem;
  color: #ccd2d8;
  margin-right: 10px;
  display: flex;
  justify-content: center;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  text-align: center;
  align-items: center;
  background-color: #bb052c;
}

@media only screen and (min-width: 768px) {
  #course-preview {
    min-height: 1200px;
  }

  #course-preview .content {
    max-width: 100%;
  }

  #course-preview .course-description {
    display: flex;
  }

  #course-preview .course-description .course-banner img {
    min-width: 300px;
  }

  #course-preview .course-description .info-score {
    display: flex;
    align-items: center;
  }

  #course-preview .info {
    padding: 0.75rem;
  }
}

#courses-main {
  padding-top: 100px;
  padding-bottom: 100px;
  /* ------------------------------ ANCHOR Banner ------------------------------ */
  /* --------------------------- ANCHOR Contact link --------------------------- */
  /* ---------------------------- ANCHOR Media query --------------------------- */
}

#courses-main::after {
  content: "";
  z-index: -1;
  position: fixed;
  display: block;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-color: #1c1d20;
}

#courses-main .title {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: 100px;
}

#courses-main .title h1 {
  color: #a2a7ac;
  font-size: 3rem;
}

#courses-main .title h1::after {
  content: "";
  display: block;
  margin-top: 10px;
  width: 150px;
  height: 5px;
  background-color: #bb052c;
}

#courses-main .title h2 {
  font-size: 1.4rem;
  margin-bottom: 60px;
  color: #a2a7ac;
}

#courses-main .title p {
  color: #a2a7ac;
}

#courses-main .banner {
  color: #a2a7ac;
  margin-bottom: 60px;
  padding-bottom: 15px;
  border-radius: 2px;
  border-bottom: 1px solid #3f4144;
  display: block;
}

#courses-main .banner:nth-child(2) .img-container .course-logo {
  width: 200px;
}

#courses-main .img-container {
  position: relative;
  overflow: hidden;
  border-radius: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 200px;
  max-height: 350px;
}

#courses-main .img-container img {
  overflow: hidden;
  border-radius: 2px;
  -o-object-fit: contain;
  object-fit: contain;
  margin-top: 0;
  display: block;
  width: 100%;
  height: 100%;
}

#courses-main .img-container .course-logo {
  display: block;
  width: 120px;
  height: auto;
  position: absolute;
}

#courses-main .banner-footer {
  padding: 0px;
  width: 100%;
  display: block;
  /* ---------------------- ANCHOR Íconos de calificación ---------------------- */
}

#courses-main .banner-footer .course-duration {
  display: flex;
  margin-right: 10px;
}

#courses-main .banner-footer .course-duration b {
  margin-left: 5px;
  margin-right: 40px;
}

#courses-main .banner-footer span {
  font-size: 0.8rem;
}

#courses-main .banner-footer .icons-stars {
  display: flex;
  align-items: center;
  margin: 10px 0;
}

#courses-main .banner-footer .icons-stars span {
  margin-right: 10px;
}

#courses-main .banner-footer .icons-stars .im {
  font-size: 0.9rem;
}

#courses-main .banner-footer .rating-0 .im {
  color: #787d81;
}

#courses-main .banner-footer .rating-1 .im {
  color: #787d81;
}

#courses-main .banner-footer .rating-1 .im:nth-child(1) {
  color: #fdd806;
}

#courses-main .banner-footer .rating-2 .im:nth-child(-n + 2) {
  color: #fdd806;
}

#courses-main .banner-footer .rating-3 .im {
  color: #787d81;
}

#courses-main .banner-footer .rating-3 .im:nth-child(-n + 3) {
  color: #fdd806;
}

#courses-main .banner-footer .rating-4 .im {
  color: #787d81;
}

#courses-main .banner-footer .rating-4 .im:nth-child(-n + 4) {
  color: #fdd806;
}

#courses-main .banner-footer .rating-5 .im {
  color: #787d81;
}

#courses-main .banner-footer .rating-5 .im:nth-child(-n + 5) {
  color: #fdd806;
}

#courses-main .banner-footer .btn a {
  color: #fff;
}

#courses-main .course-contact-link {
  text-align: left;
  display: block;
  width: 100%;
  color: #a2a7ac;
}

#courses-main .course-contact-link .btn a {
  color: #fff;
}

@media only screen and (min-width: 992px) {
  #courses-main .container {
    max-width: 992px;
  }
}

@media only screen and (min-width: 768px) {
  #courses-main .banner {
    display: flex;
  }

  #courses-main .banner-footer {
    width: 100%;
    padding: 15px;
  }

  #courses-main .banner-footer .btn {
    margin-left: auto;
    margin-right: 0;
  }

  #courses-main .img-container {
    height: 325px;
    width: 100%;
    max-width: 35%;
  }

  #courses-main .img-container .course-logo {
    width: 160px;
  }

  #courses-main .banner:nth-child(2) .img-container .course-logo {
    width: 160px;
  }

  #courses-main .banner:nth-child(3) .img-container .course-logo {
    width: 160px;
  }
}

@media only screen and (min-width: 576px) {
  #courses-main .banner:nth-child(2) .img-container .course-logo {
    width: 347px;
  }

  #courses-main .banner:nth-child(3) .img-container .course-logo {
    width: 347px;
  }
}

/* #login {
  color: #a2a7ac;
  min-height: 700px;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #1c1d20;
} */
/*
#login .content {
  margin: auto;
  position: relative;
  display: block;
  width: 100%;
  max-width: 600px;
  height: 580px;
  background-color: #282a2c;
  box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.137);
  -webkit-box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.137);
  -moz-box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.137);
  border: 1px solid #3f4144;
  border-radius: 0 0 2px 2px;
}

@media only screen and (min-width: 400px) {
  #login .content {
    min-width: 350px;
  }
}

@media only screen and (min-width: 576px) {
  #login .content {
    min-width: 550px;
  }
}

@media only screen and (min-width: 768px) {
  #login .content {
    min-width: 600px;
    height: auto;
    padding: 0;
    margin-top: 150px;
  }
}

#login input {
  color: #a2a7ac;
  border-color: #3f4144;
  background-color: #313336;
}

#login .menu-dot-container {
  margin: -1px;
  position: absolute;
  right: 0;
  left: 0;
  width: auto;
  display: flex;
  align-items: center;
  height: 45px;
  background-color: #bb052c;
  border-radius: 2px 2px 0 0;
  border: 1px solid #bb052c;
}

#login .menu-dot-container span {
  color: #fff;
  cursor: pointer;
  margin-left: 15px;
  display: flex;
  align-items: center;
  font-size: 0.9rem;
}

#login .menu-dot-container span .im {
  font-size: 0.6rem;
  margin-right: 6px;
  margin-top: 2px;
  height: 100%;
} */
/*
#login .form {
  display: block;
  padding: 15px;
}

#login .form h1 {
  text-align: center;
  margin: 6rem auto 2rem auto;
}

#login .form form {
  margin-top: 50px;
  position: relative;
  width: auto;
  height: auto;
}

#login .form form input {
  margin: 20px 0 0 0 !important;
  width: 100%;
}

#login .form form .btn {
  display: block;
  margin: 50px auto 0 auto;
} */

/* #login .login-footer {
  display: block;
  position: relative;
  width: 100%;
}

#login .login-footer ul {
  width: 100%;
  height: 60px;
  display: flex;
  flex-direction: column;
  text-align: center;
  justify-content: center;
  padding: 0;
  margin-top: 15px;
}

#login .login-footer ul li {
  list-style: none;
  margin: 5px 15px;
}

#login .login-footer ul li a {
  font-size: 0.9rem;
  color: #a2a7ac;
  text-decoration: none;
  opacity: 0.8;
} */

#Capa_1 {
  width: 70%;
  max-width: 700px;
  height: auto;
}

.hdiw-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
  padding-top: 9rem;
  padding-bottom: 4rem;
}

.hdiw-title h1 {
  font-weight: bolder;
  font-size: min(6vw, 2.5rem);
  color: #a2a7ac;
}

.content-hdiw {
  display: flex;
  width: 100%;
  justify-content: center;
  align-items: center;
  height: auto;
  padding: 0 0 3rem 0;
}

.hdiw-image {
  width: 70%;
  max-width: 700px;
  height: auto;
}

.hdiw-box-text-container {
  display: flex;
  justify-content: center;
}

.hdiw-box-text {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  gap: 0.75rem;
  padding: 2rem 0.75rem 2rem 0.75rem;
  font-size: min(5vw, 0.9rem);
}

@media only screen and (min-width: 992px) {
  .hdiw-box-text {
    max-width: 1200px;
  }
}

.hdiw-box-text .box-text {
  padding: 1.5rem 0.75rem 0.75rem 0.75rem;
  background-color: #282a2c;
  border-radius: 5px;
  border: 1px solid #313336;
}

.hdiw-box-text .box-text b {
  display: flex;
  padding-bottom: 0.3rem;
  margin-bottom: 0.75rem;
  color: #ccd2d8;
  border-bottom: 1px solid #313336;
}

.hdiw-box-text .box-text p {
  color: #a2a7ac;
}

.content-map-bg {
  position: relative;
}

.airplane-image {
  position: absolute;
  right: 0;
  left: 0;
  z-index: 2;
  transform: translateY(-300px);
  opacity: 0;
  display: block;
  width: min(15vw, 90px);
  height: auto;
  margin: -2rem auto 0 auto;
}

.map-box-text {
  padding: 3rem 0.75rem;
  display: block;
  width: auto;
  color: #a2a7ac;
}

.map-box-text h2 {
  font-size: min(7vw, 2rem);
  font-weight: bold;
}

.map-box-text p {
  max-width: 300px;
  font-size: min(5vw, 0.9rem);
}

.map-image-container {
  position: relative;
  display: flex;
  justify-content: center;
  width: auto;
  padding: 4rem 0;
  margin: -5rem 0 0 0;
}

.map-image {
  display: flex;
  width: 90%;
  max-width: 700px;
  height: auto;
}

.map-image-info {
  position: absolute;
  left: 0;
  bottom: 5%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.map-image-info h2 {
  font-size: min(5vw, 2rem);
}

.map-image-info p {
  font-size: min(5vw, 0.9rem);
}

@media only screen and (min-width: 768px) {
  .map-image-info {
    bottom: 25%;
    left: 10%;
  }
}

.map-title {
  display: flex;
  justify-content: center;
  width: 100%;
}

.map-title ul {
  width: 100%;
  padding: 0;
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 10rem), 1fr));
}

.map-title ul li {
  display: inline-flex;
  gap: 0.4rem;
  align-items: center;
  list-style: none;
  font-size: min(4vw, 0.9rem);
  margin: 0rem 0;
  border-bottom: 1px solid #313336;
  padding-bottom: 0.5rem;
}

@media only screen and (min-width: 992px) {
  .map-title ul {
    max-width: 1200px;
  }
}

.n-country {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background-color: #282a2c;
  border: 1px solid #313336;
  border-radius: 50%;
  font-size: 0.8rem;
}

.title-space {
  color: #ccd2d8;
  margin: 9rem 0 3rem 0;
}

.MultiCarousel-inner {
  color: #ccd2d8;
  display: flex;
  gap: 25px;
}

.MultiCarousel-inner .item {
  display: flex;
  flex-direction: column;
  background-color: #37393b;
  padding: 0.75rem;
  border-radius: 2px;
  border-bottom: 1px solid #bb052c;
}

.MultiCarousel-inner .item .imgTitle img {
  width: 100%;
  border: 7px solid #3f4144;
  border-radius: 50%;
}

.MultiCarousel-inner .item h2 {
  font-size: min(4vw, 1.2rem);
  font-weight: bolder;
}

.MultiCarousel-inner .item p {
  padding: 1rem;
}

.MultiCarousel-inner .item p:first-child {
  display: block;
  border-bottom: 1px solid #3f4144;
}

.MultiCarousel-inner .item p:last-child {
  font-size: min(4vw, 0.9rem);
  margin-top: 0;
  margin-top: auto;
}

.MultiCarousel-inner .item .text-center {
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #3f4144;
  margin-bottom: 2rem;
}

.MultiCarousel-inner .item .icon-team {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  text-decoration: none;
  color: #787d81;
  transition: color 0.2s;
  border-top: 1px solid #3f4144;
  padding-top: 0.75rem;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.MultiCarousel-inner .item .icon-team:hover {
  color: #bb052c;
}

.MultiCarousel .btn {
  display: inline-flex;
  width: 40px;
  height: 40px;
  padding: 0;
}

.MultiCarousel .btn .icon {
  width: 35px;
  height: 35px;
}

.MultiCarousel .leftLst,
.MultiCarousel .rightLst {
  background-color: transparent !important;
  border: none !important;
  position: absolute;
  border-radius: 0.1rem;
  top: calc(50% - 20px);
}

.MultiCarousel .leftLst {
  left: -0.7rem !important;
}

.MultiCarousel .rightLst {
  right: -0.7rem !important;
}

#course-plans {
  display: block;
  height: 100%;
}

#course-plans .section-title {
  margin: 10rem auto 5rem auto;
  position: relative;
  display: flex;
  justify-content: center;
}

#course-plans .section-title h1 {
  color: #a2a7ac;
}

#course-plans .switch-button {
  margin: 0 auto 5rem auto;
  position: relative;
  display: flex;
  width: 230px;
}

#course-plans .switch-button .switch-info {
  pointer-events: none;
  z-index: 2;
  position: absolute;
  display: flex;
  gap: 0.5rem;
  align-items: center;
  justify-content: space-between;
  width: 230px;
  margin: auto;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
}

#course-plans .switch-button .switch-info span {
  font-weight: bold;
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition: color 0.5s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

#course-plans .switch-button .switch-info span:first-child {
  color: #272829;
}

#course-plans .switch-button .switch-info span:last-child {
  color: #a2a7ac;
}

#course-plans .switch-button--checked .switch-info span:last-child {
  color: #272829;
}

#course-plans .switch-button--checked .switch-info span:first-child {
  color: #a2a7ac;
}

#course-plans .switch,
#course-plans input {
  width: 230px;
  height: 45px;
  background-color: #282a2c !important;
}

#course-plans .switch::before,
#course-plans input::before {
  content: "";
  display: inline-flex;
  width: 100px;
  height: 35px;
  border-radius: 1.5rem;
  background-color: #fd9206;
  position: absolute;
  left: 5px;
}

#course-plans .switch:checked,
#course-plans input:checked {
  background-color: #bb052c;
}

#course-plans .switch:checked::before,
#course-plans input:checked::before {
  transform: translateX(118px);
  background-color: #fd9206;
}

.cards-container {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  margin-bottom: 4rem;
}

/* .card {
  width: auto;
  max-width: 350px;
  padding: 0.75rem;
  display: inline-flex;
  flex-direction: column;
  background-color: #282a2c;
  border-radius: 2px;
  margin: auto;
  border: 1px solid #313336;
} */

.card .card--recommended-title {
  display: none;
}

.card--recommended-plan {
  position: relative;
  border: 1px solid #fd9206;
  margin: 3rem auto 1rem auto;
}

.card--recommended-plan .card--recommended-title {
  position: absolute;
  z-index: 2;
  display: inline-flex;
  justify-content: center;
  margin: -2.5rem auto 0 auto;
  width: 100%;
  font-weight: bold;
  color: #272829;
}

.card--recommended-plan::before {
  content: "";
  position: absolute;
  top: -42px;
  right: 0;
  left: -1px;
  margin: auto;
  display: block;
  width: 100%;
  height: 40px;
  background-color: #fd9206;
  border: 1px solid #fd9206;
  border-radius: 2px 2px 0 0;
}

@media only screen and (min-width: 768px) {
  .card {
    margin: 0 auto 0 auto;
  }
}

/* .card-title {
  border: none;
  text-align: center;
  font-size: min(4vw, 2rem);
} */

.card-title-info {
  color: #787d81;
  text-align: center;
}

/* .card-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  border-bottom: 1px solid #313336;
}

.card-body .btn {
  margin: 2rem auto 2rem auto;
  font-weight: bold;
  font-size: 1.2rem;
} */

.card-body-info {
  gap: 0.75rem;
  display: inline-flex;
  align-items: center;
}

.country-currency {
  color: #a2a7ac;
  font-weight: bolder;
  font-size: min(10vw, 1.4rem);
}

.country-price {
  font-weight: bolder;
  color: #fd9206;
  font-size: min(10vw, 4rem);
}

.price-plan {
  color: #a2a7ac;
  margin: 1rem auto;
}

.card-footer {
  display: inline-flex;
  flex-direction: column;
}

.card-footer-title {
  text-align: left;
  display: flex;
  flex-direction: column;
  color: #a2a7ac;
}

.card-footer-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: #a2a7ac;
}

.card-footer-info-profit {
  display: inline-flex;
  gap: 0.5rem;
  align-items: center;
  margin: 0.75rem 0;
}

.card-footer-info-profit .icon {
  color: #31992e;
}

.plan-section-b-container {
  position: relative;
  border-top: 1px solid #313336;
  padding-top: 2rem;
  margin-bottom: 4rem;
}

.plan-section-b-title-container {
  color: #a2a7ac;
  max-width: 700px;
  text-align: center;
  margin: 0 auto;
}

.plan-section-b-title {
  color: #a2a7ac;
  font-size: min(4vw, 2rem);
}

.plan-section-b-list {
  display: flex;
  flex-direction: column;
  padding: 0.75rem;
  border-radius: 2px;
  color: #a2a7ac;
  background-color: #282a2c;
  border: 1px solid #313336;
}

.plan-section-b-item {
  display: block;
  border-bottom: 1px solid #313336;
  margin: 0.75rem 0;
}

.plan-section-b-title-button {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  font-weight: bolder;
  font-size: min(4vw, 1.2rem);
  overflow: hidden;
}

.plan-section-b-title-button .icon {
  margin: 0 0 0 auto;
}

.plan-section-b-info {
  color: #787d81;
  overflow: hidden;
  display: flex;
  height: 0;
}

:root {
  --size: 100px;
  --bord: 10px;
}

#user-dashboard {
  display: block;
  height: 100%;
}

.block-content {
  padding: 0.75rem;
  margin: 10rem auto 4rem auto;
  display: block;
  width: auto;
  background-color: #282a2c;
  border-radius: 5px;
  border: 1px solid #313336;
}

.user-banner-info {
  position: relative;
  max-width: 350px;
  display: flex;
  flex-direction: column;
  background-color: #313336;
  border-radius: 2px;
  width: 100%;
  gap: 0.75rem;
  margin: 2rem auto 3rem auto;
  border: 1px solid #3f4144;
}

.user-banner-info::after {
  content: "";
  display: block;
  position: absolute;
  width: 25px;
  height: 25px;
  background-color: #313336;
  bottom: -13px;
  border-radius: 2px;
  border-width: 0px 1px 1px 0px;
  border-style: solid;
  border-color: #3f4144;
  right: 0;
  left: 0;
  margin: 0 auto;
  transform: rotate(45deg);
}

.user-title {
  margin: 1rem 0 0rem 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  align-items: center;
  color: #a2a7ac;
}

.overall-progress-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  text-align: center;
  margin: 0 0 4rem 0;
}

.overall-progress-title {
  color: #a2a7ac;
}

.overall-progress {
  margin: 0 auto;
  position: relative;
  display: inline-flex;
  align-items: center;
  width: 220px;
  height: 8px;
  border-radius: 0.7rem;
  background-color: #3f4144;
}

.overall-progress-bar {
  display: inline-flex;
  margin: 0 0 0 0;
  width: 0;
  height: 100%;
  border-radius: 0.7rem;
  background-color: #bb052c;
}

.overall-progress-info {
  color: #000;
  display: inline-flex;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -2rem;
  top: 0;
  margin: auto 0;
  align-items: center;
  justify-content: center;
  font-size: min(4vw, 0.8rem);
  color: #fff;
}

.user-image {
  display: block;
  width: 140px;
  height: 140px;
  border-radius: 50%;
}

.user-photo-edit {
  display: flex;
  justify-content: center;
  flex-flow: row;
  box-sizing: border-box;
  width: auto;
  margin: 0 0 2rem 0;
}

.user-photo-edit input[type="file"] {
  display: none;
}

.user-photo-edit button[type="button"],
.user-photo-edit .btn {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}

#user-personal-info-form {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 25rem), 1fr));
  margin: 2rem 0 0rem 0;
  border-bottom: 1px solid #313336;
}

#user-personal-info-form label,
#user-personal-info-form .nw-input {
  color: #a2a7ac;
}

#user-personal-info-form input:disabled,
#user-personal-info-form .nw-input:disabled {
  pointer-events: none !important;
  border-width: 0 0 0 0;
  background-color: #2c2e30 !important;
  color: #787d81;
}

#user-personal-info-form .icon {
  width: min(10vw, 18px);
  height: min(10vw, 18px);
  pointer-events: all;
  color: #787d81;
  position: absolute;
  z-index: 2;
  right: 0.75rem;
  bottom: 0.7rem;
  transition: color 0.3s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

#user-personal-info-form .icon:hover {
  color: #a2a7ac;
}

.user-section-title {
  font-size: min(4vw, 1.8rem);
  text-align: center;
  color: #a2a7ac;
  margin: 3rem 0;
}

.form-section {
  display: flex;
  flex-direction: column;
  position: relative;
}

.user-form-footer {
  grid-row-start: 5;
  grid-row-start: 5;
  height: 50px;
  display: flex;
  width: 100%;
  justify-content: right;
  gap: 0.75rem;
  margin: 1rem 0 0 0;
}

@media only screen and (min-width: 992px) {
  .user-form-footer {
    grid-column-end: 3;
  }
}

.user-form-footer .btn {
  display: none;
}

.user-courses-container {
  display: grid;
  gap: 0.75rem;
}

.user-courses-container--resources {
  width: auto;
  padding: 0.75rem;
  justify-content: center;
  box-sizing: border-box;
  margin: 0 auto 3rem auto;
  gap: 2rem 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 13rem), 1fr));
}

.user-courses {
  max-width: 350px;
  position: relative;
  display: block;
  margin: 0 auto;
  border-radius: 2px;
  overflow: hidden;
  background-color: #313336;
  border: 1px solid #3f4144;
}

@media only screen and (min-width: 576px) {
  .user-courses {
    max-width: none;
    display: flex;
    width: 100%;
  }

  .user-courses .user-image-courses {
    display: inline-flex;
    -o-object-fit: fill;
    object-fit: fill;
    width: 200px;
    height: auto;
  }
}

.user-image-courses {
  display: block;
  -o-object-fit: scale-down;
  object-fit: scale-down;
  width: 100%;
  height: 180px;
}

.user-courses-info {
  display: block;
  color: #ccd2d8;
  padding: 0.75rem;
}

.user-courses-info h3 {
  font-size: min(5vw, 1rem);
}

.user-courses-info label {
  display: block;
  margin-bottom: 0.5rem;
  font-size: min(4vw, 1rem);
}

.user-courses-description {
  color: #a2a7ac;
  font-size: min(4vw, 0.9rem);
}

.user-courses-author {
  font-size: min(4vw, 0.9rem);
}

.user-progress-bar[value] {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 100%;
  height: 20px;
}

.user-progress-bar[value]::-webkit-progress-bar {
  height: 6px;
  border-radius: 0.5rem;
  background-color: #3f4144;
}

.user-progress-bar[value]::-webkit-progress-value {
  border-radius: 0.5rem;
  background-color: #fd9206;
}

.icon-password {
  display: none;
}

.section-content {
  display: none;
}

.section-content--active {
  display: block;
}

.nav-sections {
  margin: 5rem 0 2rem 0;
  width: 100%;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  color: #a2a7ac;
  font-size: min(4vw, 1.3rem);
  border-width: 0 0 1px 0;
  border-style: solid;
  border-color: #3f4144;
}

.nav-section-item {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  width: auto;
  height: 100%;
  padding: 0.5rem 1rem;
  transition: background-color 0.2s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.nav-section-item--active {
  position: relative;
}

.nav-section-item--active::before {
  content: "";
  position: absolute;
  bottom: -2px;
  display: block;
  width: 100%;
  height: 1px;
  border-bottom: 1px solid #bb052c;
}

.resource-content {
  position: relative;
  display: flex;
  margin: 0 auto;
  height: 100%;
  max-width: 200px;
  transition: transform 0.3s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.resource-content:hover {
  transform: scale(1.04);
}

.resource-content-cover {
  position: relative;
  overflow: hidden;
  box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.137);
  -webkit-box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.137);
  -moz-box-shadow: 1px 1px 10px 0px rgba(0, 0, 0, 0.137);
}

.resource-checker-mark {
  display: flex;
  width: 30px;
  height: 30px;
  position: absolute;
  z-index: 3;
  right: -0.5rem;
  top: -0.5rem;
  background-color: #31992e;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.resource-checker-unmark {
  display: flex;
  width: 30px;
  height: 30px;
  position: absolute;
  z-index: 3;
  right: -0.5rem;
  top: -0.5rem;
  background-color: #a2a7ac;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.img-container {
  border-radius: 5px;
  overflow: hidden;
  pointer-events: none;
}

.img-container img {
  -o-object-position: center;
  object-position: center;
  -o-object-fit: cover;
  object-fit: cover;
  display: block;
  width: 100%;
  height: 320px;
  -webkit-backface-visibility: hidden;
  transform: translateZ(0);
}

.resource-content-footer {
  visibility: hidden;
  opacity: 0;
  transform: translateY(100%);
  font-size: min(4vw, 0.9rem);
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  width: 100%;
  padding: 0.75rem;
  margin: 0 0 0 0;
  position: absolute;
  color: #fff;
  top: auto;
  bottom: 0;
  background-color: #1c1d20;
  border-radius: 0 0 5px 5px;
}

.resource-content-footer a {
  text-decoration: none;
  color: #fff;
}

.resource-content-footer li {
  gap: 0.75rem;
  display: inline-flex;
  align-items: center;
  list-style: none;
  padding: 0.5rem;
  border-bottom: 1px solid #313336;
}

.resource-content-footer p {
  font-size: min(4vw, 0.8rem);
  color: #a2a7ac;
}

.resource-content-footer .switch {
  transform: scale(0.7);
  transform-origin: left;
}

.resource-link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.resource-link .icon {
  width: min(10vw, 16px);
  height: min(10vw, 16px);
  margin-right: 0.5rem;
}

#payment-form {
  margin-top: 6rem;
  margin-bottom: 6rem;
  color: #a2a7ac;
  border-radius: 5px;
}

#payment-form .table-header,
#payment-form .table-body {
  border: none;
  background-color: transparent;
}

#payment-form .table-header .table-cell,
#payment-form .table-body .table-cell {
  border: none;
  padding: 1rem 0;
}

#payment-form .table-header .table-cell h5,
#payment-form .table-header .table-cell h4,
#payment-form .table-body .table-cell h5,
#payment-form .table-body .table-cell h4 {
  margin: 0;
}

#payment-form .form-group {
  margin: 0;
}

.payment-form-content {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr));
}

.form-section-container {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr));
}

.form-section-container .form-section {
  position: relative;
  box-sizing: border-box;
  background-color: #282a2c;
  padding: 0.75rem;
  border-radius: 5px;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #3f4144;
  transition: border 0.2s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.form-section-container .form-section--first {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

@media only screen and (min-width: 992px) {
  .form-section-container .form-section--first {
    grid-column: span 2;
  }

  .form-section-container .form-section--last {
    grid-column: span 1;
  }
}

.form-section-container .form-section--border:hover {
  border-color: #fd9206;
}

.form-section-container .form-section--border:hover .bar-index {
  background-color: #313336;
  color: #fd9206;
  border: 1px solid #fd9206;
}

.form-section-container .form-section--active {
  border-color: #fd9206;
}

.form-section-container .form-section--active .bar-index {
  border: 1px solid #fd9206;
}

.form-container {
  display: none;
  height: 0;
  overflow: hidden;
  padding: 0;
}

.form-container--open {
  display: block;
  padding: inherit;
}

.form-title {
  display: flex;
  width: 100%;
  justify-content: center;
  margin: 2rem 0 4rem 0;
}

.bar-title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1.2rem 0rem;
  width: 100%;
  box-sizing: border-box;
}

.bar-title h4 {
  margin: 0;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.bar-index {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  color: #ccd2d8;
  font-size: min(6vw, 1rem);
  background-color: #3f4144;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: min(8vw, 35px);
  height: min(8vw, 35px);
  border-radius: 50%;
  transition: background-color 0.2s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.button-group {
  display: flex;
  width: 100%;
  margin: 2rem 0 0 0;
  padding: 2rem 0;
}

.button-group--border-t {
  border-top: 1px solid #3f4144;
}

.button-group--border-b {
  border-bottom: 1px solid #3f4144;
}

.table-sumary-info {
  position: relative;
  display: block;
  width: 100%;
}

.table-sumary-info .form-section {
  top: 0;
  position: sticky;
}

.icon {
  pointer-events: none;
  width: min(5vw, 24px);
  height: min(5vw, 24px);
}

.icon use {
  pointer-events: none;
}

.icon__btn {
  padding: 0.3rem;
  transition: background-color 0.3s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
  border-radius: 2px;
}

.icon__btn:hover {
  background-color: #ccd2d8;
}

.icon__bg--lg {
  padding: 15px;
}

.icon__bg--xl {
  padding: 20px;
}

.icon-rounded {
  background-color: #bb052c;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 2px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
}

.swith-button {
  display: block;
  width: auto;
}

.switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: 55px;
  height: 27px;
  background-color: #a2a7ac;
  border-radius: 3rem;
}

.switch::before {
  content: "";
  display: inline-flex;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background-color: #787d81;
  position: absolute;
  left: 4px;
  transition: all 0.3s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.switch:checked {
  background-color: rgba(253, 146, 6, 0.08) !important;
  border-color: #fd9206 !important;
}

.switch:checked::before {
  transform: translateX(27px);
  background-color: #fd9206;
}

/* ------------------------------  Select ------------------------------ */
.element-select-hide {
  display: none !important;
  visibility: hidden !important;
}

.nw-select-wrapp-line {
  width: auto;
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  border-bottom: 1px solid #313336;
}

.nw-select-wrapp-line .label {
  margin: 0;
  font-weight: bold;
}

.nw-select-wrapp-line .nw-input {
  color: #a2a7ac;
  background-color: transparent;
  border-width: 0 0 0px 0;
}

.nw-select-wrapp-small .label {
  font-size: min(5vw, 0.8rem);
}

.nw-select-wrapp-small .nw-input {
  font-size: min(5vw, 0.8rem);
  padding: 0.25rem 0.75rem 0.25rem 0.75rem;
}

.nw-select-wrapp-small .nw-dropdown li {
  height: 29px;
  font-size: min(5vw, 0.8rem);
}

.nw-select-wrapp-large .nw-input {
  font-size: min(5vw, 1.1rem);
  padding: 0.8rem 0.75rem 0.8rem 0.75rem;
}

.nw-select-wrapp-large .nw-dropdown li {
  height: 45px;
  font-size: min(5vw, 1.1rem);
}

.nw-select-container {
  display: block;
  width: auto;
  position: relative;
  /* Track */
  /* Handle */
}

.nw-select-container .nw-icon {
  pointer-events: none;
  cursor: default;
  z-index: 1;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  right: 0.75rem;
  left: auto;
  display: block;
  width: 10px;
  height: 10px;
  opacity: 1;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCA3LjMzbDIuODI5LTIuODMgOS4xNzUgOS4zMzkgOS4xNjctOS4zMzkgMi44MjkgMi44My0xMS45OTYgMTIuMTd6Ii8+PC9zdmc+");
  background-repeat: no-repeat;
  background-size: contain;
  background-color: transparent;
  transition: transform 0.3s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
  filter: invert(50%);
}

.nw-select-container .nw-icon-rotate {
  transform: rotate(180deg);
}

.nw-select-container ::-webkit-scrollbar {
  width: 0.5em;
}

.nw-select-container ::-webkit-scrollbar-track {
  background-color: #313336;
  border-radius: 0;
  margin-bottom: 0rem;
}

.nw-select-container ::-webkit-scrollbar-thumb {
  background: #787d81;
  border-radius: 0.2em;
}

.nw-select-container input[type="button"] {
  text-align: left;
}

.nw-input {
  background-color: transparent;
  box-sizing: border-box;
  padding: 0.6rem 0.75rem 0.6rem 0.75rem;
  color: inherit;
  outline: none;
  border-width: 1px 1px 1px 1px;
  border-style: solid;
  border-color: #a2a7ac;
  width: 100%;
  opacity: 1;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 2px;
  -webkit-text-fill-color: inherit;
  /* Override iOS / Android font color change */
  -webkit-opacity: 1;
  /* Override iOS opacity change affecting text & background color */
  -webkit-user-select: text;
  -moz-user-select: text;
  user-select: text;
}

.nw-input:focus {
  background-color: transparent;
  border-color: #bb052c;
  transition: all 0.6s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.nw-input::-moz-placeholder {
  color: #787d81;
  opacity: 1;
  /* Firefox */
}

.nw-input::placeholder {
  color: #787d81;
  opacity: 1;
  /* Firefox */
}

.nw-dropdown-container {
  height: auto;
  display: block;
  position: relative;
  width: auto;
}

.nw-dropdown-overflow {
  overflow-y: scroll;
}

.nw-dropdown {
  box-sizing: border-box;
  overflow-y: auto;
  visibility: hidden;
  align-items: center;
  position: absolute;
  z-index: 5;
  padding: 0rem 0rem 0rem 0rem;
  margin: 0;
  top: 0.5rem;
  left: 0;
  right: 0;
  width: 100%;
  height: 0;
  max-height: 240px;
  border-width: 1px 1px 1px 1px;
  border-color: #313336;
  border-style: solid;
  border-radius: 5px;
  background-color: #282a2c;
  box-shadow: 0px 8px 9px 0px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0px 8px 9px 0px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: 0px 8px 9px 0px rgba(0, 0, 0, 0.2);
  transition: all 0s;
  transition-timing-function: cubic-bezier(0.17, 0.22, 0.57, 0.36);
}

.nw-dropdown li {
  font-size: min(5vw, 1rem);
  cursor: default;
  display: flex;
  align-items: center;
  text-align: left;
  width: auto;
  height: 40px;
  padding: 0 0.75rem;
  color: #787d81;
  font-size: min(5vw, 0.9rem);
}

.nw-dropdown li:hover {
  background-color: #313336;
  color: #787d81;
}

.nw-dropdown [hidden] {
  display: none !important;
}

.nw-dropdown-shadown-inverse {
  border-radius: 2px 2px 0 0;
  box-shadow: 0px -5px 9px 0px rgba(0, 0, 0, 0.103);
}

.nw-el-list-active {
  height: 40px;
  background-color: #313336 !important;
  color: #a2a7ac !important;
}

.jd-slider {
  position: relative;
  width: 100%;
  margin: 0 auto;
  padding: 0;
  will-change: transform;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  -moz-transform: translateZ(0);
  -ms-transform: translateZ(0);
  -o-transform: translateZ(0);
}

.jd-slider *:focus {
  outline: none;
}

.jd-slider .slide-inner {
  overflow: hidden;
  position: relative;
  width: 100%;
}

.jd-slider .slide-area {
  width: 100%;
  margin: 0;
  padding: 0;
}

.jd-slider .slide-area:after {
  display: block;
  content: "";
  clear: both;
}

.jd-slider .slide-area li {
  overflow: hidden;
  position: relative;
  display: none;
  float: left;
  width: 100%;
}

.jd-slider .slide-area li:first-child {
  display: block;
}

.jd-slider .slide-area li img {
  display: block;
  width: 100%;
}

.jd-slider .next,
.jd-slider .prev {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background-color: #000;
}

.jd-slider .hidden.next,
.jd-slider .hidden.prev {
  display: none;
}

.jd-slider .next .im,
.jd-slider .prev .im {
  color: #333;
  font-size: 1em;
}

.jd-slider .prev {
  display: flex;
  left: 0;
  height: 50px;
  text-decoration: none;
  width: 35px;
  transition: width 200ms ease-in-out;
  -webkit-transition: width 200ms ease-in-out;
  -moz-transition: width 200ms ease-in-out;
  -ms-transition: width 200ms ease-in-out;
  -o-transition: width 200ms ease-in-out;
}

.jd-slider .prev svg {
  align-self: center;
  margin: 0 auto;
}

.jd-slider .prev:hover {
  width: 50px;
}

.jd-slider .next {
  display: flex;
  right: 0;
  height: 50px;
  text-decoration: none;
  width: 35px;
}

.jd-slider .next svg {
  align-self: center;
  margin: 0 auto;
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}

.jd-slider .next:hover {
  width: 50px;
  transition: width 200ms ease-in-out;
  -webkit-transition: width 200ms ease-in-out;
  -moz-transition: width 200ms ease-in-out;
  -ms-transition: width 200ms ease-in-out;
  -o-transition: width 200ms ease-in-out;
}

.jd-slider .controller {
  position: absolute;
  bottom: 20px;
  width: 100%;
  text-align: center;
}

.jd-slider .controller .auto {
  display: inline-block;
  vertical-align: middle;
}

.jd-slider .controller .auto i {
  display: none;
  color: #333;
}

.jd-slider .controller .auto.pause .fa-pause {
  display: block;
}

.jd-slider .controller .auto.play .fa-play {
  display: block;
}

.jd-slider .controller .indicate-area {
  display: inline-block;
}

.jd-slider .controller .indicate-area a {
  display: inline-block;
  position: relative;
  width: 25px;
  height: 5px;
  margin: 0 5px;
  font-size: 0;
  color: transparent;
  vertical-align: middle;
}

.jd-slider .controller .indicate-area a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: inherit;
  height: inherit;
  box-sizing: border-box;
  background-color: rgba(252, 252, 252, 0.2470588235);
  opacity: 1;
}

.jd-slider .controller .indicate-area a.on:after {
  background-color: #000;
}

.jd-slider a {
  font-size: 1.1em;
}

.jd-slider.fade .slide-area li {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transform: translateZ(0);
}

.jd-slider.fade .slide-area li:first-child {
  position: static;
  opacity: 1;
}

.jd-slider.slider--none .prev,
.jd-slider.slider--none .next,
.jd-slider.slider--none .controller {
  display: none;
}

.container-nav {
  display: none;
  flex-direction: column;
  position: fixed;
  padding: 0.75rem;
  z-index: 3;
  top: 50%;
  left: auto;
  transform: translate(-220px, -50%);
  width: 180px;
  gap: 0.75rem;
  background-color: #282a2c;
  border-radius: 2px;
  border: 1px solid #313336;
  box-shadow: var(--shadow-elevation-high);
}

@media only screen and (min-width: 1300px) {
  .container-nav {
    display: flex;
  }
}

.btn-nav-title {
  pointer-events: none;
  display: flex;
  gap: 0rem;
  width: 100%;
  align-items: center;
  padding: 0.3rem 0;
  opacity: 0.5;
}

.btn-nav-title .icon {
  width: min(10vw, 18px);
  height: min(10vw, 18px);
}

.btn-nav-title .icon--01 {
  color: #787d81;
}

.btn-nav-title .icon--02 {
  color: #787d81;
}

.btn-nav-title .icon--03 {
  color: #787d81;
}

.btn-nav-title .icon--04 {
  color: #787d81;
}

.btn-nav-title:hover {
  opacity: 1;
}

.btn-nav-title:hover::after {
  width: 100%;
}

@media only screen and (min-width: 992px) {
  .btn-nav-title .icon {
    width: min(10vw, 25px);
    height: min(10vw, 25px);
  }
}

.color-inherit {
  color: inherit !important;
}

.btn-nav-title-active {
  opacity: 1;
}

.btn-nav-title-active .icon--01 {
  color: #fff111;
}

.btn-nav-title-active .icon--02 {
  color: #46edff;
}

.btn-nav-title-active .icon--03 {
  color: #fc3186;
}

.btn-nav-title-active .icon--04 {
  color: #bf66fe;
}

.btn-nav {
  overflow: hidden;
  position: relative;
  display: block;
  width: 100%;
  font-size: min(5vw, 1rem);
  border-bottom: 1px solid #313336;
  padding: 0.3rem 0;
}

.btn-nav small {
  pointer-events: none;
  opacity: 0.5;
}

.btn-nav:hover .btn-nav-title {
  opacity: 1;
}

.btn-nav:hover .btn-nav-title .icon {
  transition: all 0.5s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.btn-nav:hover .btn-nav-title .icon--01 {
  color: #fff111;
}

.btn-nav:hover .btn-nav-title .icon--02 {
  color: #46edff;
}

.btn-nav:hover .btn-nav-title .icon--03 {
  color: #fc3186;
}

.btn-nav:hover .btn-nav-title .icon--04 {
  color: #bf66fe;
}

.btn-nav:hover small {
  opacity: 1;
}

.btn-nav-label {
  padding: 0.3rem 0;
  position: relative;
  left: 1rem;
  display: flex;
  gap: 0.5rem;
  pointer-events: none;
  overflow: hidden;
  width: 180px;
  opacity: 1;
  z-index: -1;
}

@media only screen and (min-width: 992px) {
  .btn-nav-label {
    font-size: min(4vw, 1rem);
  }
}

.btn-nav-label small {
  font-size: min(4vw, 0.7rem);
}

.btn-nav-link {
  cursor: default;
  list-style: none;
  padding: 0.75rem 0;
  border-bottom: 1px solid #3f4144;
  transition: all 0.2s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.btn-nav-link:hover {
  color: #bb052c;
}

.main-nav-menu-alternate {
  z-index: -1;
  display: none;
  position: absolute;
  top: 113px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100vh;
  overflow-y: auto;
}

.main-nav-menu-alternate::-webkit-scrollbar {
  width: 0em;
  height: 0em;
}

.menu-alternate-container {
  display: block;
  position: relative;
  top: 7px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.795);
}

.menu-alternate-list {
  padding: 2rem 0;
  display: flex;
  flex-direction: column;
  width: auto;
  background-color: #282a2c;
}

.menu-alternate-item {
  font-weight: bolder;
  display: flex;
  flex-direction: column;
  justify-content: left;
  gap: 0rem;
  width: auto;
  background-color: #282a2c;
  list-style: none;
  border-top: 0px solid transparent;
  border-bottom: 0px solid #313336;
  transition: background-color 0.1s ease-in-out;
}

.menu-alternate-item:last-child .menu-alternate-dropdown .menu-alternate-inner-item:last-child {
  padding-bottom: 3rem;
}

.menu-alternate-item .icon {
  right: 0.75rem;
  position: absolute;
  margin: auto;
  pointer-events: none;
  width: min(10vw, 24px);
  height: min(10vw, 24px);
}

/* .menu-alternate-item .alt-link {
  width: auto;
  padding: 0.75rem;
  text-decoration: none;
  color: #a2a7ac;
} */

.menu-alternate-item .alt-drop-link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  width: auto;
  padding: 0.75rem;
  text-decoration: none;
  color: #787d81;
}

.menu-alternate-item .alt-drop-link .icon {
  right: 0rem;
  position: relative;
  margin: auto;
  pointer-events: none;
  width: min(10vw, 18px);
  height: min(10vw, 18px);
}

.menu-alternate-item .alt-drop-link--col {
  display: inline-flex;
  flex-direction: column;
  width: auto;
}

.menu-alternate-item .alt-drop-link--col .icon {
  margin: 0;
}

.menu-alternate-item:hover {
  border-top: 0px solid transparent;
  border-bottom: 0px solid transparent;
  background-color: #bb052c;
}

/* .menu-alternate-item:hover .alt-link {
  color: #a2a7ac;
} */

.menu-alternate-item:hover .menu-alternate-title {
  color: #f4f6f7;
}

.menu-alternate-title {
  pointer-events: none;
  width: auto;
  padding: 0.75rem;
  text-decoration: none;
  color: #a2a7ac;
  gap: 1rem;
}

.menu-alternate-dropdown {
  display: none;
  height: 0;
  background-color: #1c1d20;
  overflow: hidden;
}

.menu-alternate-inner-item {
  display: flex;
  width: 100%;
  font-weight: normal;
  font-size: min(5vw, 1rem);
}

.menu-alternate-inner-item a {
  color: #787d81;
  transition: color 0.2s ease-in-out;
}

.menu-alternate-inner-item:hover a {
  color: #ccd2d8;
}

.inner-info-container {
  display: inline-flex;
  justify-content: left;
  width: auto;
  flex-direction: column;
}

.inner-info {
  display: inline-flex;
  width: auto;
  align-items: center;
  gap: 0.75rem;
  margin: 0.5rem 0 0.5rem 0;
  color: #a2a7ac;
}

.inner-info .icon {
  color: #bb052c;
}

.inner-info:last-child {
  padding-bottom: 1rem;
  border-bottom: 1px solid #313336;
}

/* :root {
  --nav-height: 70px;
} */

/* @media only screen and (min-width: 1000px) {
  .nav-set {
    transform: none !important;
  }
} */

.main-nav-button {
  position: absolute;
  padding: 0.3rem;
  z-index: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 40px;
  right: 0;
  left: 0;
  top: 5.9rem;
  bottom: 0;
  margin: auto;
  background-color: #282a2c;
  border-radius: 0;
  border-bottom: 1px solid #3f4144;
}

@media only screen and (min-width: 1000px) {
  .main-nav-button {
    display: none;
  }
}

.nav-button-container {
  position: relative;
  display: block;
  margin: 0 auto 0 0rem;
  height: 25px;
  width: 25px;
  padding: 0.2rem;
  border: 1px solid transparent;
  border-radius: 5px;
}

.nav-button-container--active .nav-button-bar:nth-child(2) {
  opacity: 0;
}

.nav-button-container--active .nav-button-bar:first-child {
  transform: rotate(45deg);
  transform-origin: center;
  top: -1px;
}

.nav-button-container--active .nav-button-bar:last-child {
  transform: rotate(-45deg);
  transform-origin: center;
  bottom: 1px;
}

.nav-button-bar {
  pointer-events: none;
  position: absolute;
  display: block;
  width: 25px;
  height: 2px;
  background-color: #787d81;
  margin: auto;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  border-radius: 0.1rem;
  transition: rotate, top, bottom, 0.2s ease-in-out;
}

.nav-button-bar:first-child {
  top: -12px;
}

.nav-button-bar:last-child {
  bottom: -12px;
}

/* #nav {
  position: relative;
  display: flex;
  top: 0;
  z-index: 4;
  position: fixed;
  width: 100%;
  height: var(--nav-height);
  background-color: #313336;
  transform: translateY(-100%);
} */

@media only screen and (min-width: 1000px) {
  #nav {
    transform: translateY(0%);
  }
}

/* .nav-container {
  padding: 0;
  display: flex;
  align-items: center;
  width: 100%;
} */

/* .image-primary {
  display: none;
  padding: 0.75rem;
}

.image-primary img {
  display: block;
  width: 30px;
  height: auto;
} */

/* @media only screen and (min-width: 1000px) {
  .image-primary {
    display: block;
  }
} */

.image--alt {
  display: block;
  justify-content: center;
  margin: -20px auto 2rem auto;
}

.image--alt p {
  margin: 0.5rem 0 0 0;
  color: #787d81;
  font-size: min(5vw, 0.9rem);
}

.image--alt img {
  margin: 0 auto;
  display: block;
  width: 40px;
  height: auto;
}

/* .main-nav-links-container {
  margin: 0 auto;
  display: none;
  justify-content: space-between;
  gap: 0 0;
  align-items: center;
  width: auto;
  height: 100%;
}

@media only screen and (min-width: 1000px) {
  .main-nav-links-container {
    display: block;
  }
} */

/* .main-nav-link-label {
  cursor: pointer;
  position: relative;
  padding: 0 1rem;
  list-style: none;
  display: inline-flex;
  align-items: center;
  width: auto;
  text-align: center;
  height: 100%;
  justify-content: center;
} */
/*
.main-nav-link-label .main-nav-a {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  text-align: center;
  text-decoration: none;
  color: #ccd2d8;
  z-index: 2;
  display: block;
  margin: auto;
  transition: color 0.4s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.main-nav-link-label::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  width: 0;
  height: 100%;
  opacity: 0;
  background-color: transparent;
  transition: width 0.4s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.main-nav-link-label:hover .main-nav-a {
  color: #fff;
}

.main-nav-link-label:hover::after {
  opacity: 1;
  width: 100%;
  background-color: #bb052c;
}

.main-nav-link-label--active .main-nav-a {
  color: #fff;
}

.main-nav-link-label--active::after {
  width: 100%;
  opacity: 1;
  border-bottom: 3px solid #bb052c;
  background-color: #282a2c;
  margin-bottom: 3px;
} */

/* .nav-tool-options {
  display: inline-flex;
  align-items: center;
  margin: 0 0rem 0 auto;
  gap: 0.5rem;
  transform: translateY(58px);
}

@media only screen and (min-width: 1000px) {
  .nav-tool-options {
    transform: translateY(0);
  }
} */
/* 
.social-media-icons {
  margin: 0 0rem 0 0;
  padding: 0.5rem 1rem;
  display: inline-flex;
  gap: 1rem;
  width: auto;
}

.social-media-icons .main-nav-a {
  display: flex;
}

.social-media-icons .main-nav-a .icon {
  cursor: pointer;
  color: #ccd2d8;
  width: min(10vw, 14px);
  height: min(10vw, 14px);
  transition: color 0.2s ease-in-out;
}

.social-media-icons .main-nav-a:hover .icon {
  color: #bb052c;
} */

.main-nav-dropdown {
  position: absolute;
  z-index: 2;
  top: 85px;
  width: auto;
  height: auto;
  display: none;
  width: 180px;
  background-color: #313336;
  border-radius: 5px;
  padding: 2rem 0.75rem;
  border: 1px solid #3f4144;
  box-shadow: var(--shadow-elevation-high);
}

.main-nav-dropdown::after {
  content: "";
  display: none;
  position: absolute;
  right: 0;
  left: 0;
  top: -9px;
  width: 15px;
  height: 15px;
  background-color: #313336;
  transform: rotate(45deg);
  margin: 0 auto;
  border-radius: 2px 0 0 0;
  border-width: 1px 0px 0px 1px;
  border-style: solid;
  border-color: #3f4144;
}

.main-nav-dropdown::before {
  position: absolute;
  margin: auto;
  right: 0;
  left: 0;
  top: -16px;
  content: "";
  display: block;
  width: 100%;
  height: 30px;
  background-color: transparent;
}

.main-nav-dropdown--active {
  display: block;
}
/* 
.main-nav-dropdown-link {
  list-style: none;
  display: flex;
  align-items: center;
  padding: 0.5rem 0;
  font-size: min(4vw, 0.9rem);
  border-bottom: 1px solid #3f4144;
}

.main-nav-dropdown-link a {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-align: left;
  width: 100%;
  color: #a2a7ac;
  text-decoration: none;
  transition: color 0.2s ease-in-out;
}

.main-nav-dropdown-link a .icon {
  width: min(10vw, 18px);
  height: min(10vw, 18px);
}

.main-nav-dropdown-link:hover a {
  color: #ccd2d8;
} */

/* .main-nav-login-handle {
  opacity: 0.7;
  display: flex;
  align-items: center;
} */

/* .main-nav-login-title {
  margin: 0 0 0 auto;
  display: flex;
  gap: 0.5rem;
  align-items: center;
  text-decoration: none;
  color: #ccd2d8;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  font-size: min(4vw, 0.7rem);
  padding: 0.2rem 0.5rem;
  border-radius: 5px;
  transition: background-color 0.2s ease-in-out;
  border: 1px solid transparent;
} */
/* 
.main-nav-login-title .icon {
  width: min(10vw, 18px);
  height: min(10vw, 18px);
}

.main-nav-login-title:hover {
  text-decoration: none;
  color: #fff;
  background-color: #282a2c;
  border: 1px solid #3f4144;
} */

.lang-select {
  display: none;
}

/* .main-nav-language {
  display: block;
  margin: 0 1rem 0 0;
} */

/* .lang-container {
  display: block;
  position: relative;
  width: 45px;
} */

/* .lang-value {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  gap: 0.5rem;
  width: 100%;
  align-items: center;
  color: #a2a7ac;
  font-size: min(4vw, 0.8rem);
  padding: 0.15rem 0.4rem;
  border-radius: 5px;
  border: 1px solid transparent;
  transition: background-color 0.2s ease-in-out;
}

.lang-value img {
  pointer-events: none;
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.lang-value:hover {
  background-color: #282a2c;
  border: 1px solid #3f4144;
} */

/* .lang-list {
  z-index: 5;
  position: absolute;
  top: auto;
  right: 0;
  left: 0;
  width: 45px;
  margin: 5px auto 0 auto;
  display: none;
  background-color: #313336;
  padding: 0.5rem 0.5rem 1rem 0.5rem;
  border-radius: 5px;
  border: 1px solid #3f4144;
  box-shadow: var(--shadow-elevation-high);
}

.lang-list::before {
  content: "";
  display: block;
  width: 100%;
  height: 10px;
  background-color: #46edff;
  position: absolute;
  right: 0;
  left: 0;
  top: -0.7rem;
  opacity: 0;
}

.lang-list-item {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  color: #787d81;
  font-size: min(4vw, 0.8rem);
  padding: 0.3rem;
  border-bottom: 1px solid #3f4144;
  transition: color 0.2s ease-in-out;
}

.lang-list-item img {
  pointer-events: none;
  display: block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
}

.lang-list-item:hover {
  color: #ccd2d8;
} */

.container-nav-alternate {
  position: relative;
  position: fixed;
  gap: 0.75rem;
  width: 260px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: left;
  top: 0.75rem;
  right: 0;
  left: 0;
  background-color: #282a2c;
  padding: 2rem 0.75rem 3rem 0.75rem;
  z-index: 2;
  border-radius: 0;
  border: 1px solid #313336;
  transform: translateY(-85%);
  box-shadow: var(--shadow-elevation-high);
}

@media only screen and (min-width: 1300px) {
  .container-nav-alternate {
    display: none;
  }
}

.btn-nav-menu {
  position: absolute;
  z-index: 3;
  right: 0;
  left: 0;
  margin: 0 auto;
  bottom: 5px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 35px;
  background-color: transparent;
  border-width: 0 0px 0px 0px;
  border-color: #3f4144;
  border-style: solid;
  border-radius: 2px;
  transition: all 0.4s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.btn-nav-menu .icon {
  width: min(10vw, 20px);
  height: min(10vw, 20px);
  pointer-events: none;
}

.btn-nav-menu-icon-container {
  pointer-events: none;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 30px;
}

.btn-nav-menu-icon-container:hover {
  background-color: #282a2c;
}

.btn-nav-menu-icon-container:active {
  background-color: #313336;
}

.nav-link {
  opacity: 0.7;
  width: auto;
  display: flex;
  align-items: left;
  gap: 0.75rem;
  margin: 0rem 0;
  padding-bottom: 0.75rem;
  border-bottom: 1px solid #3f4144;
}

.nav-link .icon {
  width: min(10vw, 20px);
  height: min(10vw, 20px);
}

.nav-link .icon--01 {
  color: #787d81;
}

.nav-link .icon--02 {
  color: #787d81;
}

.nav-link .icon--03 {
  color: #787d81;
}

.nav-link .icon--04 {
  color: #787d81;
}

.nav-link:hover {
  opacity: 1;
}

.nav-link:hover .icon {
  transition: color 0.5s;
  transition-timing-function: cubic-bezier(0.17, 0.67, 0.63, 1);
}

.nav-link:hover .icon--01 {
  color: #fff111;
}

.nav-link:hover .icon--02 {
  color: #46edff;
}

.nav-link:hover .icon--03 {
  color: #fc3186;
}

.nav-link:hover .icon--04 {
  color: #6320ee;
}

.nav-link--active {
  opacity: 1;
}

.nav-link--active .icon--01 {
  color: #fff111;
}

.nav-link--active .icon--02 {
  color: #46edff;
}

.nav-link--active .icon--03 {
  color: #fc3186;
}

.nav-link--active .icon--04 {
  color: #6320ee;
}

.nav-link-label {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  pointer-events: none;
}

#new-user {
  padding: 8rem 0 4rem 0;
  color: #a2a7ac;
  min-height: 700px;
  width: 100%;
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #1c1d20;
}
/* 
.form {
  box-sizing: border-box;
  width: auto;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  background-color: #282a2c;
  padding: 0.75rem;
  border-radius: 2px;
  border: 1px solid #313336;
}

.form h1 {
  margin: 3rem auto;
}

.form input {
  min-width: 200px;
  color: #a2a7ac;
  border-color: #3f4144;
  background-color: #313336;
}

@media only screen and (min-width: 768px) {
  .form {
    flex-direction: row;
  }

  .form input {
    min-width: 450px;
  }

  .form .form-banner {
    max-width: 400px;
    margin-right: 0.3rem;
    width: 100%;
    height: auto;
    flex-direction: row;
  }

  .form .form-banner img {
    border-radius: 2px 0 0 2px;
    width: 100%;
    height: auto;
  }
}

@media only screen and (min-width: 320px) {
  .form input {
    min-width: 250px;
  }
}

@media only screen and (min-width: 400px) {
  .form input {
    min-width: 350px;
  }
}

@media only screen and (min-width: 576px) {
  .form input {
    min-width: 450px;
  }
} */

.form-banner {
  overflow: hidden;
  position: relative;
  width: auto;
  display: flex;
  flex-direction: column;
  margin: -0.75rem -0.75rem -0.75rem -0.75rem;
  height: auto;
}

.form-banner img {
  border-radius: 2px 2px 0 0;
  display: block;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: top;
  object-position: top;
  width: auto;
  height: 300px;
}

.form-banner-header {
  display: inline-flex;
  flex-direction: column;
  width: 100%;
  position: absolute;
  height: 100%;
  justify-content: center;
}

.form-banner-header h1 {
  color: #a2a7ac;
  display: flex;
  margin: auto;
  max-width: 200px;
}

.form-banner-header p {
  text-align: center;
  color: #ccd2d8;
  display: block;
  margin: auto;
  max-width: 300px;
}

.form-banner-header-content {
  text-align: center;
  display: inline-flex;
  flex-direction: column;
}

.form-section label {
  display: block;
  margin: 1rem 0 0.4rem 0;
}

.form-footer {
  display: flex;
  width: 100%;
}

.form-footer .btn {
  margin: 2rem 0 2rem 0;
}
/*# sourceMappingURL=main.css.map */