/* CSS reset */

/* HTML5 display-role reset for older browsers */

* {
  box-sizing: border-box;
  font-size: 62.5%;
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
}

.disabled {
  pointer-events: none;
  opacity: 0.7;
  user-select: none;
}

.hidden {
  display: none !important;
}

.hidden-field {
  display: none !important;
}

html {
  overflow-x: hidden;
  scroll-behavior: smooth;
  scroll-padding-top: 150px;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}

body {
  line-height: 1;
  font-family: "Nunito-Regular";
}

p,
a,
button,
blockquote,
input:not([type="submit"]),
select,
option,
.captcha-style,
li,
textarea {
  color: #676e79;
  font-size: 1.6rem;
}

p {
  line-height: 1.3;
}

h1,
h2,
h3,
h4,
h5 {
  line-height: 1.5;
}

strong,
span {
  font-size: inherit;
}

ol,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}

::selection {
  background-color: var(--h2-color);
  color: white;
}

.landing-img {
  img {
    max-width: 90vw;
  }
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Fonts import */
@font-face {
  font-family: "Nunito-black";
  src: url("../fonts/Nunito-Black.ttf");
}
@font-face {
  font-family: "Nunito-Bold";
  src: url("../fonts/Nunito-Bold.ttf");
}

@font-face {
  font-family: "Nunito-SemiBold";
  src: url("../fonts/Nunito-SemiBold.ttf");
}

@font-face {
  font-family: "Nunito-Regular";
  src: url("../fonts/Nunito-Regular.ttf");
}

@font-face {
  font-family: "Nunito-Light";
  src: url("../fonts/Nunito-Light.ttf");
}

/*Scroll style*/
::-webkit-scrollbar-track {
  border-radius: 10px;
  background-color: #ededed;
}

::-webkit-scrollbar {
  width: 8px;
  background-color: #f5f5f5;
}

::-webkit-scrollbar-thumb {
  border-radius: 10px;
  background-color: #ccc;
}

::-webkit-scrollbar-thumb:hover {
  border-radius: 10px;
  background-color: #c4c4c4;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* CSS Variables */
:root {
  --button-color: #cc3366;
  --h2-color: #7a185d;
  --p-color: #7a185d;
  --carousel-blue: #00537a;
  --white: #ffffff;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* CSS main styles */

/* Global css */
body {
  background-color: #f3f4f6;
  overflow-x: hidden;
}

.container {
  max-width: 104rem;
  width: 100%;
  margin: 0 auto;
}

a {
  text-decoration: none;
  color: unset;
  cursor: pointer;
}

h2 {
  color: var(--h2-color);
  font-size: 1.8rem;
  font-family: "Nunito-black";
  margin: 10px 5px 35px 5px;
  line-height: 1.1;
}

@media (max-width: 768px) {
  h2 {
    margin: 0px 5px 20px 5px;
  }
}

.button {
  font-family: "Nunito-Bold";
  font-size: 1.4rem;
  border-radius: 40px;
  border: none;
  padding: 8px 20px;
  box-shadow: 6px 4px 20px 2px rgba(122, 24, 93, 0.3),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  min-height: 38px;
  width: fit-content;
  outline: none;
  cursor: pointer;
  transition: 0.2s linear all;

  .lnc {
    font-size: 1.4rem;
  }

  gap: 0.8rem;
}

.button-small {
  font-family: "Nunito-Bold";
  font-size: 1.4rem;
  border-radius: 40px;
  border: none;
  padding: 8px 20px;
  box-shadow: 6px 4px 20px 2px rgba(122, 24, 93, 0.3),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  display: flex;
  align-items: center;
  justify-content: center;
  height: 39px;
  width: 100%;
  outline: none;
  cursor: pointer;
  transition: 0.2s linear all;

  .lnc {
    font-size: 1.4rem;
  }

  gap: 0.8rem;
}

.button-primary {
  background: var(--button-color);
  color: var(--white);
}
.button-primary:hover {
  background-color: #ed5e6a;
  color: #fff;
  transition: 0.2s linear all;
}

.button-secondary {
  background: #ededed;
  color: var(--button-color);
}
.button-secondary:hover {
  background-color: #cc3366;
  color: #fff;
  transition: 0.2s linear all;
}

.button-underlined {
  text-decoration: underline;
  font-family: "Nunito-Bold";
}
.button-underlined:hover {
  color: #7a185d;
}

.button.read {
  box-shadow: none;
  font-family: "Nunito-SemiBold";
  font-size: 14px;
  text-decoration: underline;
  text-align: left;
  background: transparent;
  text-underline-offset: 1px;
  margin: unset;
  margin-top: 10px;
  padding: 0px;
  color: #7b7b7b;
  text-transform: unset;
  padding: 5px 0px;
  min-height: unset;
}

.button.read:hover {
  color: #000;
}

.manual-buttons {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.manual-buttons .button {
  margin: 0 10px;
  box-shadow: none;
  color: #00537a;
  border: 1px soLid #00537a;
  border-radius: 10px;
  animation: 200ms all ease-in-out;
}
.manual-buttons .button:hover,
.manual-buttons .button:focus,
.manual-buttons .button:active {
  color: #fff;
  background: #00537a;
  animation: 200ms all ease-in-out;
}
.manual-buttons .button i {
  font-size: 16px;
  margin-right: 5px;
}
.manual-buttons .button a {
  display: flex;
  align-items: center;
  justify-content: center;
}

.active {
  display: flex;
}

.lnc-phone {
  font-size: 0.9rem;
}

@keyframes float {
  0% {
    transform: translatey(0px);
  }
  50% {
    transform: translatey(-20px);
  }
  100% {
    transform: translatey(0px);
  }
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Header stylings */
.header {
  min-height: 71px;
  position: fixed;
  z-index: 9998;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  transition: all 0.2s linear;
  background-color: #f3f4f6;
  top: 0;
}

@media (min-width: 992px) and (max-width: 1200px) {
  .header {
    min-height: 85px;
  }
}

.header_content {
  font-family: "Nunito-SemiBold";
  color: #363c45;
  display: flex;
  align-items: center;
  justify-content: space-between;
  /*new atribut*/
  position: relative;
}

.nav-list {
  ul {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    li {
      margin: 0 5px;

      a {
        color: #363c45;
        padding: 6px;
        border-radius: 6px;

        &:hover {
          background-color: rgba(0, 83, 122, 0.102);
        }
        &:hover .lnc-arrow-right-small {
          opacity: 1;
          transition: all 0.2s;
        }

        &.active {
          .lnc {
            padding: 0;
          }
        }
      }
    }
  }

  > ul {
    > li {
      > a {
        padding-inline: 1.2rem;
      }
    }
  }
}

.li-sign-in-btn {
  z-index: 1;
}

.hover-opacity a:hover {
  color: #363c45;
  transition: 0.2s all linear;
}

.nav-list i {
  margin-left: 4px;
}

.nav-language {
  display: flex;
  align-items: center;
  position: relative;
  z-index: 1;
}

.nav-language i {
  font-size: 24px !important;
  margin-left: 0px !important;
}

.dropdown-holder-language .dropdown-list {
  top: 24px !important;
}

.dropdown-click {
  color: #363c45;
  padding: 6px 12px;
  border-radius: 6px;

  &:hover {
    background-color: rgba(0, 83, 122, 0.102);
  }
}

.mobile-dropdown-click {
  display: flex;
  align-items: center;
  justify-content: center;
}

.mobile-dropdown-click i {
  font-size: 14px;
  margin-left: 10px;
}

.nav-arrow {
  margin-left: 5px;
}

.nav-arrow-down {
  display: inline-block;
  transform: rotate(180deg);
}

.dropdown-holder {
  position: relative;

  ul {
    display: none;
    text-align: left;
  }

  > a {
    padding-inline: 1.2rem !important;
  }

  .dropdown-list {
    flex-direction: column;
    gap: 8px;
  }

  &:has(.dropdown-list:hover) {
    .dropdown-click {
      background-color: rgba(0, 83, 122, 0.102);
    }
  }
}

.dropdown-holder-mobile {
  text-align: center;
}

.dropdown-holder-mobile:not(.dropdown-language).expanded .lnc-down:before {
  content: "\e0f3";
}

.dropdown-list {
  flex-direction: column;
  position: absolute;
  left: -30px;
  top: 15px;
  padding: 10px 30px;
  border-radius: 10px;
  gap: 8px;
}

.dropdown-list {
  li {
    font-family: "Nunito-Light";
    margin: 0 !important;
    width: 100%;

    a {
      display: flex;
      align-items: center;
      gap: 12px;
      color: #363c45;
      font-size: 16px;
      font-family: "Nunito-SemiBold";
      padding: 4px;
      border-radius: 8px;
      white-space: nowrap;

      span {
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 6px;
        width: 36px;
        height: 36px;
        flex-shrink: 0;
        aspect-ratio: 1;
        background-color: rgba(0, 83, 122, 0.2);

        .lnc {
          font-size: 16px;
          display: flex;
          color: #00537a;
          margin-left: 0;
        }
      }

      &:hover {
        background-color: rgba(0, 83, 122, 0.102);
        color: #00537a;
      }

      > .lnc {
        color: #000000;
        margin-left: auto;
        padding: 12px;
      }
    }
  }
}

/* .dropdown-list li:hover {
	color: #777;
} */

.header .dropdown-list {
  background-color: white;
  padding: 8px;
  top: 37px;
  left: 0;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.102);
}

.mobile-nav-button {
  padding: 10px 0px 15px 0px;
}

.navbar-shrink {
  min-height: 70px;
  background-color: white;
  transition: all 0.2s linear;
}

.background-for-navigation {
  background: white;
  box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.059);
}

.mobile-navigation-background {
  background-color: white;
}

.mobile-navigation-scroll {
  background-color: white;
  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.2);
}

.mobile-header {
  display: none;
  position: fixed;
  z-index: 9998;
  left: 0;
  right: 0;
  transition: all 0.2s linear;
  padding: 16px 15px;
  font-family: "Nunito-Semibold";
  top: 0;
}

.first-state-mobile-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.hamburger {
  padding: 0px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0px 1px 3px 0px #0000001a;
  aspect-ratio: 1;
  padding: 0;
  width: 4.4rem;
  height: 4.4rem;
  border-radius: 50%;
}

.hamburger--spring-r .hamburger-inner::after {
  top: -17px;
}

.hamburger-box {
  width: 22px;
  height: 22px;
}

.hamburger-inner::before {
  top: -8px;
}

.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after {
  background-color: #363c45;
}

.hamburger-inner,
.hamburger-inner::before,
.hamburger-inner::after {
  width: 22px;
  height: 1px;
}

.second-state-mobile-header {
  display: none;
  height: calc(100dvh - 74px);

  &[style^="display: block;"] {
    display: flex !important;
    flex-direction: column;
    justify-content: space-between;
  }

  &:is([style="display: block;"]) {
    .nav-list-mobile {
      overflow-y: auto;
    }
  }
}

.nav-list-mobile {
  ul {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px;

    li {
      margin: 15px 0px;
    }
  }

  .button {
    margin: 0px;
  }

  a {
    font-size: 26px;
    text-align: center;
  }
}

.mobile-header-content {
  p {
    text-align: center;
  }

  .footer-social-logo {
    display: flex;
    justify-content: center;

    .lnc-logo-footer {
      font-size: 24px;
    }
  }

  .footer-social-logo {
    i {
      color: #00537a;
      font-size: 24px !important;
    }
  }

  .copyright,
  .footer-text {
    a {
      color: #676e79;
    }
  }

  .footer-text {
    a {
      .lnc {
        display: none;
      }

      &::before {
        display: none;
      }
    }
  }

  .footer-bottom {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
  }
}

.dropdown-holder-mobile ul {
  overflow: hidden;
  display: none;
}

.dropdown-list-mobile {
  margin-top: 1rem;

  a {
    font-size: 2rem;
    display: flex;
  }

  .lnc-check {
    margin-left: 5px;
  }
}

.dropdown-holder-mobile ul li {
  margin: 15px 0px !important;
}
.dropdown-holder-mobile ul li:last-child {
  margin-bottom: 0px !important;
}

.logo a {
  display: flex;
  align-items: center;
}

.logo a img {
  max-width: 110px;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Top banner style */
.top-banner {
  background-color: #ffffff;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  color: #676e79;
  position: relative;
  display: flex;
  align-items: center;
}

.top-banner {
  margin-top: 6.81rem;
  padding-top: 10rem;
  border-radius: 24px 24px 0 0;
  border-top: 2px solid #ffffff;
  border-bottom: 2px solid #ffffff;

  .button {
    /* margin: 0px 16px 0px 0px; */

    @media (max-width: 1200px) {
      margin-top: 3.2rem;
    }
  }

  @media (max-width: 1200px) {
    padding-top: 0rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
}

.buttons-wrapper {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}

.privacy-policy-page {
  h3 {
    font-size: 1.8rem;
    margin-bottom: 1.6rem;
  }
}

.section-expert {
  .gradient {
    border-radius: 2.4rem;
  }
}

.expert-heading {
  font-size: 2.4rem;
  max-width: 47.7rem;
  text-align: center;
  font-family: "Nunito-Bold";
  margin-inline: auto;
}

.top-banner-text-content {
  margin-bottom: 116px;
  flex-basis: 100%;

  h1 {
    font-size: 3.6rem;
    font-family: "Nunito-Bold";
    margin-bottom: 30px;
    line-height: 1.3;
    color: #363c45;

    strong {
      color: #7b185d;
    }
  }

  p {
    font-family: "Nunito-Regular";
    margin-bottom: 50px;
    line-height: 1.4;
    width: 85%;
    margin-bottom: 2.2rem;
    color: #676e79;
    font-size: 16px;

    strong {
      font-size: inherit;
      color: #00537a;
      font-family: "Nunito-Bold";
    }

    span {
      font-size: inherit;
      color: #7b185d;
      font-family: "Nunito-Bold";
    }
  }
}
@media (max-width: 1200px) {
  .top-banner-text-content {
    margin-bottom: 10px;
  }
}

@media (min-width: 992px) and (max-width: 1200px) {
  .top-banner-text-content p {
    width: 65%;
  }
}
@media (max-width: 992px) {
  .top-banner-content {
    padding-bottom: 50px !important;
    /* padding-top: 20px !important; */
  }
}

.top-banner-text-content > .button {
  box-shadow: 6px 4px 20px 2px rgba(230, 53, 77, 0.2),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  position: relative;
  z-index: 10000;
}

.top-banner-content-features h2 {
  font-size: 3.4rem;
  font-family: "Nunito-black";
  margin-bottom: 30px;
}

@media (max-width: 1200px) {
  .top-banner-content-features h2 {
    font-size: 2.4rem;
  }
}

.top-banner-content-features p {
  margin-bottom: 30px;
}

.top-banner-content {
  z-index: 2;
  display: flex;
  justify-content: space-between;
}

.rocket {
  position: relative;
  z-index: 9999;
  flex-basis: 100%;
  display: flex;
  justify-content: center;
  align-items: center;

  img {
    animation: float 6s ease-in-out infinite;
    width: 100%;
    margin-top: 0;
  }

  @media (min-width: 1200px) {
    display: flex;
    left: 15rem;
    bottom: 5rem;

    img {
      width: 100%;
    }
  }

  @media (min-width: 992px) {
    display: flex;
    left: 5rem;
    bottom: 5rem;

    img {
      width: 130% !important;
    }
  }
}

.rocket-img-sm {
  display: none;
}

.rocket_features img {
  animation: float 6s ease-in-out infinite;
  width: 500px;
  margin-top: -50px;
}

.rocket_technical img {
  animation: float 6s ease-in-out infinite;
  width: 500px;
  margin-top: -50px;
}

.rocket_with-books-img {
  animation: float 6s ease-in-out infinite;
  margin: 0px 40px;
}
.rocket_with-books-img img {
  width: 200px;
}
@media (max-width: 1200px) {
  .rocket_with-books-img {
    display: flex;
    justify-content: center;
    margin: 0px 0px -85px 0px;
  }
  .rocket_with-books-img img {
    width: 150px;
  }
}

@media (max-width: 992px) {
  .rocket_with-books-img {
    margin: 0px 0px -50px 0px;
  }
}
@media (max-width: 576px) {
  .rocket_with-books-img img {
    width: 100px;
  }
}

.features {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  justify-content: center;
  max-width: 1000px;
  margin: 0 auto;
  margin-top: -120px;
}
@media (max-width: 1310px) {
  .features {
    margin-top: -50px;
  }
}

.feature {
  background: #ededed;
  box-shadow: 6px 4px 20px 2px rgba(122, 24, 93, 0.3),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  border-radius: 15px;
  padding: 15px 25px;
  color: #e6354d;
  font-family: "Nunito-SemiBold";
  cursor: pointer;
  position: relative;
  z-index: 7;
  display: flex;
  align-items: center;
  position: relative;
  top: 0px;
}

.feature::after {
  content: " \69";
  font-family: lnclines;
  font-size: 1.2rem;
  margin-left: 10px;
}

.feature:hover,
.feature:active,
.feature:focus {
  top: -1px;
  color: #cc3366;
}

.feature_cylinder {
  top: -60%;
  position: absolute;
  right: -120%;
  animation: float 8s ease-in-out infinite;
  width: 150px;
}

.feature_pyramid {
  top: -20%;
  position: absolute;
  right: -60%;
  animation: float 8s ease-in-out infinite;
  width: 150px;
}

.fatures_thorus {
  top: -20%;
  position: relative;
  right: -180%;
  animation: float 8s ease-in-out infinite;
  width: 150px;
}

.lightbox .lb-outerContainer,
.lightbox .lb-image {
  border-radius: 15px;
}

@media (min-width: 870px) {
  .features-software-container .aside {
    width: 300px;
    min-width: 300px;
  }
}

.layer {
  /*background-image: url('../images/eduis-layer.png');*/
  position: absolute;
  z-index: 3;
  bottom: -80px;
  left: 0;
  overflow: hidden;
}

.top-banner-levitating-banners {
  position: absolute;
  z-index: 6;
}

.top-banner-levitating-features {
  position: absolute;
  z-index: 6;
  right: 35%;
  top: 35%;
}

.top-banner-levitating-technical {
  position: absolute;
  z-index: 6;
  right: 35%;
  top: 45%;
}

.top-banner-levitating-banners .sphere {
  bottom: 150px;
  position: absolute;
  right: -1710px;
  animation: float 5s ease-in-out infinite;
  width: 80px;
}

.top-banner-levitating-banners .cube {
  bottom: -200px;
  position: absolute;
  left: 50px;
  animation: float 8s ease-in-out infinite;
  width: 80px;
}

.top-banner-levitating-banners .cone {
  position: absolute;
  bottom: -190px;
  left: 930px;
  animation: float 6s ease-in-out infinite;
  width: 80px;
}

.technical-features {
  margin: 0px auto 100px auto;
  position: relative;
}

.security-background {
  background-image: url("../images/security_line.png");
  background-repeat: no-repeat;
  background-position: center;
}

.integration-background {
  background-image: url("../images/eduis-integration_line.png");
  background-repeat: no-repeat;
  background-position: top;
}

.tech-background {
  background-image: url("../images/eduis-tech_line.png");
  background-repeat: no-repeat;
}

.statistics-background {
  background-image: url("../images/eduis-testimonials_line.png");
  background-repeat: no-repeat;
  background-position: center;
}

.technical-features-cards {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: center;
}

.technical-feature-card {
  background: rgb(244, 244, 244, 0.8);
  border-radius: 20px;
  height: auto;
  position: relative;
  padding: 100px 20px 30px 20px;
  margin: 80px 20px 10px 20px;
}

@media (max-width: 550px) {
  .technical-feature-card {
    margin: 80px 10px 10px 10px;
    padding-top: 60px;
  }
}

.technical-feature-card h3 {
  color: #00537a;
  font-family: "Nunito-Regular";
  text-align: center;
  font-size: 1.6rem;
  margin-top: 0px !important;
  margin-bottom: 0px;
}

.technical-feature-card p {
  color: #00537a;
  font-family: "Nunito-Light";
  text-align: center;
  font-size: 1rem;
  margin-top: 10px;
  line-height: 1.4;
}

.tech-feature-icon {
  position: absolute;
  top: -60px;
  left: 15%;
}

.tech-feature-icon img {
  max-width: 150px;
}

@media (max-width: 576px) {
  .tech-feature-icon {
    left: 25%;
  }

  .tech-feature-icon img {
    max-width: 120px;
  }
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* security */
.security {
  margin: 70px auto 100px auto;
  position: relative;
}
@media (max-width: 576px) {
  .security {
    margin-top: 30px;
  }
}

.security-card,
.partners-card {
  background: rgb(244, 244, 244, 0.8);
  border-radius: 20px;
  position: relative;
  padding: 30px 20px;
  max-width: 1000px;
  margin: 70px auto;
}

@media (min-width: 576px) and (max-width: 1100px) {
  .security-card,
  .partners-card {
    margin: 70px 50px;
  }
}

.security-card img,
.partners-card img {
  position: absolute;
  left: -30px;
  top: -50px;
  max-width: 200px;
}

.data-security {
  margin-top: 30px;
}

@media (max-width: 576px) {
  .data-security {
    margin-top: 0px;
  }
}

.security-card-content,
.partners-card-content {
  margin-left: 180px;
}

.security-card h3,
.partners-card h3 {
  color: #00537a;
  font-family: "Nunito-Regular";
  text-align: left;
  font-size: 1.6rem;
  margin-bottom: 20px;
}

.security-card ul li,
.security-card p,
.partners-card ul li,
.partners-card p {
  color: #00537a;
  font-family: "Nunito-Regular";
  text-align: left;
  font-size: 1.6rem;
  margin-top: 10px;
  line-height: 1.4;
}

.security-card ul li,
.partners-card ul li {
  list-style-type: disc;
  margin-left: 30px;
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Part with video content */
.video {
  position: relative;
  margin: 20px 0px 60px 0px;
}

@media (max-width: 998px) {
  .video {
    margin-bottom: 50px;
  }
}
@media (max-width: 576px) {
  .video-testimonials {
    margin-top: 70px;
  }
}

.video-content {
  text-align: center;
}

.video-placeholder {
  position: relative;
  margin: 0px auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

.video-placeholder iframe {
  width: 800px;
  height: 450px;
  box-shadow: 0px 37px 28px -23px rgb(204 51 102 / 35%);
  border-radius: 20px;
  margin-bottom: 20px;
}

@media (max-width: 860px) {
  .video-placeholder iframe {
    max-width: 560px;
    max-height: 315px;
  }
}

.video-placeholder-image {
  width: 100%;
  cursor: pointer;
  box-shadow: 0px 37px 28px -23px rgba(204, 51, 102, 0.35);
  border-radius: 20px;
  margin-bottom: 20px;
}

/* ---------------------------------------------------- VIDEO ------------------------------------------------------------ */

.modal {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  display: none;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  background-color: rgba(0, 0, 0, 0.7);

  .contact-form-wrapper {
    max-height: calc(100vh - 3rem);
    overflow-y: auto;
    margin-top: 2rem;
  }
}
.modal .modal {
  z-index: 9999;
}
.modal video {
  max-width: 90%;
  max-height: 90%;
  border-radius: 10px;
}
.modal .modal-close {
  cursor: pointer;
  font-size: 2rem;
  color: white;
}
.modal .modal-close:hover {
  transition: all 0.1s linear;
}
.modal .modal-close:hover .lnc {
  transform: rotate(90deg);
  transition: all 0.1s linear;
  display: block;
}
.modal .modal-close .lnc {
  padding: 8px;
}
.modal div.modal-close.close {
  position: absolute;
  right: 20px;
  top: 15px;
}
.modal-content {
  background-color: white;
  width: 100%;
  max-height: 100%;
  z-index: 9999;
  box-shadow: 0 0px 38px rgba(35, 35, 35, 0.4);
  margin: 15px;
  overflow: hidden;
}
.modal-content-header,
.modal-content-body,
.modal-content-footer {
  padding: 10px;
}
.modal-content-body,
.modal-content-footer {
  background-color: white;
}
.modal-content-header {
  display: flex;
  align-items: center;
  background: linear-gradient(to right, #0c7c8a, #084d55);
  color: white;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 2;
  min-height: 38px;
}
.modal-content-header .modal-title .lnc {
  font-size: 0.8rem;
}
.modal-content-body {
  min-height: 100px;
  max-height: calc(100vh - 90px);
  overflow: hidden auto;
}
.modal-content-body.modal-no-footer {
  max-height: calc(100vh - 39px);
}
.modal-content-body.modal-height-sm {
  min-height: 230px;
}
.modal-content-footer {
  border-top: 1px solid #e1f0f0;
  display: flex;
  justify-content: flex-end;
  position: -webkit-sticky;
  position: sticky;
  bottom: 0;
  z-index: 1;
}
.modal-content-footer.modal-footer-split {
  justify-content: space-between;
}
.modal-content-footer .modal-footer-left,
.modal-content-footer .modal-footer-right {
  display: flex;
}
.modal-content-footer .modal-footer-left .checkswitch {
  margin-bottom: 0;
}
.modal .modal-body-split {
  display: flex;
}
.modal .modal-body-split .payment-input {
  flex-basis: 40%;
}
.modal .modal-body-split .payment-options {
  flex-basis: 60%;
}
.modal [class="modal-content"] .modal-content-footer:not(.modal-footer-split),
.modal .modal-xs .modal-content-footer:not(.modal-footer-split),
.modal .modal-sm .modal-content-footer:not(.modal-footer-split),
.modal .modal-pay .modal-content-footer:not(.modal-footer-split) {
  display: flex;
  justify-content: center;
  width: 100%;
  padding: 0;
}
.modal
  [class="modal-content"]
  .modal-content-footer:not(.modal-footer-split)
  > form,
.modal .modal-xs .modal-content-footer:not(.modal-footer-split) > form,
.modal .modal-sm .modal-content-footer:not(.modal-footer-split) > form,
.modal .modal-pay .modal-content-footer:not(.modal-footer-split) > form {
  display: flex;
  justify-content: center;
  width: 100%;
}
.modal
  [class="modal-content"]
  .modal-content-footer:not(.modal-footer-split)
  .btn,
.modal .modal-xs .modal-content-footer:not(.modal-footer-split) .btn,
.modal .modal-sm .modal-content-footer:not(.modal-footer-split) .btn,
.modal .modal-pay .modal-content-footer:not(.modal-footer-split) .btn {
  flex-basis: 50%;
  margin-right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px 5px !important;
}
.modal
  [class="modal-content"]
  .modal-content-footer:not(.modal-footer-split)
  .lnc,
.modal .modal-xs .modal-content-footer:not(.modal-footer-split) .lnc,
.modal .modal-sm .modal-content-footer:not(.modal-footer-split) .lnc,
.modal .modal-pay .modal-content-footer:not(.modal-footer-split) .lnc {
  font-size: 0.9em;
}
.modal
  [class="modal-content"]
  .modal-content-footer:not(.modal-footer-split)
  .lnc-x,
.modal .modal-xs .modal-content-footer:not(.modal-footer-split) .lnc-x,
.modal .modal-sm .modal-content-footer:not(.modal-footer-split) .lnc-x,
.modal .modal-pay .modal-content-footer:not(.modal-footer-split) .lnc-x {
  font-size: 0.8em;
}
.modal .modal-xs {
  max-width: 240px;
}
.modal .modal-sm {
  max-width: 400px;
}
.modal .modal-pay {
  max-width: 850px;
}
.modal .modal-l {
  max-width: 1200px;
}
.modal .modal-xl {
  max-width: 1920px;
}

.show {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
}

/* ----------------------------------------------------------------------------------------------------------------------- */

.play_video_button {
  position: absolute;
  cursor: pointer;
  border-radius: 100%;
  filter: drop-shadow(0px 0px 43px black);
  animation: pulse-white 1.5s infinite;
}

.video_animate {
  --animate-duration: 0.2s;
}

@keyframes pulse-white {
  0% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.7);
  }
  70% {
    transform: scale(1);
    box-shadow: 0 0 0 20px rgba(255, 255, 255, 0);
  }
  100% {
    transform: scale(0.95);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0);
  }
}

.video-content p {
  color: var(--p-color);
  font-size: 1.1rem;
  line-height: 1.4;
  font-family: "Nunito-Regular";
  max-width: 800px;
  text-align: left;
  margin: 0 auto;
}

.users_content-img {
  display: block;
  height: 260px;
}

.owl-item .item {
  max-width: 320px;
  position: relative;
  min-width: calc(100% - 30px);
}
.owl-item img {
  width: unset !important;

  @media (max-width: 991px) {
    width: 100% !important;
  }
}

.owl-stage-outer {
  padding: 0px 0px 50px 0px;
}

.image-div-1,
.image-div-2,
.image-div-5 {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: baseline;
}

.carousel-arrow {
  width: 40px;
  cursor: pointer;
}

.image_1 {
  position: relative;
  bottom: -17px;
}

.image_2 {
  position: relative;
  top: -100px;
  left: 40%;
}

.item_3 h4,
.item_4 h4 {
  position: relative;
  bottom: 10%;
}

.image_3 {
  position: relative;
  top: -60px;
  left: 40%;
}

.image_4,
.image_6,
.image_7 {
  position: relative;
  top: -60px;
  left: 40%;
}

.image_5 {
  position: relative;
  top: -70px;
  left: 50%;
}

.third-arrow {
  position: relative;
  left: 175px;
}

.carousel-card-image {
  max-width: 90px;
  text-align: center;
  margin: 0 auto;
}

.carousel-card-image img {
  width: 100%;
  display: block;
  position: unset !important;
  bottom: 0px;
}

.carousel-card-title a h4::after,
.card h4::after {
  content: " \69";
  font-family: lnclines;
  font-size: 1rem;
  margin-left: 5px;
}
@media (max-width: 576px) {
  .carousel-card-title a h4::after,
  .card h4::after {
    font-size: 14px;
  }
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Call to action */
.call-to-action {
  margin: 200px auto 300px;
  position: relative;
  display: none;
}

.call-to-action h4 {
  font-family: "Nunito-Regular";
  font-size: 1.5rem;
  color: #00537a;
  text-align: center;
}

.call-to-action button {
  background: #e6354d;
  box-shadow: 6px 4px 20px 2px rgba(230, 53, 77, 0.3),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  border-radius: 30px;
  color: white !important;
  text-transform: uppercase;
  font-family: "Nunito-SemiBold" !important;
  padding: 15px 25px;
  outline: none;
  border: none;
  cursor: pointer;
  margin: 100px auto;
  text-align: center;
  display: flex;
  z-index: 2;
  position: relative;
}

.call-to-action img {
  position: absolute;
  top: 50%;
  right: 30%;
  z-index: 1;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* About us */
.about {
  margin: 0px auto;
  position: relative;
}

.about .bulletin-list {
  margin-left: 10px;
  color: #00537a;
}

.about_text a {
  text-decoration: underline;
}

@media (min-width: 768px) {
  .about-partner {
    margin-top: -100px;
  }
}

.about_text h4 {
  font-family: "Nunito-SemiBold";
  font-size: 1.5rem;
  color: #00537a;
  margin-bottom: 10px;
}

.about_text p {
  color: #00537a;
  font-family: "Nunito-Regular";
  font-size: 1.1rem;
  line-height: 1.4;
  margin-bottom: 20px;
}

.about-statistics {
  position: relative;
  width: 100%;
  min-height: 700px;
  margin: 50px auto;
}

.about-stat {
  position: absolute;
  max-width: 240px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.about-stat img {
  width: 100%;
  max-width: 150px;
}

.about-stat p {
  font-family: "Nunito-black";
  font-style: 1.5rem;
  color: #00537a;
  line-height: 1.4;
}

.availability {
  right: 10%;
  top: 40%;
}

.generation {
  top: 0;
  left: 40%;
  max-width: 120px;
}

.years {
  top: 40%;
  left: 10%;
}

@media (max-width: 768px) {
  .years,
  .availability {
    top: 35%;
  }
}

.end-user {
  bottom: 20%;
  left: 40%;
}

.lanaco-offices {
  margin: 50px auto 100px auto;
  position: relative;
  padding: 10px;
}

.offices-title {
  font-family: "Nunito-black";
  font-size: 1.5rem;
  color: #00537a;
  text-align: center;
}

.office-image {
  text-align: center;
  margin: 20px auto;
}

.location-info {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
}

.location .continent {
  color: #e6354d;
  text-transform: uppercase;
  font-size: 1.1rem;
  font-family: "Nunito-SemiBold";
  line-height: 1.4;
}

.location .country {
  color: #00537a;
  font-size: 1.1rem;
  font-family: "Nunito-SemiBold";
  line-height: 1.4;
}

.location .city {
  color: #00537a;
  font-size: 1.1rem;
  font-family: "Nunito-Regular";
  line-height: 1.4;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Accordion */
.accordion {
  margin: -30px auto 90px auto;
  position: relative;
}

@media (max-width: 1200px) {
  .accordion {
    margin-top: 00px;
  }
}
@media (max-width: 460px) {
  .accordion {
    margin-top: 70px;
  }
}

.details-accordion {
  background: #f4f4f4;
  border-radius: 20px;
  padding: 20px 30px;
  margin: 20px auto;
}

.details-title {
  color: #00537a;
  font-size: 1.5rem;
  font-family: "Nunito-SemiBold";
  line-height: 1.4;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}

.details-content {
  color: #00537a;
  font-size: 1.1rem;
  font-family: "Nunito-Regular";
  line-height: 1.4;
  margin-top: 30px;
  display: none;
}

.details-content a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.details-content a:hover {
  color: #831b5e;
}

.minus-icon {
  display: none;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* EduIS users section styles*/
.eduis_users {
  position: relative;
}

.decorative_line {
  max-height: 420px;
}
@media (min-width: 1200px) {
  .decorative_line {
    width: 100%;
  }
}

.users_content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

@media (max-width: 1400px) {
  .users_content {
    padding-bottom: 150px;
  }
}

.users_content p {
  color: var(--carousel-blue);
  font-family: "Nunito-Bold";
  font-size: 1.4rem;
  margin-top: 40px;
  text-align: center;
}
.users_content h2 {
  margin: 70px 0px 20px 0px;
  text-align: center;
}

.users_content p {
  font-size: 1.2rem;
}

.users_doodle_1 {
  position: absolute;
  top: 400px;
  right: 420px;
  animation: float 7s ease-in-out infinite;
  z-index: 3;
}

.users_doodle_2 {
  position: absolute;
  bottom: 150px;
  left: 420px;
  animation: float 6s ease-in-out infinite;
  z-index: 3;
}

@media (max-width: 1400px) {
  .users_doodle_1,
  .users_doodle_2 {
    display: none;
  }
}

.users_cube {
  position: absolute;
  top: 0%;
  left: 60%;
  animation: float 4s ease-in-out infinite;
  z-index: 3;
}

.users_white_cone {
  position: absolute;
  top: 45%;
  left: 250px;
  animation: float 5s ease-in-out infinite;
  z-index: 3;
}

.users_purple_cone {
  position: absolute;
  bottom: 100px;
  right: 250px;
  animation: float 3s ease-in-out infinite;
  z-index: 3;
}

.top-banner-privacy {
  height: 60vh;
}

.top-banner-privacy h2 {
  text-align: center;
}

.security-card-privacy h3 {
  padding-left: 0px;
  margin-top: 50px;
}

.security-card-privacy p {
  padding-left: 0px;
}

strong {
  font-family: "Nunito-Bold";
  font-size: inherit;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* EduIS technical */

.eduis_technical {
  text-align: center;
  margin: 100px auto;
}
@media (min-width: 576px) and(max-width: 768px) {
  .eduis_technical {
    margin-top: 140px;
  }
}

.eduis_technical .technical-features-cards {
  justify-content: center;
  max-width: 1200px;
  margin: 0px auto 20px;
  padding: 10px 20px;
}

.eduis_technical .technical-features-cards .technical-feature-card {
  padding: 0px 10px;
  margin: 10px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.eduis_technical .technical-features-cards .technical-feature-card h3 {
  font-size: 1.2rem;
  text-align: left;
}

.eduis_technical
  .technical-features-cards
  .technical-feature-card
  .tech-feature-icon {
  position: relative;
  top: 5px;
  left: unset;
  margin-right: 15px;
  margin: 0 auto;
}

.eduis_technical
  .technical-features-cards
  .technical-feature-card
  .tech-feature-icon
  img {
  max-width: 100px;
}

.technical-card-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 0 auto;
  flex-wrap: wrap;
  margin-bottom: 50px;
  max-width: 1200px;
  margin-top: 30px;
}
@media (min-width: 992px) {
  .technical-card-wrapper {
    gap: 30px;
    width: 80%;
    margin-top: 0px;
  }
}

.eduis_technical-card {
  background: #fff;
  box-shadow: 0px 37px 28px -23px rgba(122, 24, 93, 0.35);
  border-radius: 20px;
  height: auto;
  position: relative;
  padding: 20px 40px;
  color: #cc3366;
  font-size: 1.25rem;
  font-family: "Nunito-Semibold";
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 992px) {
  .eduis_technical-card {
    padding: 15px 30px;
    box-shadow: 0px 37px 28px -21px rgba(122, 24, 93, 0.35);
  }
}

@media (max-width: 576px) {
  .eduis_technical-card {
    max-width: 300px;
  }
}

.eduis_technical-card i {
  font-size: 18px;
  margin-left: 10px;
}

.eduis_technical-card span {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* EduIS integrations */

.eduis_integration {
  margin-top: 70px;
  text-align: center;
}

.integration-top-visual {
  position: relative;
}
.integration-top-visual h2 {
  margin-top: -50px;
}

@media (max-width: 1200px) {
  .integration-top-objects {
    transform: scale(0.8);
    margin-top: -230px;
  }
}

@media (max-width: 768px) {
  .integration-top-objects {
    margin-top: -150px;
  }
}
@media (max-width: 576px) {
  .integration-top-objects {
    margin-top: -50px;
  }
}

.integration-bottom-visual {
  position: relative;
  z-index: 10;
  padding: 10px;
}
.integration-bottom-visual .paragraph-lms {
  margin: 35px 0px;
}
.integration-bottom-visual h2 {
  margin-bottom: 0px;
}

.integ {
  position: absolute;
}

.integ-1 {
  bottom: -40%;
  right: 10%;
  animation: float 3s ease-in-out infinite;
  z-index: 3;
  display: none;
}

.integ-2 {
  top: 0;
  left: 15%;
  animation: float 4s ease-in-out infinite;
}

.integ-3 {
  top: -10%;
  right: 20%;
  animation: float 5s ease-in-out infinite;
}

.integ-4 {
  top: 60%;
  right: 20%;
  animation: float 7s ease-in-out infinite;
}

.integ-5 {
  bottom: 10%;
  left: 30%;
  animation: float 7s ease-in-out infinite;
}

.rainbow-stripes {
  width: 100%;
}

.cloud {
  position: absolute;
  top: 0;
  left: 40%;
  transform: translate(-60%);
  animation: float 4s linear infinite;
  max-width: 300px;
}

.integration-cone {
  position: absolute;
  top: 0;
  left: 35%;
  animation: float 4s linear infinite;
  transform: rotate(-40deg);
}

.integration-sphere {
  position: absolute;
  top: -130px;
  left: 45%;
  animation: float 4s linear infinite;
  width: 80px;
}

.integration-cylinder {
  position: absolute;
  top: 0;
  right: 35%;
  width: 80px;
  animation: float 4s linear infinite;
  transform: rotate(40deg);
}

.integration-elements {
  position: absolute;
  top: 0;
  right: 35%;
  width: 80px;
  animation: float 4s linear infinite;
  transform: rotate(40deg);
}

.paragraph {
  color: var(--carousel-blue);
  font-size: 1.25rem;
  line-height: 1.2;
  font-family: "Nunito-SemiBold";
  padding: 0px 5px;
}

.paragraph-lms span {
  font-family: "Nunito-Black";
}

.girl_with_laptop {
  position: relative;
  z-index: 2;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Mobile app section */

.mobile-app {
  background: url("../images/eduis-pattern.png"),
    linear-gradient(160deg, #7a185d 30%, #00537a 100%);
  background-size: cover;
  background-position: center;
  color: white;
  padding: 160px 0;
  margin-top: -50px;
  position: relative;
  z-index: 2;
}

@media (max-width: 1200px) {
  .mobile-app {
    padding: 100px 0px;
  }
}
@media (max-width: 576px) {
  .mobile-app {
    padding: 60px 0px;
    margin-top: 0px;
  }
}

.mobile-bottom-image,
.users-bottom-image {
  width: 100%;
  height: auto;
  position: absolute;
  bottom: -5px;
  z-index: 1;
}

.mobile-top-image,
.users-top-image {
  width: 100%;
  height: auto;
  position: absolute;
  top: -5px;
  z-index: 1;
}

.mobile-top-image,
.user-top-image {
  top: -5px;
}

.mobile-bottom-image img,
.user-bottom-image img {
  width: 100%;
}

.mobile-app-content div > h2 {
  color: white;
  text-align: right;
}

.mobile-app-content div > p {
  color: white;
  font-size: 1.1rem;
  font-family: "Nunito-Light";
  line-height: 1.4;
  text-align: right;
}

.mobile_text {
  margin-left: 40px;
  position: relative;
}

@media (max-width: 992px) {
  .mobile_text {
    margin-left: 0px;
  }
}

.mobile_holder {
  background: url("../images/eduis-mobile-mockup.png");
  height: 512px;
  width: 262px;
  min-width: 262px;
  margin-top: 50px;
  position: relative;
}

@media (max-width: 1200px) {
  .mobile_holder {
    background: url("../images/eduis-mobile-mockup-sm.png");
    height: 256px;
    width: 131px;
    min-width: 131px;
    margin-top: 20px;
  }
}

.mobile_element {
  position: absolute;
}

.mobile-app-content {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 960px;
  padding: 20px;
}

.buttons_container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 20px;
}

.store_button {
  cursor: pointer;
  margin: 5px;
}

.store_button a {
  display: block;
}

.mobile_cloud {
  left: -80%;
  top: 0px;
}

.mobile_cloud_two {
  top: 60%;
  right: -60%;
  width: 70px;
  animation: float 4s linear infinite;
}

.mobile_doodle {
  top: -20%;
  z-index: 3;
}

.mobile_toggle {
  top: 30%;
  animation: float 7s ease-in-out infinite;
}

.mobile_bell {
  left: -35%;
  top: 50%;
  width: 70px;
}

.mobile_spiral {
  top: 20%;
  left: -100%;
  width: 150px;
  animation: float 5s ease-in-out infinite;
}

.mobile_spirals {
  top: 90%;
  z-index: 10;
  animation: float 4s ease-in-out infinite;
  display: none;
}

.mobile_cube {
  top: -140%;
  left: 50%;
  z-index: 3;
}

.mobile_cylinder {
  top: 140%;
  left: 80%;
  width: 50px;
  display: none;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
/* Education must go on */

.education-must-go-on {
  background-image: url("../images/eduis-decorative_line.png");
  padding: 50px 0;
  background-size: cover;
  background-position: center center;
  position: relative;
}

@media (max-width: 768px) {
  .education-must-go-on {
    margin-bottom: 0px;
    padding-bottom: 20px !important;
  }
}
@media (min-width: 1200px) {
  .education-must-go-on {
    padding: 70px 0;
  }
}

.education-must-content {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0px 20px;
}

.education-must-visual {
  animation: float 5s ease-in-out infinite;
}

@media (max-width: 1400px) {
  .education-must-visual img {
    height: 150px;
    margin-top: 0px;
  }
}

@media (max-width: 768px) {
  .education-must-visual img {
    height: 130px;
    margin-top: 0px;
    position: relative;
    right: -100px;
  }
}

.education-text-part p {
  font-size: 1.1rem;
  color: var(--p-color);
  font-family: "Nunito-Regular";
  margin-bottom: 50px;
  line-height: 1.4;
}

.education-must-cube {
  position: absolute;
  top: -50px;
  max-width: 60px;
  animation: float 3s linear infinite;
  z-index: 10;
}

.education-must-cone {
  position: absolute;
  bottom: -20px;
  right: 200px;
  max-width: 60px;
  animation: float 6s linear infinite;
  display: none;
}

@media (max-width: 768px) {
  .education-must-cone {
    display: none;
  }
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Contact bubble */

.contact-bubble-wrapper {
  background: #00537a;
  max-width: 650px;
  padding: 40px 25px;
  border-radius: 20px;
  box-shadow: 0px 37px 28px -23px rgba(204, 51, 102, 0.35);
  margin: 50px auto;
  position: relative;
  display: block;
}

@media (max-width: 768px) {
  .contact-bubble-wrapper {
    max-width: 550px;
    padding-bottom: 20px;
  }
}

@media (max-width: 576px) {
  .contact-bubble-wrapper {
    margin: 70px 40px;
  }
}

.contact-bubble {
  display: flex;
  align-items: flex-end;
}

@media (max-width: 576px) {
  .contact-bubble {
    flex-direction: column;
  }
}

.contact-bubble h3 {
  color: var(--white);
  font-size: 1.5rem;
  font-family: "Nunito-SemiBold";
  margin-bottom: 10px;
}

.contact-bubble p {
  font-family: "Nunito-Light";
  font-size: 1.1rem;
  line-height: 1.4;
  color: var(--white);
}

.contact-bubble-arrow {
  display: flex;
  justify-content: flex-end;
  margin-left: 10px;
}

.contact-bubble-arrow i {
  display: inline-block !important;
  visibility: unset !important;
  color: #fff;
  opacity: 1 !important;
  font-size: 30px;
}

.chat-bubbles-img {
  position: absolute;
  z-index: 2;
  top: -70px;
  right: 40px;
}

.chat-bubbles-img img {
  max-width: 130px;
}

.testimonial-contact-wrapper {
  margin-top: -150px;
}

@media (max-width: 768px) {
  .testimonial-contact-wrapper {
    margin-top: -200px;
  }
}

/* --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Featuers and functionalities content style*/
.features-container {
  margin-top: 80px;
  margin-bottom: 70px;
}

.features-content {
  display: flex;
  position: relative;
}

.features-description {
  font-family: "Nunito-SemiBold";
  color: #7a2169;
  margin-bottom: 20px;
  line-height: 1.4;
}

.aside {
  border-right: 1px solid #ff6699;
  padding-right: 10px;
  margin-right: 20px;
}

.aside-padding {
  padding-top: 80px;
}

@media (max-width: 768px) {
  .aside-padding {
    padding: 50px 0px 0px 0px;
  }
}

.aside h4 {
  font-size: 1.9rem;
  color: #00537a;
  font-family: "Nunito-black";
  overflow: hidden;
  -webkit-line-clamp: 2;
  text-overflow: ellipsis;
  line-height: 1.25;
}

.aside p {
  font-size: 1.1rem;
  color: #7a185d;
  font-family: "Nunito-Light";
  line-height: 1.4;
  margin: 15px auto 25px;
}

.main-features-padding {
  padding-top: 80px;
}

.aside-button {
  display: none !important;
}

.aside-button {
  background: #e6354d;
  box-shadow: 6px 4px 20px 2px rgba(230, 53, 77, 0.3),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  border-radius: 30px;
  color: white !important;
  text-transform: uppercase;
  font-family: "Nunito-SemiBold" !important;
  padding: 10px 20px;
  outline: none;
  border: none;
  cursor: pointer;
}

.features-placeholder {
  height: 324px;
  margin-bottom: 20px;
  /* background: #FFFFFF;
	box-shadow: 6px 4px 20px 2px rgba(255, 102, 153, 0.2), inset 2px -3px 6px rgba(0, 0, 0, 0.25), inset -6px 4px 4px rgba(255, 255, 255, 0.25);
	border-radius: 20px;
	width: 641px; */
}

.features-placeholder .features-placeholder-image img {
  display: none;
}

.features-placeholder .features-placeholder-image:first-child img {
  height: 100%;
  box-shadow: 6px 4px 20px 2px rgba(255, 102, 153, 0.2),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  border-radius: 10px;
  transition: all 0.1s linear;
  display: block;
}

.features-placeholder img:hover {
  transform: scale(1.01);
  border-radius: 0;
  transition: all 0.1s linear;
  cursor: pointer;
  z-index: 9999;
  border-radius: 10px;
}

.features-list {
  font-size: 1.1rem;
  color: black;
  font-family: "Nunito-Light";
  margin: 15px auto;
  line-height: 1.4;
}

li.features-list {
  margin-top: 0px;
}
p.features-list {
  margin-bottom: 0px;
}

.feature-bold {
  font-family: "Nunito-SemiBold";
  text-transform: uppercase;
}

.fetures-technical-img {
  animation: float 4s linear infinite;
  margin-left: 30px;
}
.fetures-technical-img img {
  width: 220px;
}
@media (max-width: 1310px) {
  .fetures-technical-img img {
    width: 180px;
  }
}
@media (max-width: 1200px) {
  .fetures-technical-img {
    display: flex;
    justify-content: center;
  }
  .fetures-technical-img img {
    width: 150px;
    margin-bottom: -50px;
  }
}

@media (max-width: 768px) {
  .fetures-technical-img img {
    width: 120px;
    margin-bottom: -50px;
  }
}

.software-features-img {
  animation: float 4s linear infinite;
  margin-left: 30px;
  margin-top: -50px;
}
.software-features-img img {
  width: 350px;
}
@media (max-width: 1200px) {
  .software-features-img {
    display: flex;
    justify-content: center;
    margin-top: -20px;
    margin-bottom: -50px;
  }
  .software-features-img img {
    width: 300px;
  }
}

@media (max-width: 992px) {
  .software-features-img {
    margin-bottom: 0px;
  }
}

@media (max-width: 768px) {
  .software-features-img img {
    width: 250px;
  }
}

@media (max-width: 576px) {
  .software-features-img img {
    width: 200px;
  }
}

.security_img {
  animation: float 4s linear infinite;
  margin-left: 30px;
}
.security_img img {
  width: 250px;
}

@media (max-width: 1200px) {
  .security_img {
    display: flex;
    justify-content: center;
    margin-top: -20px;
    margin-bottom: -50px;
  }
  .security_img img {
    width: 200px;
  }
}

@media (max-width: 768px) {
  .security_img img {
    width: 150px;
  }
}

.faq-img {
  animation: float 4s linear infinite;
  margin-left: 30px;
  margin-top: -50px;
}
.faq-img img {
  width: 350px;
}
@media (max-width: 1200px) {
  .faq-img {
    display: flex;
    justify-content: center;
    margin-top: -20px;
    margin-bottom: -100px;
  }
  .faq-img img {
    width: 300px;
  }
}
@media (max-width: 768px) {
  .faq-img img {
    width: 250px;
  }
}

.eduis_for-cloud {
  transform: scaleX(-1);
  animation: float 4s linear infinite;
  margin-left: 30px;
}
.eduis_for-cloud img {
  max-width: 400px;
}

@media (max-width: 1200px) {
  .eduis_for-cloud {
    margin: 0 auto;
  }
  .eduis_for-cloud img {
    max-width: 280px;
    margin-bottom: 20px;
  }
}

@media (max-width: 768px) {
  .eduis_for-cloud img {
    max-width: 200px;
  }
}

.eduis-for-visual {
  display: flex;
  align-items: center;
  gap: 20px;
  width: 320px;
}

.edu_for-img-container {
  min-height: 70px;
}

.students-container {
  max-width: 50%;
}

.students-img {
  width: 80px;
}

.students-img img {
  width: 100%;
}

.school-admin-img {
  width: 80px;
}

.teachers-img {
  width: 80px;
}

.teachers-img img {
  width: 100%;
}

.parents-img {
  width: 80px;
}

.parents-img img {
  width: 100%;
}

.school-admin-img img {
  width: 100%;
}

.expert-container {
  max-width: 70%;
}

.expert-img {
  width: 80px;
}

.expert-img img {
  width: 100%;
}

.eduis-for-visual p {
  font-family: "Nunito-black";
  font-size: 1.8rem;
  color: #7a185d;
}

.edu_for-img img {
  width: 70px;
}
.edu_for-img-lg img {
  width: 100px;
}

.eduis-for-img .image_1 {
  bottom: unset;
  position: unset !important;
}

/* -------------------------------------------------------- */
/* Objects */
.object {
  position: absolute;
}

.object-1 {
  top: 15%;
  right: -10%;
  animation: float 5s ease-in-out infinite;
  height: 65px;
}

.object-2 {
  top: 80%;
  width: 70px;
  animation: float 7s ease-in-out infinite;
}

.object-3 {
  left: -14%;
  bottom: 0;
  animation: float 3s linear infinite;
}

.object-4 {
  right: -10%;
  top: 15%;
  animation: float 3s ease-in-out infinite;
}

.object-5 {
  top: 10%;
  left: 50%;
  animation: float 3s linear infinite;
}

.object-6 {
  top: 10%;
  left: 50%;
  animation: float 3s linear infinite;
}

.object-7 {
  top: 30%;
  right: -10%;
  animation: float 5s ease-in-out infinite;
}

.object-8 {
  bottom: 10%;
  animation: float 3s linear infinite;
  height: 70px;
}

.object-9 {
  bottom: 10%;
  animation: float 5s ease-in-out infinite;
}

.object-10 {
  top: 20%;
  right: -20%;
  animation: float 5s ease-in-out infinite;
}

.object-11 {
  bottom: 10%;
  left: -10%;
  animation: float 5s linear infinite;
}

.object-12 {
  bottom: -10%;
  right: 30%;
  animation: float 3s linear infinite;
}

.object-13 {
  top: 30%;
  right: -10%;
  animation: float 5s linear infinite;
  height: 60px;
}

.object-14 {
  bottom: -10%;
  right: -20%;
  animation: float 3s linear infinite;
}

.object-15 {
  top: 5%;
  left: 15%;
  animation: float 7s ease-in-out infinite;
}

.object-16 {
  top: -10%;
  right: 0%;
  animation: float 3s linear infinite;
  height: 70px;
}

.object-17 {
  bottom: 10%;
  right: 25%;
  animation: float 5s linear infinite;
}

.object-18 {
  top: -5%;
  right: 5%;
  animation: float 5s ease-in-out infinite;
  height: 50px;
}

.object-19 {
  top: 30%;
  right: 5%;
  animation: float 3s linear infinite;
}

.object-20 {
  bottom: 0%;
  left: 0%;
  animation: float 7s ease-in-out infinite;
}

.object-21 {
  bottom: 15%;
  right: 20%;
  animation: float 5s ease-in-out infinite;
}

.object-22 {
  bottom: 5%;
  left: 10%;
  animation: float 3s linear infinite;
  height: 65px;
}

.object-23 {
  bottom: 35%;
  right: -20%;
  animation: float 7s ease-in-out infinite;
}

.object-24 {
  bottom: 15%;
  right: -10%;
  animation: float 3s linear infinite;
}

.object-25 {
  bottom: 45%;
  left: -10%;
  animation: float 5s ease-in-out infinite;
}

.object-26 {
  top: 20%;
  right: 5%;
  animation: float 3s linear infinite;
  height: 75px;
}

.object-27 {
  top: 60%;
  left: 5%;
  animation: float 7s ease-in-out infinite;
}

.object-28 {
  bottom: 5%;
  left: 55%;
  animation: float 3s linear infinite;
}

.object-29 {
  top: 0%;
  right: 10%;
  animation: float 5s ease-in-out infinite;
}

.object-30 {
  bottom: 5%;
  left: 10%;
  animation: float 3s linear infinite;
}

.object-31 {
  top: -10%;
  left: -15%;
  animation: float 5s ease-in-out infinite;
}

.object-32 {
  top: -20%;
  right: 15%;
  animation: float 3s linear infinite;
}

.object-33 {
  bottom: -31%;
  left: 5%;
  animation: float 5s ease-in-out infinite;
}

.object-34 {
  bottom: -25%;
  right: -5%;
  animation: float 5s ease-out infinite;
}

.object-35 {
  top: -15%;
  left: 10%;
  animation: float 3s linear infinite;
}

.object-36 {
  top: 70%;
  left: -10%;
  animation: float 5s ease-out infinite;
  display: none;
}

.object-37 {
  bottom: 0%;
  right: -15%;
  animation: float 7s ease-out infinite;
}

.object-38 {
  bottom: 50%;
  left: -8%;
  animation: float 5s ease-out infinite;
}

.object-39 {
  top: 0%;
  right: -5%;
  animation: float 5s linear infinite;
}

.object-40 {
  bottom: 50%;
  left: -15%;
  animation: float 5s linear infinite;
}

.object-41 {
  bottom: -10%;
  left: 0%;
  animation: float 5s ease-out infinite;
}
@media (max-width: 768px) {
  .object-41 {
    display: none;
  }
}

.object-42 {
  bottom: 0%;
  right: 10%;
  animation: float 3s ease-out infinite;
}

.object-43 {
  top: -50%;
  left: -10%;
  animation: float 7s linear infinite;
}

.object-44 {
  bottom: -30%;
  left: 5%;
  animation: float 3s ease-out infinite;
}

.object-45 {
  top: 20%;
  right: 10%;
  animation: float 5s ease-out infinite;
}

.object-46 {
  bottom: -60%;
  right: -20%;
  animation: float 7s linear infinite;
}
/* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
/* Footer */

.footer {
  min-height: 280px;
  width: 100%;
  padding: 0px 0px 10px;
  position: relative;

  .lnc {
    color: #00537a;
    font-size: 2.4rem !important;
  }

  .footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;

    @media (max-width: 991px) {
      flex-direction: column;
      align-items: flex-start;
      padding-left: 1.5rem;
      padding-right: 1.5rem;
      gap: 2.8rem;
    }
  }

  a {
    color: #676e79;
    font-size: 1.4rem;
  }
}
@media (max-width: 991px) {
  .footer {
    padding: 0px 0px 10px 0px;
  }
}

.logo-footer a img {
  max-width: 125px;
}

.footer-content-wrapper {
  display: flex;
  justify-content: center;
}

.footer-content-wrapper p {
  padding: 4px 0px;
}

.footer-content {
  display: flex;
  z-index: 1;
  position: relative;
}

/*.footer-content {
	column-count: 5;
	z-index: 1;
    position: relative;
}
@media(max-width: 1200px){
   .footer-content{
	column-count: 4;
	}
}
@media(max-width: 992px){
   .footer-content{
	column-count: 2;
	}

}

@media(max-width: 992px){
   .footer-content{
	column-count: 1;
	text-align: center;
	}
	.footer-column-inline{
		display: inline-block;
	}
    .footer-column-legal{
    	display: flex;
    	justify-content: center;
    }
     .footer-column-legal div{
    	margin:  0px 20px;
    }
}

@media(max-width: 576px){
   .footer-content{
	column-count: 1;
	text-align: center;
	}
	.footer-column-inline{
		display: inline-block;
	}
    .footer-column-legal{
    	display: flex;
    	justify-content: center;
    }
     .footer-column-legal div{
    	margin:  0px 20px;
    }
}*/

.footer-column {
  -webkit-column-break-inside: avoid;
  -moz-column-break-inside: avoid;
  -moz-page-break-inside: avoid;
  page-break-inside: avoid;
  break-inside: avoid-column;
  margin: 0px 40px 30px 40px;
}
.footer-column-flex {
  display: flex;
}

@media (min-width: 991px) {
  .footer-follow {
    margin-top: 15px;
  }
}

@media (max-width: 1200px) {
  .footer-column {
    margin: 0px 30px 30px 30px;
  }
}

@media (max-width: 992px) {
  /* .footer {
    padding-top: 80px;
  } */
  .footer-content-wrapper {
    flex-direction: column;
  }
  .footer-content {
    justify-content: center;
  }
  .footer-column-logo {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .logo-footer {
    margin-right: 20px;
  }
}

@media (max-width: 767px) {
  .footer-content-wrapper {
    flex-direction: column;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
  }
  .footer-content {
    justify-content: center;
    flex-direction: column;
  }
  .footer-column {
    margin: 0px 0px 30px 0px;
  }
  .footer-column-legal {
    display: flex;
    justify-content: space-around;
  }
  .footer-column-legal div {
    margin: 0px 30px;
    flex-basis: 50%;
    flex: 1;
  }

  .footer-column-flex {
    margin: 0px;
    justify-content: space-around;
  }

  .footer-column-logo {
    display: unset;
    margin: 0px 0px 30px 0px;
  }
  .logo-footer {
    margin-right: 0px;
  }

  .footer-column-flex .footer-column {
    flex-basis: 50%;
    flex: 1;
  }
}

.logo-footer {
  margin-top: 0px !important;
}

.footer-title {
  color: #363c45;
  font-family: "Nunito-SemiBold";
  font-size: 1.8rem;
  transition: 0.1s all linear;
  margin-bottom: 16px;
}

.footer-text {
  color: white;
  font-family: "Nunito-Light";
  font-size: 1rem;
  position: relative;
}

@media (min-width: 992px) {
  .footer-text:hover a:before {
    content: "\6f";
    font-family: lnclines;
    font-size: 14px;
    position: absolute;
    left: -18px;
  }
}

.copyright {
  color: white;
  font-family: "Nunito-Light";
  font-size: 0.8rem;
  transition: 0.2s all linear;
}

.copyright:hover {
  opacity: 0.7;
  transition: 0.2s all linear;
}

@media (min-width: 992px) and (max-width: 1200px) {
  .copyright {
    margin-top: 20px;
  }
}

footer .lnc-arrow-right {
  visibility: hidden;
  transition: 0.1s all linear;
  opacity: 0.7;
  display: none;
}

.footer-text:hover {
  opacity: 0.7;
  transition: 0.2s all linear;
}

.footer-text:hover .lnc-arrow-right {
  /*visibility: visible;*/
  opacity: 0.7;
  transition: 0.2s all linear;
}

.details-title {
  position: relative;
}
.details-title::after {
  content: "\e037";
  font-family: lnclines;
  color: #3d366c;
  font-size: 1.5rem;
}
.details-accordion.expanded .details-title::after {
  content: "\e023";
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
/* Coockie */
.cookie {
  position: fixed;
  bottom: -40%;
  z-index: 9999;
  left: 0px;
  right: 0px;
  background-color: rgba(255, 255, 255, 0.9);
  padding: 10px 20px;
  transition: all 0.3s linear;
}

.button_container {
  margin: 0 auto;
  text-align: center;
}

.cookie div {
  display: flex;
  gap: 20px;
  justify-content: center;
  align-items: center;
}

.cookie_text {
  font-family: "Nunito-Regular";
  line-height: 1.2;
  color: var(--h2-color);
  font-size: 1.6rem;
}

.cookie_link {
  font-family: "Nunito-black";
  text-decoration: underline;
}

.button_container {
  display: flex;
  justify-content: center;
  gap: 20px;
  align-items: center;
}

.cookie_button {
  padding: 10px 50px;
  border-radius: 10px;
  border: none;
  font-family: "Nunito-Regular";
  cursor: pointer;
}

.accept_button:hover {
  background-color: #8e1f60;
  transition: all 0.2s linear;
}

.decline_button:hover {
  border: 1px solid #8e1f60;
}

.accept_button {
  background-color: var(--h2-color);
  color: white;
}

.decline_button {
  border: 1px solid var(--h2-color);
  color: var(--h2-color);
}

.g-recaptcha {
  margin-top: 20px;
}

/* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
/* Video form modal */
.contact-for-video,
.contact-form-partner-wrapper {
  display: none;
  position: fixed;
  z-index: 9999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(251, 251, 255, 1);
  padding: 20px 20px 0px;
  box-shadow: 0px 0px 40px 23px rgb(0, 0, 0, 0.1);
  border-radius: 20px;
  min-width: 540px;
}

.logo-container {
  width: 100px;
  margin: 0 auto 10px;
}

.logo-container img {
  width: 100%;
}

.contact-logo p {
  font-family: "Nunito-Regular";
  font-size: 1.1rem;
  color: #00537a;
  text-align: center;
  margin: 10px auto;
}

.form-filed {
  display: flex;
  gap: 20px;
}

input:not([type="submit"]),
select {
  height: 4.32rem;
}

.form-filed select {
  width: 100%;
}

.form-element {
  display: flex;
  flex-direction: column;
  flex-basis: 100%;
  width: 100%;
}

.form-element label {
  font-family: "Nunito-Light";
  font-size: 1.4rem;
  color: #00537a;
  margin-top: 15px;
  margin-bottom: 5px;
}

.form-filed select {
  width: 100%;
  outline: none;
  padding: 10px 10px;
  border-radius: 10px;
  border: 1px solid var(--h2-color);
  font-family: "Nunito-Semibold";
  color: black;
  background-color: white;
}

.form-filed input,
textarea {
  width: 100%;
  outline: none;
  padding: 10px 10px;
  border-radius: 10px;
  border: 1px solid var(--h2-color);
  font-family: "Nunito-Semibold";
  color: black;
}

.form-filed input[type="submit"] {
  width: 100%;
  margin-top: 30px;
  background-color: var(--h2-color);
  color: white;
  font-size: 1.3rem;
  cursor: pointer;
}

.form-filed input[type="submit"]:hover {
  background-color: #8e1f60;
  transition: all 0.2s linear;
}

.close-form {
  position: absolute;
  top: 20px;
  right: 20px;
  font-size: 1.3rem;
  color: grey;
  cursor: pointer;
  transition: all 0.2s linear;
}

.close-form:hover {
  transform: rotate(90deg);
  transition: all 0.2s linear;
}

/* --------------------------------------------------------------------------------- */
/* Captcha */

.grecaptcha-badge {
  visibility: hidden;
}

.captcha-style {
  font-family: "Nunito-Light";
  margin: 20px auto 0px auto;
  color: #777;
}

.captcha-style a {
  text-decoration: underline;
  color: #00537a;
}

.main-features-part {
  font-family: "Nunito-Regular";
  font-size: 1.1rem;
}

.lb-data .lb-caption {
  font-size: 16px;
  line-height: 1em;
  font-family: "Nunito-black";
}

.lb-data .lb-number {
  font-size: 13px;
  font-family: "Nunito-Light";
}

/* Language slider Start */
.language {
  color: white;
  display: inline-block;
  position: fixed;
  right: -200px;
  top: 40%;
  z-index: 9997;
  font-size: 2rem;
  cursor: pointer;
  display: flex;
  filter: drop-shadow(0px 0px 3px rgba(0, 0, 0, 0.3));
  font-family: "Nunito-regular";
  transition: all 0.4s linear;
}

.language-bhs {
  right: -180px;
}

.language-sr {
  right: -170px;
}

.planet-button {
  background: #00537a;
  padding: 10px 10px;
  height: 43px;
  line-height: 0.8;
  border-radius: 20px 0px 0px 20px;
}

.language-options {
  background: #00537a;
  padding: 15px 25px;
  font-size: 1.2rem;
  line-height: 1.4;
  border-radius: 0px 0px 0px 20px;
}

.language-options p {
  margin: 5px auto;
}

.language-options p {
  transition: all 0.2s linear;
}

.language-link {
  opacity: 0.6;
  transition: all 0.2s linear;
  font-family: "Nunito-light";
}

.active-language {
  opacity: 1;
  font-family: "Nunito-regular";
}

.language-link:hover {
  opacity: 1;
  transition: all 0.2s linear;
}
.choose-region {
  font-size: 0.9rem;
  font-family: "Nunito-light";
  cursor: default;
}
.slideIsOn {
  right: 0px;
  transition: all 0.4s linear;
}
/* Language slider End */

.landing-content-contact {
  background: none;
  max-width: 100%;
  width: 100%;
  height: 50%;
  display: flex;
  align-items: center;
  flex-direction: column;
  margin: 70px auto 100px auto;
  padding: 20px;
}
@media (max-width: 768px) {
  .landing-content-contact {
    margin-top: 30px;
  }
}
@media (max-width: 768px) {
  .landing-content-contact {
    margin-top: 50px;
  }
}

.landing-content-contact h1 {
  font-family: "Nunito-black";
  font-size: 2.25rem;
  color: #831b5e;
  text-align: center;
}

.lnc-peper-plane:before,
.lnc-mobile:before,
.lnc-location:before {
  color: #831b5e;
}

.contact-info {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 40px;
  margin-top: 50px;
}

.info-text {
  margin-top: 20px;
  transition: all 0.2s linear;
}

.single-contact-info {
  width: 250px;
  height: 105px;
  min-height: 50px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.single-contact-info a {
  text-decoration: none;
  font-family: "Nunito-semibold";
  font-size: 1.6rem;
  color: #00537a;
  line-height: 1.4;
}

.single-contact-info .lnc {
  font-size: 42px;
  color: #d7385e;
}

.info-text:hover a {
  color: #831b5e;
  transition: all 0.2s linear;
}

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ */
/* Responsive design - mobiles and tablets */

.lnc-logo-footer {
  font-size: 16px !important;
  color: white;
}

.footer-social-logo {
  display: flex;
  align-items: center;
  gap: 24px;

  a {
    display: flex;
    align-items: center;

    i {
      transition: 0.2s all linear;

      &:hover {
        opacity: 0.7;
        transition: 0.2s all linear;
      }
    }
  }
}

.dropdown-list-mobile {
  font-family: "Nunito-light";
}

@media (max-width: 1430px) {
  .cards-holder {
    gap: 20px !important;
  }
  .white-cone-small {
    position: absolute;
    top: 70px;
    left: 5%;
    animation: float 5s ease-in-out infinite;
  }

  .purple-cone-small {
    top: 30%;
    right: 10%;
    width: 50px;
  }
  .white-cylinder-small {
    top: 70%;
    right: 5%;
  }
  .purple-cube-small {
    top: 90%;
    left: 5%;
    width: 50px;
  }
  .purple-cube-small img {
    max-width: 50px;
  }
}

@media (max-width: 1310px) {
  .top-banner-text-content {
    text-align: left;
  }
  .top-banner-text-content h2 {
    font-size: 2.5rem;
  }
  .top-banner-levitating-banners .cube {
    bottom: -350px;
    left: 350px;
    width: 150px;
  }
  .top-banner-levitating-banners .cone {
    bottom: -200px;
    left: 480px;
    width: 150px;
  }
  .top-banner-levitating-banners .sphere {
    bottom: -340px;
    right: -740px;
    width: 130px;
  }
  .rocket img {
    left: 0px;
    width: 400px;
  }
  .owl-carousel .item h4 {
    font-size: 1.3rem;
  }
  .users_content {
    padding: 180px 0px;
  }
  .users_content h2 {
    text-align: center;
    font-size: 2rem;
  }
  .cards-holder {
    gap: 80px;
  }
  .mobile_cloud {
    left: -50%;
  }
  .top-banner-levitating-technical {
    top: 100%;
  }
  .top-banner-levitating-features {
    display: none;
  }
  .object-1 {
    right: 10%;
  }
  .object-4 {
    right: 10%;
  }
  .object-7 {
    right: 10%;
  }
  .object-10 {
    right: 10%;
  }
  .object-13 {
    right: 10%;
  }
  .object-14 {
    right: 10%;
  }
  .object-23 {
    right: 10%;
    display: none;
  }
  .object-24 {
    right: 20%;
  }
  .object-34 {
    display: none;
  }
  .object-39,
  .object-38,
  .object-37,
  .object-40,
  .object-46 {
    display: none;
  }
  .testimonials-container {
    margin-top: -50px;
    margin-bottom: 0px;
  }

  .security-card-content,
  .partners-card-content {
    margin-left: 200px;
  }

  .about_text h4 {
    margin: 25px 20px 10px 20px;
  }
  .about_text p {
    margin: 5px 20px;
  }

  .technical-feature-card h3 {
    margin-top: 80px;
    font-size: 1.4rem;
  }
  .features-container {
    padding: 0px 20px;
  }
}

.phone_image {
  max-height: 400px;
}

@media (max-width: 576px) {
  .phone_image {
    max-height: 300px;
    width: unset !important;
  }
}

@media (max-width: 991px) {
  .top-banner-content {
    flex-direction: column;
  }

  .header_content {
    padding: 0px 20px;
  }
}

@media (max-width: 1200px) {
  /* .top-banner-text-content {
    margin-top: 20px;
  } */

  /* .top-banner-content {
    padding: 100px 0 50px 0;
  } */
  .rocket {
    text-align: center;
    margin-top: 20px;
  }
  .top-banner-levitating-banners .cube {
    bottom: -350px;
    left: 350px;
    width: 150px;
  }
  .top-banner-levitating-banners .cone {
    bottom: -200px;
    left: 480px;
    width: 150px;
  }
  .top-banner-levitating-banners .sphere {
    bottom: -340px;
    right: -740px;
    width: 130px;
  }
  .contact-bubble {
    height: auto !important;
  }

  .rocket img {
    margin: 20px 0px 30px 0px;
  }
  /* ------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
  /* Video content */
  .video {
    padding: 50px 20px 0px 20px;
  }
  .video-content p {
    font-size: 1rem;
  }

  /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
  /* Carousel */
  .third-arrow {
    position: relative;
    left: 195px;
  }

  /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
  .users_content {
    text-align: center;
    padding: 0px 20px;
  }
  .users_content-img {
    width: 450px;
    height: 235px;
  }
  .users_white_cone {
    top: 300px;
    left: 0px;
    width: 70px;
  }
  .users_cube {
    top: 0%;
    width: 70px;
  }
  .users_doodle_1 {
    right: 0px;
  }
  .users_doodle_2 {
    left: 50px;
    width: 70px;
  }
  .users_purple_cone {
    bottom: 0%;
  }

  /* -------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
  /* EduIS integration */

  .cloud {
    width: 250px;
  }

  /* ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
  .education-must-go-on {
    padding: 20px;
  }

  /* ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
  /* Chat bubbles */

  footer .lnc-arrow-right {
    display: none;
  }

  .phone_image {
    width: 200px;
  }

  .mobile-app-content {
    max-width: 780px;
    padding: 50px 20px;
  }
  .mobile_spirals {
    display: none;
  }

  .users_content h2 {
    margin-bottom: 20px;
  }
  .mobile-app-content div > h2 {
    margin-bottom: 10px;
    margin-top: 20px;
  }
  .card h4 {
    font-size: 1.6rem;
  }
  .technical-features-cards {
    justify-content: center;
  }
  .call-to-action img {
    right: 20%;
  }

  .details-accordion {
    margin: 20px;
  }

  .white-cone-small,
  .purple-cone-small,
  .white-cylinder-small,
  .purple-cube-small,
  .object-24,
  .object-21,
  .object-17,
  .object-13,
  .object-7,
  .object-1 {
    display: none;
  }

  .cookie div {
    flex-direction: column;
  }
  .button_container {
    flex-direction: row !important;
  }
  .features {
    margin-top: -50px;
  }
  .features-software {
    margin-top: 0px !important;
  }
}

@media (max-width: 1200px) {
  .technical-features-cards {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    margin: 0px 20px;
  }
}

@media (max-width: 1024px) {
  .technical-features {
    padding: 0px 20px;
  }
  .technical-features-cards {
    justify-content: center;
  }
  .teachers-container,
  .parents-container {
    max-width: 45%;
  }
  .accordion {
    padding: 0px 20px;
  }
  .mobile_cube {
    display: none;
  }
  .security.container,
  .partners.container {
    padding: 0px 20px;
  }
}

@media (max-width: 1200px) {
  .header {
    display: none;
  }
  .mobile-header {
    display: block;
    font-size: 1.4rem;
  }
  .mobile-app-content {
    flex-direction: column;
    padding: 20px;
  }
  .mobile-app-content div > h2 {
    text-align: center;
  }
  .mobile-app-content div > p {
    text-align: center;
  }
  .buttons_container {
    justify-content: center;
  }
  .technical-features-cards {
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 0px 20px;
  }
}

@media (max-width: 870px) {
  h2 {
    font-size: 1.5rem;
  }
  .outlook_icon {
    right: 0%;
  }
  .word_icon {
    left: 0%;
  }
  .excell_icon {
    right: 6%;
  }
  .integ-2 {
    left: 7%;
  }
  .sway_icon {
    top: -25%;
  }
  .stream_icon {
    right: 20%;
  }
  .sharepoint_icon {
    left: 37%;
    top: -30%;
  }
  .powerpoint_icon {
    top: 50%;
    left: 5%;
  }
  .exchange_icon {
    top: 60%;
    left: 42%;
  }
  .mobile_cube {
    top: -100%;
    left: 0%;
  }
  .mobile_cloud {
    left: -90%;
  }
  .mobile_doodle {
    top: -20%;
    left: 100%;
  }
  .mobile_bell {
    left: -65%;
  }
  .education-must-content {
    flex-direction: column;
  }
  .main-features-part {
    padding-right: 20px;
  }
  .aside {
    border: none;
  }

  .span-2 {
    grid-column: span 2;
  }
  .features-container {
    margin-top: 40px;
  }
  .software-features {
    margin-top: 50px;
  }
  .footer-content p {
    margin-left: 0px !important;
  }
  .features-content {
    flex-direction: column;
  }
  .main-features-part {
    padding-top: 0px;
  }
  .aside {
    max-width: unset;
  }
  .aside-padding {
    padding-top: 50px;
  }
  .eduis-for-visual {
    margin-bottom: 20px;
    width: unset;
  }
  .features-container .object {
    display: none;
  }
}

@media (max-width: 777px) {
  .top-banner-levitating-banners {
    display: none;
  }
  .third-arrow {
    left: 0;
  }
  .users_content h2 {
    font-size: 1.6rem;
  }
  .integration-cone {
    left: 25%;
  }
  .integration-cylinder {
    right: 25%;
  }
  .text-for-mobile {
    max-width: 80%;
    margin: 0 auto;
  }
  .rocket img {
    width: 350px;
  }
  .features-placeholder {
    height: 240px;
  }
  .security-card p,
  .partners-card p {
    padding-left: 0px;
  }
  .security-card h3,
  .partners-card h3 {
    padding-left: 0px;
    text-align: center;
    margin-left: 0px;
  }
  .object-45 {
    right: 1%;
  }
  .call-to-action img {
    right: 10%;
  }
  .hearth {
    left: 24%;
    top: -30%;
  }
  .features {
    gap: 15px;
    margin: -50px 10px 20px 10px !important;
  }
  .features-software {
    margin-top: -75px !important;
  }
  .object-42 {
    display: none;
  }

  .contact-for-video {
    min-width: unset;
    width: 90% !important;
  }
  .eduis_users {
    margin: -100px;
  }
}

@media (max-width: 600px) {
  .cloud {
    top: -70px;
    left: 30%;
  }
  .mobile_doodle {
    display: none;
  }
  .mobile_cube {
    display: none;
  }
  .mobile_cloud {
    left: -60%;
  }
  .users_content-img {
    width: 360px;
    height: 188px;
  }
  .users_globe {
    width: 80px;
  }
  .integ-4,
  .hearth,
  .integ-1,
  .integ-2,
  .integ-3,
  .integ-5,
  .object-2,
  .object-5,
  .object-4,
  .object-6,
  .object-8,
  .object-10,
  .object-9,
  .object-11,
  .object-12,
  .object-20,
  .object-26 {
    display: none;
  }
  .powerpoint_icon {
    top: 30%;
    left: 0%;
  }
  .outlook_icon {
    top: 0%;
  }
  .features-content {
    flex-direction: column;
  }
  .aside {
    max-width: 100%;
    margin: 0px;
    padding: 30px 0px 0px 0px;
  }
  .main-features-part {
    padding: 0px;
  }
  .teachers-img img {
    width: 80%;
  }
  .school-admin-img img {
    width: 60%;
    top: 25px;
    position: relative;
  }
  .edu_for-img {
    bottom: 30%;
    left: 320px;
  }
  .parents-img {
    top: -40%;
  }
  .students-img img {
    width: 70%;
    bottom: 40px;
    position: relative;
  }
  .end-user {
    bottom: 20px;
    left: 30%;
  }
  .availability {
    right: 0;
    top: 50%;
  }
  .call-to-action {
    margin: 0px auto 180px;
  }

  .call-to-action button {
    margin: 60px auto;
  }
  .play_video_button {
    width: 80px;
  }

  .testimonial-text {
    font-size: 1rem !important;
  }
}

@media (max-width: 576px) {
  .chat-bubbles-img img {
    top: unset;
    max-width: 120px !important;
    right: 20px;
  }
  .security-card img,
  .partners-card img {
    position: absolute;
    top: -60px;
    left: 25%;
    max-width: 120px;
  }
  .security-card-content,
  .partners-card-content {
    margin-left: 0px;
  }
  .security-card,
  .partners-card {
    margin: 80px 20px 10px 20px;
    padding: 60px 20px 30px 20px;
  }
  .details-accordion {
    margin: 20px 10px;
  }
}

@media (max-width: 550px) {
  .mobile_spiral {
    left: -40%;
  }
  .mobile_bell {
    left: -45%;
  }
  .object-16 {
    display: none;
  }
  .features-placeholder {
    height: 200px;
  }
  .call-to-action img {
    display: none;
  }
  .details-title {
    font-size: 1.1rem;
  }
  .location-info {
    gap: 30px;
    flex-direction: column;
    text-align: center;
  }
  .form-filed {
    flex-direction: column;
    gap: 0px;
  }
  .form-filed select,
  .form-filed input {
    padding: 10px 10px;
  }
  /* .form-element label {
    font-size: 0.9rem;
  } */
  .contact-logo {
    margin-bottom: 0;
  }
  .form-filed input[type="submit"] {
    margin-top: 20px;
    margin-bottom: 5px;
  }
  .top-banner-content-features h2 {
    font-size: 2rem;
  }
  .technical-features-cards {
    display: grid;
    grid-template-columns: 1fr;
    margin: 0px 10px;
    gap: 0px;
  }
  .features {
    margin-top: -30px !important;
  }
}

@media (max-width: 450px) {
  .mobile_cloud_two {
    right: -40%;
  }
  .integration-cone {
    left: 5%;
  }
  .integration-cylinder {
    right: 5%;
  }
  .about-statistics {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 50px;
  }
  .about-stat {
    position: unset;
  }
  .object-45 {
    display: none;
  }

  .rocket {
    display: flex;
    align-items: center;
    justify-content: center;
  }
  /* .rocket img {
    display: none;
  }
  .rocket-img-sm {
    display: block !important;
  } */
  .cloud {
    left: 10%;
  }
  .users_content-img-sm {
    display: block;
    width: 280px;
    height: 146px;
  }
  .users_content-img {
    display: none;
  }
  .users_doodle_2,
  .users_white_cone,
  .users_purple_cone,
  .mobile_cloud,
  .mobile_bell,
  .mobile_cloud_two,
  .mobile_toggle,
  .object-35 {
    display: none;
  }
  .banner-hight {
    height: 120vh;
  }
  .features-placeholder {
    height: 150px;
  }
  .object-27,
  .object-22,
  .object-23 {
    display: none;
  }
  .top-banner-content {
    padding: 56px 20px 50px 20px;
  }
  .home-top-banner {
    padding: 56px 20px;
    min-height: 100vh;
    justify-content: center;
  }
  .home-top-banner .rocket img {
    margin-top: 30px;
  }
  .owl-carousel .item h4 {
    font-size: 1rem;
    line-height: 1.2;
  }
}

.landing {
  position: relative;
  overflow: hidden;

  h1 {
    font-family: "Nunito-Bold";

    strong {
      font-family: "Nunito-Black";
    }
  }
}

@media (max-width: 390px) {
  .top-banner-text-content h1 {
    font-size: 2.6rem;
  }
  .top-banner-text-content h2 {
    font-size: 2rem;
  }
  .top-banner-content-features p {
    max-width: 100%;
    margin: 0px auto 30px;
  }
  .card_image {
    left: 0%;
  }
  .security-card img,
  .partners-card img {
    width: 150px;
  }
  .eduis-for-img img {
    width: 40px;
  }
  .expert-container,
  .school-admin-container,
  .teachers-container,
  .parents-container,
  .students-container {
    max-width: 100%;
  }
}

@media (min-width: 777px) {
  .top-banner-levitating-banners {
    position: absolute;
    z-index: 6;
    top: 650px;
  }
}

/* .dropdown-holder:hover .dropdown-list {
  display: flex !important;
} */

/* input autofill style */

input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:active,
input:-webkit-autofill:focus,
select:-internal-autofill-selected {
  background-color: #ffffff !important;
  color: #000 !important;
  -webkit-box-shadow: 0 0 0 1000px white inset !important;
  -webkit-text-fill-color: #000 !important;
}

.user-manual-container {
  margin-top: 10px;
}
@media (max-width: 1200px) {
  .user-manual-container {
    margin-top: 50px;
  }
}

.user-manual-container h4 {
  font-family: "Nunito-Bold";
  margin-bottom: 15px;
  color: #00537a;
  font-size: 18px;
}

.user-manual-container h3 {
  font-family: "Nunito-Black";
  font-size: 1.25rem;
  margin-bottom: 30px;
}

@media (max-width: 992px) {
  .user-manual-container h3 {
    text-align: center;
  }
}

.bulletin-list {
  margin-bottom: 30px;
}

.bulletin-list li {
  list-style-type: disc;
  margin: 10px 0px 10px 30px;
  line-height: 1.5;
  font-size: 17px;
}

.user-manual-container .buttons_container {
  justify-content: center;
  margin-bottom: 20px;
}

.hr-line {
  margin: 30px 0px;
  border: 1px solid #dcdcdc;
}

.popup-container {
  position: fixed;
  top: 0;
  bottom: 0;
  z-index: 9999;
  left: 0px;
  right: 0px;
  background-color: rgba(255, 255, 255, 0.4);
  padding: 5px 20px;
  transition: all 0.3s linear;
  opacity: 0;
  animation: showPopup 0.3s forwards 2s linear;
  min-width: 100vw;
}

@keyframes showPopup {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.popup-content {
  border-radius: 20px;
  background-color: #fff;
  padding: 50px 40px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 2px 20px rgba(122, 24, 93, 0.3);
  min-width: 300px;
}

@media (max-width: 576px) {
  .popup-content {
    max-width: 300px;
  }
}

@media (max-width: 992px) {
  .popup-content .buttons_container {
    flex-direction: column;
  }
}

.popup-content p {
  text-align: center;
  margin-top: 20px;
  color: #00537a;
  font-size: 1.125rem;
  font-family: "Nunito-SemiBold";
  margin: 20px 0px 10px 0px;
}
.close-popup {
  position: absolute;
  top: 20px;
  right: 20px;
}
.close-popup:hover {
  cursor: pointer;
}

.close-popup i {
  font-size: 20px;
  color: #575757;
}

.popup-cone {
  position: absolute;
  right: 40px;
  bottom: -45px;
  animation: float 10s linear infinite;
}

.popup-ball {
  position: absolute;
  right: -39px;
  top: 50px;
  animation: float 5s ease-in-out infinite;
}

.popup-cylindar {
  position: absolute;
  left: -40px;
  bottom: 22px;
  height: 85px;
  animation: float 6s ease-in-out infinite;
}

/*Contact form*/
.contact-form-wrapper,
.contact-form-partner-wrapper {
  max-width: 700px;
  background-color: #fff;
  margin: auto;
  border-radius: 20px;
  padding: 0px;
  overflow: hidden;
}

.contact-form-partner-wrapper {
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.102);
}
.contact-form-wrapper {
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.102);
}

@media (max-width: 768px) {
  .contact-form-wrapper {
    max-width: unset;
  }
}
@media (max-width: 576px) {
  .contact-form-wrapper {
    max-width: unset;
  }
}

.contact-form-wrapper form,
.contact-form-partner-wrapper form {
  padding: 30px;
}

.contact-form-partner-wrapper .contact-form {
  max-height: 96vh;
  overflow: auto;
}

@media (max-width: 576px) {
  .contact-for-video,
  .contact-form-partner-wrapper {
    box-shadow: none;
    border-radius: 0px;
    width: 100%;
    min-width: unset;
    height: 100vh;
    padding: 0px;
  }
  .contact-form-partner-wrapper .contact-form {
    max-height: 100vh;
  }
}

.contact-form h3 {
  color: #363c45;
  font-size: 2.4rem;
  margin-bottom: 20px;
  font-family: "Nunito-Bold";
}

.contact-form .button {
  justify-content: center;
  margin-top: 20px;
}

.help-block.with-errors {
  margin-top: 5px;
  font-size: 0.875rem;
  color: #cc3366;
  font-family: "Nunito-SemiBold";

  li {
    color: #cc3366;
  }
}

.has-error.has-danger {
  input,
  textarea {
    border: 1px solid #cc3366;
  }
}

.pdf-link-text {
  height: 14px;
}

/* Partners page style */

.partners-background {
  background-image: url(../images/eduis-integration_line.png);
  background-repeat: no-repeat;
  background-position: top;
}

.partners {
  margin: 70px auto;
  position: relative;
}

@media (min-width: 576px) {
  .wallet-icon {
    width: 200px;
    left: -40px !important;
  }
}

.partners-benefits {
  text-align: center;
  margin-bottom: 130px;
  padding: 0px 20px;
}

.partners-benefits p {
  line-height: 1.2;
  font-size: 1.125rem;
}
.partners-benefits h2 {
  margin-bottom: 20px;
}
@media (min-width: 1200px) {
  .partners-benefits {
    margin-top: -50px;
  }
  .partners-benefits p {
    max-width: 80%;
    margin: 0 auto;
  }
}

.partner-program-section {
  margin-bottom: 70px;
}

.partner-program-section h2 {
  text-align: center;
}

.partner-programs {
  display: flex;
  align-items: baseline;
  gap: 5px;
  color: var(--white);
}

@media (max-width: 992px) {
  .partner-programs {
    display: none;
  }
}

.partner-programs-accordion .details-accordion {
  background-color: var(--carousel-blue);
  margin: 20px 30px;
}

@media (max-width: 576px) {
  .partner-programs-accordion .details-accordion {
    margin: 20px 0px;
  }
  .partner-program-section {
    margin-top: 70px;
  }
}

@media (max-width: 460px) {
  .partner-programs-accordion.accordion {
    margin-top: 0px;
  }
}

.partner-programs-accordion .details-title {
  color: var(--white);
}

.partner-programs-accordion .details-title::after {
  color: #ededed;
}

.partner-programs-accordion .details-content {
  color: #ededed;
}

.partner-programs-accordion .button {
  margin-top: 20px;
}

@media (min-width: 992px) {
  .partner-programs-accordion {
    display: none;
  }
}

.partner-programs .item {
  flex-basis: 100%;
  display: flex;
  flex-direction: column;
  gap: 20px;
  align-items: center;
  padding: 25px 20px;
  background-color: var(--carousel-blue);
  box-shadow: 0px 37px 28px -23px rgb(122 24 93 / 35%);
  border-radius: 20px;
  margin: 0 15px;
}

.partner-programs h4:after {
  content: "";
}
.partner-programs h4 {
  font-family: "Nunito-Bold";
}
.partner-programs p {
  color: #ededed;
  line-height: 1.3;
  font-family: "Nunito-Light";
}

.partner-programs .button {
  font-size: 0.875rem;
}

@media (max-width: 450px) {
  .partner-programs h4 {
    font-size: 1.3rem;
  }
}

.strategic-partners-wrapper {
  text-align: center;
  margin-bottom: 150px;
  position: relative;
}
.strategic-partners-wrapper .decorative-line {
  position: absolute;
  left: -30%;
  right: 0;
  top: -200%;
  z-index: -1;
}
@media (max-width: 992px) {
  .strategic-partners-wrapper .decorative-line {
    display: none;
  }
}

.strategic-partners {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.strategic-partners-card {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 20px;
  width: 250px;
  height: 160px;
  padding: 20px;
  background: rgba(244, 244, 244, 0.85);
  box-shadow: 0px 31.9226px 24.1576px -27.6087px rgba(122, 24, 93, 0.35);
  border-radius: 20px;
}

.strategic-partners-card:hover {
  transform: translateY(-3px);
  transition: 300ms all ease;
  cursor: pointer;
}

.strategic-partners-card img {
  max--width: 200px;
}

.mpik-en-logo {
  height: 100px;
}

.messages {
  font-size: 1.6rem;
  color: white;
  padding: 9px 12px;
  margin-top: 16px;
  background-color: red;
  text-align: center;
  border-radius: 5rem;

  &:empty {
    display: none;
  }
}

@media (min-width: 450px) {
  .users_content-img-sm {
    display: none;
  }
}

.demo-decorative-line {
  position: absolute;
  z-index: -1;
  left: 0;
  right: 0;
  top: 35%;
  overflow: hidden;
}

.request-for-demo-layout .header {
  background: #831b5e;
  min-height: 70px;
}
.request-for-demo-layout .header .dropdown-list {
  background: #831b5e;
}

.request-for-demo-layout .mobile-header {
  background: #831b5e;
}

.requestDemo-container {
  display: flex;
  gap: 50px;
  padding: 150px 25px 100px 25px;
  margin-top: 8rem;
}
@media (max-width: 1200px) {
  .requestDemo-container {
    gap: 30px;
  }
}
@media (max-width: 768px) {
  .requestDemo-container {
    flex-direction: column;
  }
}

.requestDemo-container .contact-form-wrapper {
  margin-top: 0px;
}
@media (max-width: 576px) {
  .requestDemo-container .contact-form-wrapper {
    margin-left: 0px;
    margin-right: 0px;
  }
}

.demo-column-details h1 {
  color: #363c45;
  font-size: 3.2rem;
  font-family: "Nunito-Bold";
}
.demo-column-details-text {
  width: 100%;
  max-width: 50.7rem;
}

@media (max-width: 1200px) {
  .demo-column-details h1 {
    font-size: 3rem;
  }
}

@media (max-width: 390px) {
  .demo-column-details h1 {
    font-size: 2.6rem;
  }
  .demo-column-details {
    margin-left: 0px;
    margin-right: 0px;
  }
}

@media (min-width: 1000px) {
  .demo-column-details h1 {
    /* color: #7a185d; */
    font-size: 3.2rem;
    font-family: "Nunito-Bold";
    max-width: 90%;
  }
}

.demo-column-details p {
  color: #00537a;
  font-size: 1.6rem;
  font-family: "Nunito-Bold";
  line-height: 21.82px;
  margin-bottom: 40px;
}

.demo-list li {
  color: #676e79;
  font-size: 14px;
  font-family: "Nunito-Regular";
  display: flex;
  align-items: center;
  gap: 12px;
  &:not(:last-child) {
    margin-bottom: 25px;
  }
}

.demo-list li i {
  font-size: 18px;
  color: #00537a;
}

.school-logos {
  margin-top: 50px;
}

@media (min-width: 992px) {
  .school-logos {
    margin-top: 150px;
  }
}

@media (min-width: 768px) {
  .mobile-school-logos {
    display: none;
  }
}

@media (max-width: 768px) {
  .web-school-logos {
    display: none;
  }
}

.mobile-school-logos {
  margin-left: 3rem;
  margin-right: 3rem;
}

.school-logos p {
  color: #000;
  font-size: 1.5rem;
  margin-bottom: 2rem;
}

.school-logos-wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 3rem;
  max-width: 50rem;
}

.school-logos-wrapper img {
  height: 6rem;
  width: 6rem;
  filter: grayscale(1);
  opacity: 0.8;
}

/* NOVI STILOVI! */

.section-container {
  margin-left: auto;
  margin-right: auto;
  padding: 8rem 0 8rem 0;
  max-width: 104rem;
  width: 100%;

  + .section-container {
    padding-top: 0;
  }

  @media (max-width: 991px) {
    padding: 8rem 1.5rem 8rem 1.5rem;
  }
}
.section-container-integration {
  margin-left: auto;
  margin-right: auto;
  padding: 8rem 0 8rem 0;
  max-width: 104rem;
  width: 100%;

  + .section-container {
    padding-top: 0;
  }

  @media (max-width: 991px) {
    padding: 5.6rem 1.5rem 0rem 1.5rem;
  }
}

.flexible-school {
  h2 {
    font-family: "Nunito-bold";
    font-size: 2.4rem;
    color: #363c45;
  }

  h2,
  p {
    text-align: center;
  }

  p {
    color: #676e79;
    margin-bottom: 3.2rem;
  }
}

.school-organisations {
  display: flex;
  gap: 16px;
  margin-bottom: 3.2rem;

  @media (max-width: 991px) {
    flex-direction: column;
  }
}

.school-organisation {
  width: 100%;
  background-color: white;
  border-radius: 2.4rem;
  border: 2px solid white;

  .school-organisation-image {
    aspect-ratio: 51/19;
    width: 100%;
    border-radius: 1.6rem;
    overflow: hidden;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
  }

  h3 {
    margin-block: 2rem;
    text-align: center;
    font-size: 2.1rem;
    color: #7b185d;
    font-family: "Nunito-Bold";
  }
}

.testimonials-wrapper {
  background-color: #f9fafb;
  padding: 56px;
  border-radius: 16px;

  h3 {
    color: #363c45;
    font-family: "Nunito-Bold";
    text-align: center;
    font-size: 2.4rem;
    margin-bottom: 3.2rem;
  }

  p {
    text-align: center;
    margin-bottom: 3.2rem;
  }

  @media (max-width: 991px) {
    padding: 5.6rem 2.4rem 5.6rem 2.4rem;
  }
}

.testimonials-columns {
  display: flex;
  gap: 1.6rem;

  @media (max-width: 991px) {
    flex-direction: column;
  }
}

.testimonials-group {
  flex-basis: 50%;

  &:first-child {
    @media (max-width: 991px) {
      flex-direction: column;
    }
  }
}

.testimonial {
  padding: 3.2rem;
  background: url(../images/gradients.svg), #ffffff;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  border: 1px solid #dddfe4;
  border-radius: 1.6rem;

  blockquote {
    font-style: italic;
    line-height: 1.5;
    margin-bottom: 1.8rem;
  }

  h4 {
    color: #7b185d;
    font-family: "Nunito-Bold";
    font-size: 1.6rem;
  }

  .testimonial-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 1.6rem;
    padding: 0 0.8rem;
    border-radius: 0.8rem;
    height: 5rem;
    background-color: white;
  }

  &:not(:last-child) {
    margin-bottom: 1.6rem;
  }
}

.star-container {
  display: flex;
  justify-content: center;
  gap: 0.8rem;
  margin-bottom: 2rem;
}

.eduis-background {
  background: linear-gradient(
    0deg,
    #3f0e30 0%,
    #471036 24%,
    #5d1646 61%,
    #7b1f5d 100%
  );
}

.section-split {
  display: flex;
  /* gap: 11.2rem; */
  width: inherit;
  justify-content: space-between;

  .section-column {
    width: 100%;
    max-width: 60rem;

    @media (max-width: 991px) {
      width: inherit;
    }

    @media (min-width: 1201px) {
      flex-shrink: 0;
    }
  }

  @media (max-width: 991px) {
    flex-direction: column;
    gap: 5.6rem;
    align-items: center;
  }
}

.quiz-section,
.video-section {
  color: white;

  h3 {
    font-size: 2.4rem;
    font-family: "Nunito-Bold";
    margin-bottom: 3.2rem;
  }

  p {
    color: white;
    margin-bottom: 3.2rem;
  }

  .section-split {
    align-items: flex-end;

    .section-column {
      display: flex;
      justify-content: center;
      &:first-child {
        @media (min-width: 992px) {
          margin-bottom: 8rem;
        }
      }
      .quiz-text {
        display: flex;
        flex-direction: column;
        @media (max-width: 992px) {
          align-items: center;
          text-align: center;
        }
      }
    }
  }

  @media (min-width: 992px) {
    margin-top: -25rem;
  }
}

.quiz-section {
  .section-container {
    padding: 8rem 1.5rem 0 1.5rem;
    @media (max-width: 991px) {
      padding: 8rem 1.5rem 0 1.5rem;
    }
  }
}

.video-section {
  .section-container {
    @media (min-width: 992px) {
      padding-top: 24rem;
    }
  }
}

.brand-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  width: 100%;
  place-items: center;
  gap: 2.4rem 1.6rem;

  .brand-grid-item {
    aspect-ratio: 19/10;
    width: 100%;
    height: 100%;
    background-color: white;
    border-radius: 1.6rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    position: relative;
    overflow: hidden;

    img {
      max-height: 8rem;
      max-width: 13.3rem;
      object-fit: contain;
      object-position: center;
      height: 100%;
    }

    span {
      display: none;
      text-align: center;
      justify-content: center;
      align-items: center;
      position: absolute;
      pointer-events: none;
      background-color: white;
      color: #363c45;
      position: absolute;
      inset: 0;
      font-size: 1.4rem;
      font-family: "Nunito-SemiBold";
    }

    &:hover {
      span {
        display: flex;
      }
    }
  }

  @media (max-width: 991px) {
    grid-template-columns: repeat(3, 1fr);
  }

  @media (max-width: 600px) {
    grid-template-columns: repeat(2, 1fr);
  }
}

.video-overlay {
  position: relative;
  overflow: hidden;
  display: flex;
  justify-content: center;
  border-radius: 1.6rem;
  aspect-ratio: 104/58.6;

  > .video-mask {
    position: absolute;
    inset: 0;
    z-index: 1;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;

    img {
      position: absolute;
      inset: 0;
      object-fit: contain;
      width: 100%;
    }
  }

  .button-primary {
    position: absolute;
    bottom: 4.4%;
    z-index: 2;
    color: white;
    cursor: pointer;

    @media (max-width: 991px) {
      bottom: 8%;
    }
  }

  &.play {
    .video-mask {
      display: none;
    }
  }

  h3 {
    position: absolute;
    z-index: 2;
    top: 30%;
    max-width: 62.7rem;
    text-align: center;
    font-size: 3.6rem;
    line-height: 1.3;
    color: #ffffff;

    @media (max-width: 991px) {
      padding-inline: 1rem;
      font-size: 4vw;
    }
  }
}

.brand-slider-3 {
  .brand-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.brand-slider,
.brand-slider-3 {
  .owl-stage-outer {
    padding-bottom: 2rem;
  }
}

.owl-carousel {
  .owl-nav {
    display: flex;
    justify-content: center;
    gap: 0.7rem;

    button.owl-prev,
    button.owl-next {
      padding: 1rem !important;
      background-color: white !important;
      border-radius: 50%;
      width: 2.4rem;
      height: 2.4rem;
      display: flex;
      align-items: center;
      justify-content: center;

      .lnc {
        font-size: 1rem;
      }
    }
  }
}

/****PARTNERSHIP CTA****/
.partnership-cta {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  min-height: 34.5rem;
  overflow: hidden;
  border-radius: 1.6rem;

  &::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
      270deg,
      #00537a00,
      #00537a40,
      #00537a 54.28%,
      #00537a 100.16%
    );
  }

  @media (max-width: 860px) {
    flex-direction: column;

    &::before {
      background: linear-gradient(
        0deg,
        #00537a00,
        #00537a40,
        #00537a 54.28%,
        #00537a 100.16%
      );
    }
  }

  .text-img-separator {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 100%;
    z-index: 2;
    object-fit: contain;

    @media (max-width: 991px) {
      display: none;
    }
  }

  .partnership-cta-text {
    position: relative;
    z-index: 3;
    max-width: 45rem;
    padding-left: 8rem;

    h3 {
      font-size: 2.4rem;
      color: white;
      margin-bottom: 3.2rem;
    }

    @media (max-width: 860px) {
      padding-left: 2.4rem;
      padding-right: 2.4rem;
      padding-top: 5.6rem;
    }
  }

  .partnership-cta-image {
    position: absolute;
    right: 0;
    z-index: 0;

    @media (max-width: 860px) {
      position: relative;
    }
  }
}

.talk-to-expert {
  display: flex;
  align-items: center;
  position: relative;
  width: 100%;
  min-height: 34.5rem;
  overflow: hidden;
  border-radius: 1.6rem;

  &::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(
      90deg,
      #3f0e30 0%,
      #471036 24%,
      #5d1646 40%,
      rgb(93 22 70 / 69%) 61%,
      rgb(123 31 93 / 21%) 100%
    );
  }

  @media (max-width: 860px) {
    flex-direction: column;

    &::before {
      background: linear-gradient(
        181deg,
        #3f0e30 0%,
        #471036 24%,
        #5d1646 40%,
        rgb(93 22 70 / 69%) 61%,
        rgb(123 31 93 / 21%) 100%
      );
    }
  }

  .text-img-separator {
    position: absolute;
    left: 0;
    bottom: 0;
    height: 100%;
    z-index: 2;
    object-fit: contain;

    @media (max-width: 991px) {
      display: none;
    }
  }
}

.expert-text {
  position: relative;
  z-index: 3;
  max-width: 45rem;
  padding-left: 8rem;

  h3 {
    font-size: 2.4rem;
    color: white;
    margin-bottom: 3.2rem;
  }

  @media (max-width: 860px) {
    padding-left: 2.4rem;
    padding-right: 2.4rem;
    padding-top: 5.6rem;
  }
}

.expert-image {
  position: absolute;
  right: 0;
  z-index: 0;

  @media (max-width: 860px) {
    position: relative;
  }
}

.page-top-banner {
  padding-bottom: 0 !important;
}

.page-top-banner-center {
  display: flex;
  justify-content: center;
  align-items: center;

  h1,
  p {
    text-align: center;
  }

  .page-name,
  p {
    margin-inline: auto;
  }

  .top-banner-text-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    max-width: 77.4rem;
    flex-basis: 100%;
  }

  .buttons-wrapper {
    margin-bottom: 3.2rem;
  }
}

.page-name {
  display: inline-block;
  width: fit-content;
  font-size: 1.4rem;
  font-family: "Nunito-SemiBold";
  color: #7b185d;
  border-radius: 1.5rem;
  padding: 0.4rem 1.2rem;
  background-color: rgba(123, 24, 93, 0.07);
  margin-bottom: 1.6rem;
}

section.school-management {
  .button {
    margin-left: auto;
    margin-right: auto;
  }
}

.functional-components-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.6rem;
  margin-bottom: 1.6rem;

  .functional-component {
    padding: 1.2rem;
    border: 1px solid transparent;
    border-radius: 0.8rem;
    background-color: white;
    transition: all 0.2s ease-out;
    cursor: pointer;

    @media (max-width: 991px) {
      &:not(:last-child) {
        margin-bottom: 1.6rem;
      }
    }

    .functional-component-header {
      display: flex;
      flex-direction: column;
      gap: 1.2rem;

      .component-icon {
        width: 3.6rem;
        height: 3.6rem;
        border-radius: 0.6rem;
        display: flex;
        justify-content: center;
        align-items: center;

        .lnc {
          font-size: 2rem;
        }
      }

      h5 {
        color: #363c45;
        font-size: 1.8rem;
      }

      p {
        font-size: 1.4rem;
        margin-bottom: 1.2rem;
      }
    }

    .functional-component-content {
      @media (min-width: 992px) {
        display: none;
      }
    }

    &.school-management {
      .functional-component-header {
        .component-icon {
          background-color: #e5f2ff;

          .lnc {
            color: #2691d9;
          }
        }
      }

      &.active {
        border-color: #badfff;
        /* overflow: hidden; */

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #00538f;
            }
          }

          h5 {
            color: #00538f;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #e5f2ff;

        .functional-component-header {
          .component-icon {
            background-color: #badfff;
          }
        }
      }

      @media (max-width: 991px) {
        background-color: #e5f2ff;
        border-color: #badfff;

        .functional-component-header {
          .component-icon {
            background-color: #badfff;

            .lnc {
              color: #00538f;
            }
          }

          h5 {
            color: #00538f;
          }
        }
      }
    }

    &.school-administration {
      .functional-component-header {
        .component-icon {
          background-color: #dcf4f9;

          .lnc {
            color: #009ea8;
          }
        }
      }

      &.active {
        border-color: #ade3eb;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #006170;
            }
          }

          h5 {
            color: #006170;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #dcf4f9;
        .functional-component-header {
          .component-icon {
            background-color: #ade3eb;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #ade3eb;
        background-color: #dcf4f9;

        .functional-component-header {
          .component-icon {
            background-color: #ade3eb;

            .lnc {
              color: #006170;
            }
          }

          h5 {
            color: #006170;
          }
        }
      }
    }

    &.human-resources {
      .functional-component-header {
        .component-icon {
          background-color: #ffe4e6;

          .lnc {
            color: #f43f5e;
          }
        }
      }

      &.active {
        border-color: #fecdd3;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #be123c;
            }
          }

          h5 {
            color: #be123c;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #ffe4e6;

        .functional-component-header {
          .component-icon {
            background-color: #fecdd3;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #fecdd3;
        background-color: #ffe4e6;

        .functional-component-header {
          .component-icon {
            background-color: #fecdd3;

            .lnc {
              color: #be123c;
            }
          }

          h5 {
            color: #be123c;
          }
        }
      }
    }

    &.fees {
      .functional-component-header {
        .component-icon {
          background-color: #ede9fe;

          .lnc {
            color: #8b5cf6;
          }
        }
      }

      &.active {
        border-color: #ddd6fe;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #8b5cf6;
            }
          }

          h5 {
            color: #8b5cf6;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #ede9fe;

        .functional-component-header {
          .component-icon {
            background-color: #ddd6fe;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #ddd6fe;
        background-color: #ede9fe;

        .functional-component-header {
          .component-icon {
            background-color: #ddd6fe;

            .lnc {
              color: #8b5cf6;
            }
          }

          h5 {
            color: #8b5cf6;
          }
        }
      }
    }

    &.admission {
      .functional-component-header {
        .component-icon {
          background-color: #fef3c7;

          .lnc {
            color: #f59e0b;
          }
        }
      }

      &.active {
        border-color: #fde68a;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #b45309;
            }
          }

          h5 {
            color: #b45309;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #fef3c7;

        .functional-component-header {
          .component-icon {
            background-color: #fde68a;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #fde68a;
        background-color: #fef3c7;

        .functional-component-header {
          .component-icon {
            background-color: #fde68a;

            .lnc {
              color: #b45309;
            }
          }

          h5 {
            color: #b45309;
          }
        }
      }
    }

    &.timetable {
      .functional-component-header {
        .component-icon {
          background-color: #d1fae5;

          .lnc {
            color: #10b981;
          }
        }
      }

      &.active {
        border-color: #a7f3d0;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #047857;
            }
          }

          h5 {
            color: #047857;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #d1fae5;

        .functional-component-header {
          .component-icon {
            background-color: #a7f3d0;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #a7f3d0;
        background-color: #d1fae5;

        .functional-component-header {
          .component-icon {
            background-color: #a7f3d0;

            .lnc {
              color: #047857;
            }
          }

          h5 {
            color: #047857;
          }
        }
      }
    }

    &.automatic-timetable-generator {
      .functional-component-header {
        .component-icon {
          background-color: #fae1f2;

          .lnc {
            color: #c95ca8;
          }
        }
      }

      &.active {
        border-color: #facdec;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #952f76;
            }
          }

          h5 {
            color: #952f76;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #fae1f2;

        .functional-component-header {
          .component-icon {
            background-color: #facdec;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #facdec;
        background-color: #fae1f2;

        .functional-component-header {
          .component-icon {
            background-color: #facdec;

            .lnc {
              color: #952f76;
            }
          }

          h5 {
            color: #952f76;
          }
        }
      }
    }

    &.reports {
      .functional-component-header {
        .component-icon {
          background-color: #cfe8f4;

          .lnc {
            color: #3798c6;
          }
        }
      }

      &.active {
        border-color: #b0daed;

        .functional-component-header {
          .component-icon {
            .lnc {
              color: #0a6b98;
            }
          }

          h5 {
            color: #0a6b98;
          }
        }
      }

      &:hover,
      &.active {
        background-color: #cfe8f4;

        .functional-component-header {
          .component-icon {
            background-color: #b0daed;
          }
        }
      }

      @media (max-width: 991px) {
        border-color: #b0daed;
        background-color: #cfe8f4;

        .functional-component-header {
          .component-icon {
            background-color: #b0daed;

            .lnc {
              color: #0a6b98;
            }
          }

          h5 {
            color: #0a6b98;
          }
        }
      }
    }

    @media (max-width: 991px) {
      flex-direction: column;
    }
  }

  @media (max-width: 991px) {
    /* grid-template-columns: 1fr; */
    display: block;
    margin-bottom: unset;
  }
}

.active-functional-component {
  height: 58.6rem;
  background-color: white;
  border-radius: 2.4rem 0 0 2.4rem;
  padding: 4rem 0 4rem 3.2rem;
  overflow: hidden;

  @media (max-width: 991px) {
    display: none;
  }
}

.functional-component-slider {
  background-color: white;
  border: 2px solid #f3f4f6;
  overflow: hidden;
  padding: 1.6rem 0 1.6rem 1.6rem;
  border-radius: 2.4rem 0 0 2.4rem;

  img {
    display: flex;
    border-radius: 1.6rem 0 1.6rem 1.6rem;
    object-fit: cover;
    object-position: left top;

    @media (min-width: 992px) {
      height: 46.7rem !important;
    }

    @media (max-width: 991px) {
      padding: 0;
      border-radius: 0;
      border: 0;
      height: 15.9rem !important;
      object-position: center top;
    }
  }

  .owl-item {
    border-radius: 1.6rem 0 1.6rem 1.6rem;
  }

  .owl-nav {
    position: absolute;
    bottom: 30px;
    left: 20px;
    transform: translateX(-150%);
    transition: all 0.2s ease-out;

    @media (max-width: 991px) {
      transform: unset;
      bottom: -3.4rem;
      left: 0;
    }
  }

  .owl-stage-outer {
    padding-bottom: 0;
    max-width: calc(100vw - 45px);
  }

  &:hover {
    .owl-nav {
      transform: translateX(0%);
    }
  }

  @media (max-width: 991px) {
    padding: 0;
    border-radius: 0;
    border: 0;
    margin-bottom: 3rem;
    overflow: visible;
  }
}

.reports {
  .functional-component-slider {
    img {
      @media (min-width: 992px) {
        height: 70rem !important;
      }

      @media (max-width: 991px) {
        height: 40rem !important;
      }
    }
  }
}

.screenshot-slider {
  /* border-radius: 1.6rem 0 0 1.6rem;
  overflow: hidden; */
  .owl-stage-outer {
    cursor: pointer;

    &::before {
      content: "";
      position: absolute;
      background-color: transparent;
      transition: all 0.3s ease-out;
      pointer-events: none;
      inset: 0;
      z-index: 5;
    }

    &:hover {
      &::before {
        background-color: rgba(20, 22, 26, 0.3);
      }
    }

    @media (max-width: 991px) {
      border-radius: 0.4rem;
    }
  }
}

.owl-carousel.owl-loaded {
  display: flex;
  flex-direction: column;
}

.functional-component-description {
  ul {
    line-height: 1.4;

    li {
      font-size: 1.4rem;
      margin-bottom: 1.6rem;
      color: #676e79;

      &::before {
        content: "\2a";
        font-family: lnclines;
        margin-right: 1.2rem;
        position: relative;
        top: 2px;
      }
    }
  }

  > h5 {
    @media (max-width: 991px) {
      display: none !important;
    }
  }
}

.active-functional-component {
  .functional-component-content {
    display: flex;
    gap: 3.2rem;
  }

  .functional-component-description {
    width: 100%;
    max-width: 36.8rem;
    /* @media (min-width: 992px) {
      width: 40%;
    } */
  }

  .functional-component-slider {
    height: fit-content;
    position: relative;

    @media (min-width: 992px) {
      width: 60%;
    }
  }
}

.active-functional-component,
.functional-component-description {
  h5 {
    display: inline-block;
    font-size: 1.4rem;
    font-family: "Nunito-SemiBold";
    border-radius: 1.5rem;
    padding: 0.4rem 1.2rem;
    margin-bottom: 1.6rem;
  }

  .school-management {
    h5 {
      color: #00538f;
      background-color: #e5f2ff;
    }

    li {
      &::before {
        color: #00537a;
      }
    }
  }

  .school-administration {
    h5 {
      color: #006170;
      background-color: #dcf4f9;
    }

    li {
      &::before {
        color: #006170;
      }
    }
  }

  .human-resources {
    h5 {
      color: #be123c;
      background-color: #ffe4e6;
    }

    li {
      &::before {
        color: #be123c;
      }
    }
  }

  .fees {
    h5 {
      color: #6d28d9;
      background-color: #ddd6fe;
    }

    li {
      &::before {
        color: #6d28d9;
      }
    }
  }

  .admission {
    h5 {
      color: #b45309;
      background-color: #fde68a;
    }

    li {
      &::before {
        color: #b45309;
      }
    }
  }

  .timetable {
    h5 {
      color: #047857;
      background-color: #d1fae5;
    }

    li {
      &::before {
        color: #047857;
      }
    }
  }

  .automatic-timetable-generator {
    h5 {
      color: #952f76;
      background-color: #fae1f2;
    }

    li {
      &::before {
        color: #952f76;
      }
    }
  }

  .reports {
    h5 {
      color: #0a6b98;
      background-color: #cfe8f4;
    }

    li {
      &::before {
        color: #0a6b98;
      }
    }
  }
}

.screenshot-slider {
  /* border-radius: 1.6rem 0 0 1.6rem;
  overflow: hidden; */
  img {
    object-fit: contain;
    /* width: 100%; */
  }
}

/* image modal */

.image-modal {
  position: fixed;
  inset: 50px;
  z-index: 9999;
  isolation: isolate;
  display: flex;
  justify-content: center;
  align-items: center;

  @media (max-width: 991px) {
    inset: 0;
  }

  &::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: -1;
    background-color: rgba(0, 12, 22, 0.5);
    backdrop-filter: blur(20px);
  }

  .current-image {
    width: 100%;
    height: 100%;
    user-select: none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1.5rem;
    max-height: 85vh;
    position: relative;
  }

  img {
    border-radius: 2rem;
    object-fit: contain;
    display: block;
    max-width: calc(100% - 3rem);
    height: fit-content;
    max-height: 85vh;

    @media (max-width: 991px) {
      max-width: calc(100% - 7.3rem);
    }
  }

  .next-image,
  .prev-image {
    display: flex;
    align-items: center;
    cursor: pointer;
    padding: 6rem 1.9rem;
    user-select: none;
    position: fixed;
    top: 0;
    bottom: 0;

    .lnc {
      display: block;
      font-size: 3rem;
      color: rgba(255, 255, 255, 0.5);

      @media (max-width: 991px) {
        height: 100%;
      }
    }

    @media (max-width: 991px) {
      padding: 0.5rem;
      top: unset;
      bottom: unset;
    }

    &:hover {
      .lnc {
        color: white;
      }
    }
  }

  .next-image {
    right: 0;
  }

  .prev-image {
    left: 0;
  }

  .image-close {
    color: rgba(255, 255, 255, 0.5);
    position: fixed;
    bottom: 2rem;
    font-size: 3rem;
    z-index: 2;
    cursor: pointer;
    max-height: 2.4rem;

    &:hover {
      color: white;
    }
  }

  &.modal-out {
    .current-image {
      img {
        animation: imageOut 0.4s ease-in forwards;
      }
    }

    &::after {
      animation: blurOut 0.4s linear 0.4s forwards;
    }
  }
}

@keyframes imageOut {
  from {
    max-height: 85vh;
    transform: translate(0, 0);
  }

  to {
    max-height: 0vh;
    transform: translate(50vw, -68vh);
  }
}

@keyframes blurOut {
  from {
    backdrop-filter: blur(20px);
    background-color: rgba(0, 12, 22, 0.5);
  }

  to {
    backdrop-filter: blur(0);
    background-color: rgba(0, 12, 22, 0);
  }
}

.gradient {
  background: url("../images/gradients.svg"), #ffffff;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
}

.customize-eduis {
  padding-block: 8rem;

  h2 {
    color: white;
    text-align: center;
    font-size: 2.4rem;
    max-width: 50.5rem;
    line-height: 1.5;
  }
}

.center-content {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
}

.lekki-review {
  position: relative;

  h5 {
    text-align: center;
    margin-inline: auto;
    font-size: 1.8rem;
    max-width: 53rem;
    margin-bottom: 3.2rem;
  }

  .testimonial {
    max-width: 68.8rem;
  }

  .section-container {
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
  }

  .sphere,
  .donut {
    position: absolute;

    @media (max-width: 991px) {
      display: none;
    }
  }

  .sphere {
    width: 7.7rem;
    aspect-ration: 1;
    left: 6vw;
    top: -3.85rem;
  }

  .donut {
    top: 45%;
    right: 4vw;
  }
}

.tech-specs {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.6rem;

  @media (max-width: 991px) {
    grid-template-columns: 1fr 1fr;
  }

  @media (max-width: 768px) {
    grid-template-columns: 1fr;
  }
}

.spec-item {
  background-color: rgba(255, 255, 255, 0.9);
  border-radius: 0.8rem;
  padding: 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 1.2rem;

  h5 {
    font-family: "Nunito-SemiBold";
    color: #363c45;
    font-size: 1.8rem;
  }

  p {
    font-size: 1.4rem;
    line-height: 1.4;
  }

  .img-box {
    width: 3.6rem;
    height: 3.6rem;
    border-radius: 0.6rem;
    background-color: #e5f2ff;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;

    img {
      height: 2rem;
      width: 2rem;
      display: block;
      position: relative;
    }
  }

  .lnc {
    font-size: 2rem;
    padding: 0.8rem;
    display: block;
    width: 3.6rem;
    height: 3.6rem;
    flex-shrink: 0;
    border-radius: 0.6rem;
  }

  &.saas,
  &.moodle {
    .lnc {
      color: #2691d9;
      background-color: #e5f2ff;
    }
  }

  &.security-spec,
  &.ef-management {
    .lnc {
      color: #009ea8;
      background-color: #dcf4f9;
    }
  }

  &.affordability,
  &.multimedia {
    .lnc {
      color: #be123c;
      background-color: #ffe4e6;
    }
  }

  &.availability,
  &.course-management {
    .lnc {
      color: #8b5cf6;
      background-color: #ede9fe;
    }
  }

  &.customization,
  &.tracking {
    .lnc {
      color: #c95ca8;
      background-color: #fae1f2;
    }
  }

  &.training-support {
    .lnc {
      color: #3798c6;
      background-color: #cfe8f4;
    }
  }

  &.easy-use {
    .lnc {
      color: #10b981;
      background-color: #d1fae5;
    }
  }
  &.scalability {
    .lnc {
      color: #f59e0b;
      background-color: #fef3c7;
    }
  }

  @media (min-width: 992px) {
    min-height: 34.4rem;
  }
}

.tech-section {
  background-image: url("../images/wave-line.svg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  position: relative;

  + section {
    .section-container {
      padding-top: 0;
    }
  }

  @media (max-width: 991px) {
    background-image: unset;
  }

  .bck-object {
    position: absolute;
    top: -20%;
    left: 0;
    z-index: -1;

    @media (max-width: 991px) {
      display: none;
    }
  }
}

.integration-section {
  background-image: url("../images/e-line.svg");
  background-repeat: no-repeat;
  background-position: 50% 350px;
  background-size: contain;

  .tech-specs {
    grid-template-columns: repeat(3, 1fr);

    @media (max-width: 991px) {
      grid-template-columns: 1fr 1fr;
    }

    @media (max-width: 768px) {
      grid-template-columns: 1fr;
    }
  }

  @media (max-width: 991px) {
    background-image: unset;
  }

  .spec-item {
    min-height: unset;
  }
}

.personalized-demo-section {
  background-color: white;
}

.personalized-demo-text {
  width: 100%;
  max-width: 44.9rem;
  h2 {
    margin: 0;
    margin-bottom: 3.2rem;
  }

  p {
    margin-bottom: 3.2rem;
  }
}

.personalized-demo-img {
  position: relative;
  height: 100%;

  img {
    /* @media (max-width 1200) {
      left: -12px;
    } */
    @media (min-width: 992px) {
      position: absolute;
      width: 77%;
      height: 250%;
      object-fit: contain;
      top: -160px;
      left: -68px;
    }

    @media (max-width: 991px) {
      max-width: 90vw;
    }
  }
}

.heading {
  padding-top: 14rem;
  font-size: 3.6rem;
  text-align: center;
  font-family: "Nunito-Bold";
}

.tabs-section {
  .section-container {
    padding-bottom: 0;

    &:first-child {
      padding-top: 5rem;
    }
  }
}

.scroll-patch {
  display: none;
  height: 3.5rem;
}

.tab-navigation {
  display: flex;
  justify-content: center;
  left: 0;
  right: 0;
  top: 0;
  transition: all 0.3s ease-out;

  &.fixed {
    position: fixed;
    top: 9rem;
    z-index: 10;

    + .scroll-patch {
      display: block;
    }
  }
}

.tab-container {
  display: flex;
  gap: 0.4rem;
  box-shadow: 0px 1px 3px 0px rgba(0, 0, 0, 0.102);
  border-radius: 2.5rem;
  padding: 0.4rem;
  position: relative;
  align-items: center;
  background-color: white;

  &::before {
    content: "";
    position: absolute;
    background-color: #7b185d;
    width: calc(33.33% - 0.4rem);
    height: calc(100% - 0.8rem);
    border-radius: 2.5rem;
    z-index: 1;
    transition: all 0.3s ease-out;
  }

  .tab-item {
    font-size: 1.4rem;
    color: #7b185d;
    padding: 0.65rem 0.8rem;
    position: relative;
    z-index: 2;
    width: 9.45rem;
    text-align: center;
    white-space: nowrap;
    display: flex;
    justify-content: center;

    &.active {
      color: white;
    }
  }

  &:has(.active:nth-child(1)) {
    &::before {
      left: 0.4rem;
    }
  }

  &:has(.active:nth-child(2)) {
    &::before {
      left: 33.33%;
    }
  }

  &:has(.active:nth-child(3)) {
    &::before {
      left: 66.66%;
    }
  }
}

html[lang="bs-Latn-BA"] {
  .tab-container {
    .tab-item {
      width: 11.45rem;
    }
  }
}

html[lang="sr-Cyrl"] {
  .tab-container {
    .tab-item {
      width: 12.45rem;
    }
  }
}

.tab-content {
  padding: 5.6rem 3.2rem 3.2rem 3.2rem;
  border-radius: 2.4rem;

  .tab-pill {
    color: #7b185d;
    background-color: rgba(123, 24, 93, 0.071);
    display: inline-block;
    width: fit-content;
    font-size: 1.4rem;
    padding: 0.4rem 0.9rem;
    border-radius: 2.5rem;
    margin-bottom: 1.6rem;
  }

  h2 {
    font-size: 2.4rem;
    color: #363c45;
    margin: 0;
    margin-bottom: 3.2rem;
  }

  @media (max-width: 991px) {
    padding: 5.6rem 2.4rem 2.4rem 2.4rem;
  }

  &:not(:last-child) {
    margin-bottom: 3.2rem;
  }
}

.tab-row {
  display: flex;
  justify-content: space-between;
  gap: 2rem;

  @media (max-width: 991px) {
    flex-direction: column;
    gap: 2rem;
  }
}

.tab-column-text {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  max-width: 45rem;

  h2 {
    font-family: "Nunito-bold";
  }

  > p {
    margin-bottom: 3.2rem;
  }

  ul {
    font-size: 1.4rem;
    line-height: 1.4;
    margin-bottom: 2.5rem;

    li {
      font-size: 1.4rem;

      color: #676e79;

      &::before {
        content: "\2a";
        font-family: lnclines;
        margin-right: 1.2rem;
        color: #00537a;
        position: relative;
        top: 2px;
      }

      &:not(:last-child) {
        margin-bottom: 1.6rem;
      }
    }
  }
}

.tab-column-img {
  width: 100%;
  max-width: 48rem;
  display: flex;
  justify-content: center;
  flex-direction: column;
  > img {
    width: 100%;
    max-height: 30rem;
    object-fit: contain;
  }

  @media (max-width: 991px) {
    order: 1;
  }
}

.tab-column-text,
.tab-column-img {
  @media (max-width: 991px) {
    width: 100%;
  }
}

.login-container {
  background-color: white;
  padding: 2.4rem;
  box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.102);
  border-radius: 1.6rem;

  hr {
    width: 100;
    border: 0;
    border-bottom: 1px solid #dddfe4;
    margin-block: 3.2rem;
  }

  h4 {
    color: #363c45;
    font-size: 1.8rem;
    margin-bottom: 2.4rem;
  }

  p {
    margin-bottom: 2.8rem;
  }

  h5 {
    margin-inline: auto;
    display: block;
    width: fit-content;
    font-size: 1.8rem;
    font-family: "Nunito-SemiBold";
    margin-bottom: 2.8rem;
  }

  a {
    margin-inline: auto;
  }

  .button-primary {
    margin-bottom: 2.4rem;
    width: 100%;
    justify-content: center;
  }

  .btn-group {
    gap: 1.6rem;

    .button {
      flex-basis: 50%;
      justify-content: center;
      padding: 0.8rem 1.2rem;
    }

    @media (max-width: 768px) {
      flex-direction: row;
    }
  }

  .btn-group-benefits {
    display: flex;
    gap: 1.6rem;
    @media (max-width: 450px) {
      flex-direction: column;
    }

    .button {
      display: flex;
      justify-content: center;
      margin-inline: unset;
      width: 100%;
    }
  }

  .app-group {
    margin-bottom: 2.4rem;
    justify-content: flex-start;
    gap: 1.6rem;

    img {
      max-height: 3.9rem;
    }

    .button {
      flex-basis: unset;
    }
  }
}

.btn-group {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 2.4rem;

  a {
    margin: unset;
  }

  @media (max-width: 768px) {
    flex-direction: column;
  }
}

.benefits-wave-line {
  position: absolute;
  top: 80vh;
  z-index: -1;
  width: 100%;
  transform: rotate(48deg);

  @media (max-width: 991px) {
    display: none;
  }
}

.benefits-e-line {
  position: absolute;
  top: 190vh;
  z-index: -1;
  width: 50%;
  left: 0;

  @media (max-width: 991px) {
    display: none;
  }
}

.image-60 {
  width: 60%;
}

.eduis-container {
  padding: 3.2rem;
  border-radius: 2.4rem;

  &:not(:last-child) {
    margin-bottom: 3.2rem;
  }

  .button {
    margin-inline: auto;
    text-align: center;
    margin-top: 3.2rem;
  }

  @media (max-width: 991px) {
    padding: 2.4rem;
  }

  p,
  h2,
  li,
  h5,
  strong {
    color: #363c45;
  }

  h2 {
    font-size: 2.4rem;
    max-width: 51.8rem;
    margin-inline: auto;
    font-family: "Nunito-Bold";

    + h5 {
      color: #363c45;
      margin-bottom: 3.2rem;
      text-align: center;
    }
  }

  > p {
    max-width: 56.8rem;
    margin-inline: auto;

    strong {
      color: #00537a;
    }
  }

  h5 {
    font-size: 1.8rem;
    font-family: "Nunito-SemiBold";
  }

  > p,
  > h2 {
    text-align: center;
    margin-bottom: 3.2rem;
  }

  .eduis-inner-container {
    background-color: #ffffff40;
    padding: 3.2rem;
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-radius: 1.6rem;

    @media (max-width: 991px) {
      padding: 2.4rem;
    }

    .pill-white {
      margin-top: 2.4rem;
    }

    ~ h5 {
      margin-top: 3.2rem;
      font-family: "Nunito-SemiBold";
      font-size: 1.8rem;
      max-width: 72rem;
      margin-inline: auto;
      text-align: center;
    }
  }

  ul {
    line-height: 1.4;

    li {
      font-size: 1.4rem;
      margin-bottom: 1.6rem;
      position: relative;
      padding-left: 2.5rem;

      &::before {
        content: "\2a";
        font-family: lnclines;
        margin-right: 1.2rem;
        position: absolute;
        left: 0;
        color: inherit;
        /* color: #7b185d; */
        color: #00537a;
        font-size: 1.4rem;
        font-weight: 600;
      }
    }
  }

  &.eduis-blue {
    background-color: #e5f2ff;
    border: 1px solid #badfff;
  }

  &.eduis-green {
    background-color: #d1fae5;
    border: 1px solid #a7f3d0;
  }

  &.eduis-red {
    background-color: #ffe4e6;
    border: 1px solid #fecdd3;
  }

  &.eduis-purple {
    background-color: #ede9fe;
    border: 1px solid #ddd6fe;
  }

  &.eduis-primary {
    background: linear-gradient(
      0deg,
      #3f0e30 0%,
      #471036 24%,
      #5d1646 61%,
      #7b1f5d 100%
    );
    border-radius: 2.4rem;

    > h2 {
      color: white;
    }

    p,
    li,
    h5,
    strong {
      color: #dacad5;
    }
  }
}

.eduis-steps-container {
  margin-top: 3.2rem;

  h5 {
    font-family: "Nunito-SemiBold";
    font-size: 1.8rem;
    max-width: 72rem;
    margin-inline: auto;
    text-align: center;
    margin-bottom: 3.2rem;
  }
}

.eduis-inner-row {
  display: flex;
  gap: 5.2rem;

  @media (max-width: 991px) {
    flex-direction: column;
  }

  .eduis-inner-column {
    display: flex;
    flex-direction: column;
    gap: 1.6rem;
    flex-basis: 100%;

    &.image-last {
      @media (max-width: 992px) {
        order: 1;
      }
    }
  }

  &:not(:last-child) {
    margin-bottom: 3.2rem;
  }

  img {
    border-radius: 1.6rem;
    width: 100%;
  }
}

.who-we-are-text {
  font-family: "Nunito-Regular";
  font-size: 1.6rem;
  line-height: 1.95rem;
}

.pill-white {
  color: #7b185d;
  background-color: white;
  display: inline-block;
  font-size: 1.4rem;
  padding: 0.6rem 0.9rem;
  border-radius: 2.5rem;
  margin-bottom: 1.6rem;
  font-family: "Nunito-SemiBold";
  width: fit-content;
}

.slider-title {
  font-family: "Nunito-Bold";
  font-size: 2.4rem;
  font-weight: 700;
  color: #363c45;
  text-align: center;

  /* @media (max-width: 991px) {
    font-size: 2.4rem;
    line-height: 1.4;
  } */
}

.ordered-steps {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 2.2rem;
  counter-reset: section;

  li {
    list-style: none;
    padding-left: 4.5rem !important;
    position: relative;

    &::before {
      content: "" !important;
      counter-increment: section;
      content: counter(section) "." !important;
      font-family: "Nunito-SemiBold" !important;
      top: -0.7rem;
      border-radius: 50%;
      background-color: rgba(123, 24, 93, 0.15);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 3.2rem;
      height: 3.2rem;
      font-size: 1.8rem;
    }

    strong {
      margin-right: 0.3rem;
    }
  }
}

.partnership-section,
.plan-section {
  .section-container {
    padding-bottom: 0;
  }
}
.plans-page {
  overflow: visible;
}
.plan-section {
  margin-top: -24rem;
  position: relative;
  z-index: 1;
  padding-top: 0;
}

.plan-title {
  width: 100%;
  max-width: 68.9rem;
}

.plans {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.6rem;
  margin-bottom: 4.6rem;

  @media (max-width: 991px) {
    grid-template-columns: repeat(2, 1fr);
  }

  @media (max-width: 768px) {
    grid-template-columns: 1fr;
  }
}

.plan {
  display: flex;
  flex-direction: column;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.102);
  border-radius: 2.4rem;
  padding: 2.4rem;
  background-color: white;

  .plan-pill {
    margin-bottom: 1.6rem;
  }

  p {
    margin-bottom: 3.2rem;
  }

  .button {
    margin-top: auto;
    width: 100%;
    box-shadow: unset;
    display: flex;
    justify-content: center;
    gap: 1rem;
    color: #cc3366;
  }

  &:last-child {
    background: linear-gradient(
      0deg,
      #3f0e30 0%,
      #471036 24%,
      #5d1646 61%,
      #7b1f5d 100%
    );

    .plan-pill {
      background-color: white;
    }

    p,
    .button-primary {
      color: white;
    }

    .button-primary {
      box-shadow: 6px 4px 20px 2px rgba(122, 24, 93, 0.3),
        inset 2px -3px 6px rgba(0, 0, 0, 0.25),
        inset -6px 4px 4px rgba(255, 255, 255, 0.25);
    }
  }
}

.top-banner-plan {
  padding-block: 8rem;

  .top-banner-content {
    padding-top: 0;
  }
}

.plan-pill {
  font-size: 1.4rem;
  padding: 0.6rem 0.8rem;
  border-radius: 2.5rem;
  background-color: rgba(123, 24, 93, 0.071);
  display: block;
  width: fit-content;
  color: #7b185d;
}

.plan-compare-header,
.plan-feature,
.plans-compare-footer {
  display: grid;
  grid-template-columns: 3fr 1fr 1fr 1fr 1fr;

  @media (max-width: 991px) {
    grid-template-columns: 1fr;
  }

  .feature-name,
  .feature-option {
    @media (min-width: 992px) {
      width: 100%;
      border-right: 1px solid #dddfe4;
      border-bottom: 1px solid #dddfe4;

      p {
        padding-left: 0.75rem;
      }
    }
  }

  .feature-name {
    display: flex;
    align-items: center;

    @media (min-width: 992px) {
      border-left: 1px solid #dddfe4;
    }
  }

  .feature-option {
    display: flex;
    justify-items: center;
    align-items: center;
    height: 5.5rem;

    @media (max-width: 991px) {
      background-color: white;
    }
  }

  p {
    font-family: "Nunito-Bold";
    color: #363c45;
  }
}

.plan-compare-header {
  position: sticky;
  top: 70px;
  z-index: 2;
  background: #f5f5f5;

  @media (max-width: 1200px) {
    top: 76px;
  }
}

.plan-compare-header,
.plans-compare-footer {
  .feature-name,
  .feature-option {
    @media (min-width: 992px) {
      border-top: 1px solid #dddfe4;
    }
  }

  .plan-pill {
    margin-inline: 0.75rem;
    width: 100%;
    text-align: center;
  }

  &.fixed {
    + .plan-compare-body {
      margin-top: 5.5rem;
    }
  }

  .feature-name {
    p {
      color: #7b185d;

      @media (max-width: 991px) {
        display: none;
      }
    }
  }

  @media (min-width: 992px) {
    box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.102);
  }
}

.plans-compare-footer {
  @media (min-width: 992px) {
    box-shadow: unset;

    .feature-name {
      border-bottom-color: transparent;
      border-left-color: transparent;
    }

    .feature-option,
    .feature-name {
      border-top-color: transparent;
    }
  }

  .plan-pill {
    background-color: transparent;
    cursor: pointer;
  }

  .feature-option,
  .feature-name {
    .plan-pill {
      padding: 8px 5px;
      color: #cc3366;
      font-family: "Nunito-Bold";
      font-size: 1.3rem;

      &.pill-primary {
        @media (min-width: 992px) {
          background-color: #ed5e6a;
          color: #fff;
          box-shadow: 6px 4px 20px 2px rgba(122, 24, 93, 0.3),
            inset 2px -3px 6px rgba(0, 0, 0, 0.25),
            inset -6px 4px 4px rgba(255, 255, 255, 0.25);
        }
      }

      @media (max-width: 991px) {
        width: 50%;
      }
    }
  }
}

html[lang="bs-Latn-BA"] {
  .plans-compare-footer {
    .plan-pill {
      font-size: 13px;
    }
  }
}

html[lang="sr-Cyrl"] {
  .plans-compare-footer {
    .plan-pill {
      font-size: 12px;
    }
  }
}

.plan-compare-header,
.plans-compare-footer,
.plan-compare-body {
  @media (min-width: 992px) {
    .eduis-pro {
      border-right-color: #7b185d;
    }
    .eduis-custom {
      border-right-color: #7b185d;
    }
  }
}

.plan-compare-header {
  @media (min-width: 992px) {
    .eduis-custom {
      border-top-color: #7b185d;

      .plan-pill {
        background-color: #7b185d;
        color: white;
      }
    }
  }

  @media (max-width: 991px) {
    display: none;
  }
}

.plan-compare-body {
  @media (min-width: 992px) {
    background-color: white;
  }

  .plan-feature {
    @media (min-width: 992px) {
      &:nth-child(even) {
        background-color: #f3f4f6;
      }
    }
  }
}

.plans-compare-footer,
.plan-feature {
  @media (max-width: 991px) {
    margin-bottom: 3.2rem;

    .feature-name {
      margin-bottom: 1.6rem;
    }

    .feature-option {
      padding-inline: 1.6rem;

      &::before {
        content: attr(data-plan);
        font-size: 1.4rem;
        width: 50%;
        font-family: "Nunito-Bold";
        color: #676e79;
      }

      .lnc {
        text-align: left;
        width: 50%;
      }
    }
  }
}

.plans-compare-footer {
  @media (min-width: 992px) {
    .eduis-custom {
      border-bottom-color: red !important;
    }

    .feature-name {
      color: #f3f4f6;
    }
  }

  @media (max-width: 991px) {
    .feature-name {
      font-family: "Nunito-Bold";
      color: #363c45;
      font-size: 1.6rem;
    }
  }
}

.plan-feature {
  .feature-option {
    .lnc {
      color: #00537a;
      font-size: 1.6rem;
      width: 100%;
      text-align: center;
    }
  }
}

.earth-rotate {
  position: absolute;
  width: 70%;
  top: 50%;
  right: -7%;
  aspect-ratio: 1;
  display: block;
  animation: earth 105s linear infinite;
  pointer-events: none;

  @media (max-width: 991px) {
    width: 70%;
    top: 68%;
    right: -7%;
  }
  @media (max-width: 650px) {
    width: 85%;
    top: 74%;
    right: -7%;
  }
  @media (max-width: 500px) {
    width: 85%;
    top: 87%;
    right: -7%;
  }
}

.earth-glow {
  width: 18.8rem;
  height: 18.8rem;
  position: absolute;
  bottom: -7rem;
  right: 30%;
  background: radial-gradient(rgb(255 255 255 / 86%), rgb(255 255 255 / 0%));
  border-radius: 50%;
  z-index: 5;
  filter: blur(28px);
  pointer-events: none;

  @media (max-width: 991px) {
    display: none;
  }
}

@keyframes earth {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

.plan-heading {
  font-size: 2.4rem;
  max-width: 68.7rem;
  font-family: "Nunito-Bold";
  margin-inline: auto;
  text-align: center;
}

.compact-banner {
  padding: 16rem 1.5rem 3.2rem 1.5rem;

  @media (max-width: 991px) {
    padding: 12rem 1.5rem 0rem 1.5rem !important;
    + section {
      .section-container {
        padding-top: 0 !important;
      }
    }
  }
}

.thank-you {
  margin-top: 20rem;

  .section-container {
    border-radius: 2.4rem;
    border: 2px solid white;
    overflow: hidden;
  }
}

.thank-you-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 2.9rem;

  h1 {
    font-size: 2.4rem;
    max-width: 64.9rem;
    font-family: "Nunito-Bold";
    margin-inline: auto;
    text-align: center;
  }

  .lnc {
    font-size: 4.2rem;
    color: #10b981;
  }
}

.other-text {
  position: relative;

  &:not(.hidden) {
    &::before {
      content: "\e015";
      position: absolute;
      font-family: lnclines;
      top: 8px;
      left: calc(50% - 0.8rem);
      font-size: 1.6rem;
    }
  }
}

.center {
  margin-inline: auto;
  text-align: center;
}

.resources-section {
  h1 {
    font-size: 3.6rem;
    margin-bottom: 3.2rem;
    margin-top: 5rem;
  }
}

.blog {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.6rem;

  @media (max-width: 991px) {
    grid-template-columns: 1fr 1fr;
  }

  @media (max-width: 768px) {
    grid-template-columns: 1fr;
  }
}

.post {
  border-radius: 2.4rem;
  overflow: hidden;
  background-color: #ffffff;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.102);
  display: flex;
  flex-direction: column;

  .post-body {
    padding: 2.4rem;
    display: flex;
    flex-direction: column;
    flex-grow: 1;

    .post-title {
      color: #363c45;
      font-size: 2.1rem;
      margin-bottom: 0.8rem;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .post-excerpt {
      color: #676e79;
      margin-bottom: 4.8rem;
    }

    .post-meta {
      margin-top: auto;

      .post-link {
        color: #cc3366;
        font-size: 1.4rem;
        font-family: "Nunito-Bold";
      }
    }
  }

  .post-category {
    margin-bottom: 0.8rem;
  }

  .post-image {
    aspect-ratio: 16/9;
    overflow: hidden;

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center;
    }
  }
}

.post-text {
  p {
    &:not(:last-child) {
      margin-bottom: 1.6rem;
    }
  }
}

.post-category {
  display: block;
  font-size: 1.4rem;
  font-family: "Nunito-SemiBold";
  color: #7b185d;
  border-radius: 1.5rem;
  padding: 0.6rem 0.8rem;
  background-color: rgba(123, 24, 93, 0.07);
  width: fit-content;

  &:empty {
    display: none;
  }
}

.resources-row {
  display: flex;
  gap: 10.4rem;

  .content-column {
    width: 60%;
  }

  .form-column {
    width: 40%;
  }

  @media (max-width: 991px) {
    flex-direction: column;
    gap: 2.4rem;

    .content-column,
    .form-column {
      width: 100%;
    }
  }
}

.resource-data {
  gap: 2.4rem;
  display: flex;
  flex-direction: column;

  h1 {
    font-size: 2.4rem;
  }
}

.img-container {
  border-radius: 1.6rem;
  overflow: hidden;

  img {
    width: 100%;
    object-fit: contain;
  }
}

.table-contents {
  counter-reset: section;
  background-color: white;
  border: 1px solid rgba(123, 24, 93, 0.302);
  padding: 2.4rem;
  border-radius: 2.4rem;
  display: none;

  &:has(strong, ul, p) {
    display: block;
  }

  h3 {
    font-size: 2.1rem;
    font-family: "Nunito-Bold";
    margin-bottom: 2.4rem;
  }

  li,
  strong {
    color: #676e79;
  }

  ul {
    list-style-type: disc;
    margin-left: 2.6rem;

    &:has(+ p, + strong) {
      margin-bottom: 3.5rem;
    }

    li {
      margin-bottom: 1.6rem;
    }
  }

  p {
    font-size: 1.6rem;
    margin-bottom: 1.8rem;
  }

  strong {
    display: flex;

    &::before {
      counter-increment: section;
      content: counter(section) !important;
      font-family: "Nunito-SemiBold" !important;
      position: relative;
      margin-right: 1rem;
      top: -0.2rem;
      border-radius: 50%;
      background: rgba(123, 24, 93, 0.149);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #7b185d;
      width: 2.4rem;
      height: 2.4rem;
      font-size: 1.6rem;
      line-height: 1;
    }
  }
}

.resource-section {
  margin-top: 6rem;
}

#loader {
  display: flex;
  width: 100%;
  justify-content: center;

  svg {
    max-width: 10rem;
  }
}

.download-box {
  padding: 3.2rem;
  background-color: white;
  max-width: 35.2rem;
  box-shadow: 0px 10px 15px -3px rgba(0, 0, 0, 0.1);
  border-radius: 1.6rem;

  .button {
    width: 100%;
    justify-content: center;
  }
}

.download-message {
  font-size: 1.8rem;
  text-align: center;
  margin-bottom: 2.4rem;
  color: #676e79;
}

.section-404 {
  margin-top: 5rem;

  h1 {
    font-size: 3.6rem;
    font-family: "Nunito-black";
  }
}

.error-content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3.2rem;

  img {
    max-width: calc(100% - 3rem);
  }
}

.testimonial-section {
  position: relative;
  z-index: 2;
}

.big-text {
  font-size: 2rem !important;
}

/********** QUIZ **********/

.start-screen {
  /* height: calc(100vh - 30.9rem); */
  background: linear-gradient(
    0deg,
    #3f0e30 0%,
    #471036 24%,
    #5d1646 61%,
    #7b1f5d 100%
  );
  margin-bottom: 8rem;
  .section-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3.2rem;
    width: 100%;
    max-width: 68.8rem;
    .start-screen-heading {
      font-family: "Nunito-Black";
      font-size: 3.6rem;
      font-weight: 900 !important;
      line-height: 4rem;
      padding-top: 14rem;
      color: #ffffff;
      text-align: center;

      @media (max-width: 992px) {
        padding-top: 8rem;
      }
    }

    .subheading {
      font-size: 2.4rem;
      font-weight: 400;
      line-height: 3.274rem;
      color: #ffffff;
      margin: unset;
      text-align: center;
    }
    .starting-quiz {
      display: flex;
      align-items: center;
      gap: 1.6rem;

      .starting-quiz-text {
        font-family: "Nunito-Light";
        font-size: 1.6rem;
        line-height: 2.182rem;
        color: #ffffff;

        span {
          font-family: "Nunito-Bold";
        }
      }
    }
    .text {
      font-family: "Nunito-Light";
      font-size: 1.6rem;
      line-height: 2.182rem;
      color: #ffffff;
    }
  }
}
.quiz-page {
  /* overflow: hidden; */
  .quiz {
    background: linear-gradient(
      0deg,
      #3f0e30 0%,
      #471036 24%,
      #5d1646 61%,
      #7b1f5d 100%
    );
    margin-bottom: 8rem;
    .section-container {
      display: flex;
      justify-content: center;
      padding: 16rem 0 8rem 0;
      position: relative;

      .quiz-carousel-wrapper {
        width: 100%;
        max-width: 820px;
        /* overflow: hidden; */
        position: relative;

        .quiz-carousel {
          display: flex;
          transition: transform 0.5s ease-in-out;
          gap: 100vw;

          .quiz-container {
            display: flex;
            flex-direction: column;
            gap: 3.2rem;
            flex: 0 0 100%;
            height: 100%;
            box-sizing: border-box;
            padding: 0 1rem;

            .question-number {
              width: fit-content;
              background-color: #ffffff26;
              color: #ffffff;
              font-size: 1.4rem;
              font-weight: 600;
              padding: 6px 8px;
              border-radius: 99px;
            }
            .quiz-question {
              font-size: 2.4rem;
              font-weight: 700;

              color: #ffffff;
            }

            .quiz-answers {
              display: flex;
              flex-direction: column;
              gap: 1.6rem;

              input[type="radio"] {
                display: none;
              }
              input[type="checkbox"] {
                display: none;
              }

              .custom-radio {
                display: flex;
                align-items: center;
                padding: 0.8rem;
                font-size: 16px;
                cursor: pointer;
                text-align: left;
                background: #ffffff1a;
                border: 1px solid #ffffff4d;
                border-radius: 999px;
                color: #fff;

                .radio-mark {
                  flex-shrink: 0;
                  height: 1.6rem;
                  width: 1.6rem;
                  margin-right: 10px;
                  background-color: #ffffff;
                  border-radius: 50%;
                  display: inline-block;
                  position: relative;
                  transition: border-color 0.3s ease, background-color 0.3s ease;

                  input[type="radio"]:checked + & {
                    background-color: #ffffff;
                    border-color: #ffffff;

                    &::after {
                      content: "";
                      width: 12px;
                      height: 12px;
                      background-color: #cc3366;
                      border-radius: 50%;
                      position: absolute;
                      top: 50%;
                      left: 50%;
                      transform: translate(-50%, -50%);
                    }
                  }
                }
              }

              .custom-checkbox {
                display: flex;
                align-items: center;
                padding: 0.8rem;
                font-size: 16px;
                cursor: pointer;
                text-align: left;
                background: #ffffff1a;
                border: 1px solid #ffffff4d;
                border-radius: 4px;
                color: #fff;

                .checkbox-mark {
                  flex-shrink: 0;
                  height: 1.6rem;
                  width: 1.6rem;
                  margin-right: 10px;
                  background-color: #ffffff;
                  border-radius: 2px;
                  display: inline-block;
                  position: relative;
                  transition: border-color 0.3s ease, background-color 0.3s ease;

                  input[type="checkbox"]:checked + & {
                    background-color: #ffffff;
                    border-color: #ffffff;

                    &::after {
                      content: "";
                      width: 5px;
                      height: 10px;
                      border: solid #cc3366;
                      border-width: 0 3px 3px 0;
                      position: absolute;
                      top: 0px;
                      left: 4.4px;
                      transform: rotate(45deg);
                    }
                  }
                }
              }

              .text-box {
                display: flex;
                flex-direction: column;
                gap: 0.8rem;
                width: 100%;
                font-size: 16px;
                cursor: pointer;
                text-align: left;
                /* background: #ffffff1a; */

                border-radius: 999px;
                color: #fff;
              }

              input[type="text"] {
                width: 100%;
                background: #ffffff1a;
                border: 1px solid #ffffff4d;
                border-radius: 999px;
                padding-left: 2rem;
                color: #ffff;

                &::placeholder {
                  color: #a9a9a9;
                  font-size: 1.4rem;
                }
              }
            }
            .quiz-contact-container {
              display: flex;
              flex-direction: column;
              justify-content: center;
              gap: 3.2rem;
              width: 100%;
              max-width: 68.8rem;
              .quiz-contact-text {
                font-size: 2.2rem;
                font-weight: 700;
                line-height: 2.29rem;
                text-align: center;
                color: #ffffff;
              }

              .quiz-contact {
                .contact-form-wrapper {
                  background-color: #ffffff1a;
                  .contact-form {
                    padding: 3.2rem;
                    .contact-form-input {
                      display: flex;
                      flex-direction: column;
                      gap: 1.6rem;
                      .form-filed {
                        input {
                          height: 4.2rem;
                        }
                      }
                    }
                  }

                  label {
                    font-size: 1.4rem;
                    font-weight: 400;
                    line-height: 1.71rem;
                    color: #ffffff;
                    margin-top: unset;
                  }
                }
                & textarea {
                  height: 13.8rem !important;
                  max-width: 100%;
                }
              }
            }
          }
        }
      }

      .controll-buttons {
        display: flex;
        gap: 0.8rem;
        position: absolute;
        bottom: 8rem;
        right: 1rem;
      }
    }
  }
}

.align-center {
  align-items: center;
}
.align-self {
  align-self: center;
}

/* input[type="text"]:-webkit-autofill {
  background-color: transparent !important;
  color: #fff !important;
  -webkit-box-shadow: 0 0 0px 1000px #ffffff1a inset !important;
  box-shadow: 0 0 0px 1000px #ffffff1a inset !important;
  transition: background-color 5000s ease-in-out 0s;
  -webkit-text-fill-color: #fff !important;
} */

/********** FAQ **********/

.faq-page {
  .faq-section {
    .section-container {
      display: flex;
      flex-direction: column;
      align-items: center;

      .faq-heading-container {
        display: flex;
        flex-direction: column;
        align-items: center;
        margin-top: 5rem;
        gap: 1.6rem;
        width: 100%;
        max-width: 54.3rem;
        margin-bottom: 5.6rem;

        .page-name {
          margin-bottom: unset;
        }
        .section-heading {
          font-size: 3.6rem;
          font-weight: 700;
          line-height: 4.7rem;
          text-align: center;
        }
        .section-text {
          font-size: 1.6rem;
          font-weight: 700;
          line-height: 2.18rem;
          color: #00537a;
          text-align: center;
        }
      }
      .faq {
        .faq-item {
          width: 100%;
          margin-bottom: 10px;
          border-radius: 20px;
          box-shadow: 0px 2px 4px -1px rgba(0, 0, 0, 0.06);
          box-shadow: 0px 4px 6px -1px rgba(0, 0, 0, 0.1);

          overflow: hidden;
          .faq-question {
            font-family: "Nunito-Regular";
            width: 100%;
            padding: 1.3rem 2rem;
            text-align: left;
            background: #ffffff;
            border: none;
            font-size: 2.2rem;
            font-weight: 500;
            line-height: 3rem;
            color: #00537a;
            cursor: pointer;
            display: flex;
            justify-content: space-between;
            align-items: center;
            gap: 1.6rem;

            .lnc-minus {
              display: none;
            }
            .lnc-plus {
              display: block;
            }
          }

          .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.5s ease;
            background: #fff;
            padding: 0 15px;

            .faq-answer-text {
              font-size: 1.6rem;
              font-weight: 500;
              color: #00537a;

              b {
                font-size: inherit;
              }

              .faq-link {
                color: var(--p-color);

                &:hover {
                  color: var(--button-color);
                }
              }
            }
          }

          .faq-answer p {
            margin: 15px 0;
          }
        }
        .faq-item.open .faq-answer {
          max-height: 260px;
        }

        .faq-item.open .faq-question .lnc-minus {
          display: block;
        }
        .faq-item.open .faq-question .lnc-plus {
          display: none;
        }
      }
    }
  }
}

/*** UTILITY CLASS ***/
.u-top-banner-position {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  margin-bottom: 8rem;
}
.u-padding-bottom-unset {
  padding-bottom: unset;
}
.u-padding-top-unset {
  padding-top: unset;
}
.u-padding-top-small {
  padding-top: 5.6rem !important;
}

.u-padding-top {
  padding-top: 6.8rem !important;
}
.u-margin-bottom-unset {
  margin-bottom: unset !important;
}

.u-margin-right-small {
  margin-right: 1.6rem;
}

.u-margin-bottom-small {
  margin-bottom: 8rem;
}

.u-justify-content {
  justify-content: flex-end;
}

.u-strong-blue {
  color: #00537a !important;
}

.u-steps-background {
  background-color: rgba(123, 24, 93, 0.15);
}

.u-column-width {
  width: 100% !important;
  max-width: 35.2rem !important;
}

.u-section-container-video {
  margin-left: auto;
  margin-right: auto;
  max-width: 104rem;
  width: 100%;
  /* padding: 0 1.5rem 8rem 1.5rem; */
  padding: 0;
  @media (max-width: 991px) {
    padding: 0rem 1.5rem;
  }
}

.u-max-hight-parents {
  max-height: 23rem !important;
}
.u-max-hight-students {
  max-height: 21rem !important;
}

.full-width {
  width: 100%;
}

/*** SIGN IN DROPDOWN ***/
.sign-in-dropdown {
  display: none;
  position: absolute;
  top: 3.6rem;
  background-color: #ffffff;
  border: 1px solid #dddfe4;
  border-radius: 10px;
  padding: 0.8rem;
  gap: 0.8rem;
  box-shadow: 0px 4px 6px -2px #0000000d;
  box-shadow: 0px 10px 15px -3px #0000001a;

  .sign-in-dropdown-item {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 1.2rem;
    flex-basis: 33.33%;
    padding: 1.2rem;
    background: #00537a0d;
    border: 1px solid #00537a1a;
    border-radius: 8px;

    .drop-down-heading {
      display: flex;
      align-items: center;
      gap: 1.2rem;
      font-size: 1.8rem;

      span {
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 6px;
        width: 36px;
        height: 36px;
        flex-shrink: 0;
        aspect-ratio: 1;
        background-color: rgba(0, 83, 122, 0.2);

        .lnc {
          font-size: 2rem;
          color: #00537a;
        }
      }
    }

    .drop-down-text {
      font-family: Nunito-Regular;
      font-size: 1.4rem;
      font-weight: 400;
    }

    .sign-in-button {
      width: 100%;
    }
  }
}

#has-sing-in-dropdown.hover-active {
  background-color: rgba(0, 83, 122, 0.102); /* Isto kao u &:hover */
}

.quiz-banner-section {
  margin-top: 8rem;
  @media (max-width: 991px) {
    padding: 0rem 1.5rem 0rem 1.5rem;
  }

  .section-container {
    display: flex;
    justify-content: space-between;
    padding: 0 5.6rem;
    background: linear-gradient(
      95.84deg,
      #3f0e30 -96.9%,
      #471036 -57.19%,
      #5d1646 4.03%,
      #7b1f5d 68.57%
    );
    border-radius: 2.4rem;
    @media (max-width: 860px) {
      flex-direction: column;
      align-items: center;
      padding: 5rem 3.2rem 0 3.2rem;
    }

    .section-text-container {
      display: flex;
      align-items: center;
      flex-direction: column;
      justify-content: center;
      width: 100%;

      max-width: 44.4rem;
      gap: 3.2rem;
      @media (max-width: 860px) {
        text-align: center;
      }
      .section-heading {
        font-family: "Nunito-Black";
        font-size: 3.6rem;
        line-height: 4rem;
        color: #ffff;
      }
      .section-text {
        font-family: "Nunito-Regular";
        font-size: 1.6rem;
        line-height: 1.9rem;
        color: #ffffff;
      }
      .button {
        align-self: flex-start;
        @media (max-width: 860px) {
          align-self: center;
        }
      }
    }
    .section-image-contnainer {
      .quiz-banner-section-img {
        width: 100%;
      }
    }
  }
}

.dropdown-list {
  display: none;
  flex-direction: column;
}

.dropdown-holder.open .dropdown-list {
  display: flex !important;
}

.lnc.lnc-down {
  display: inline-block;
  transition: transform 0.3s ease;
}

.dropdown-holder.open .lnc.lnc-down {
  transform: rotate(180deg);
}

.dropdown-holder.open .dropdown-click {
  background-color: rgba(0, 83, 122, 0.102);
}

.lnc-arrow-right-small {
  font-size: 2rem !important;
  opacity: 0;
}

.dropdown-cat {
  background: var(--button-color);
  color: var(--white) !important;
  border-radius: 30px !important;
  padding: 10px 20px;
  box-shadow: 6px 4px 20px 2px rgba(122, 24, 93, 0.3),
    inset 2px -3px 6px rgba(0, 0, 0, 0.25),
    inset -6px 4px 4px rgba(255, 255, 255, 0.25);
  /* display: flex; */
  align-items: center;
  min-height: 38px;
  width: fit-content;
  outline: none;
  cursor: pointer;
  transition: 0.2s linear all;
  &:hover {
    background-color: #ed5e6a !important;
    color: #fff;
    transition: 0.2s linear all;
  }
}

.dropdown-holder.open .dropdown-cat {
  background-color: #ed5e6a !important;
}

.list-note {
  font-size: 12px;
  color: #afafaf;
}

#company_field {
  display: none;
}