@import "https://fonts.googleapis.com/icon?family=Material+Icons";
/* ----- BASIC ANIMATIONS ----- */
.in {
  animation: fadein .5s ease 0s 1 normal forwards; }

.inn {
  animation: fadein .5s ease .5s 1 normal forwards; }

.innn {
  animation: fadein .5s ease 1s 1 normal forwards; }

.innnn {
  animation: fadein .5s ease 1.5s 1 normal forwards; }

@keyframes fadein {
  from {
    transform: translateY(50px);
    opacity: 0; }
  to {
    transform: translateY(0px);
    opacity: 1; } }

.out {
  animation: fadeout .5s ease 0s 1 normal forwards; }

@keyframes fadeout {
  from {
    transform: translateY(0px);
    opacity: 1; }
  to {
    transform: translateY(50px);
    opacity: 0; } }

/* ----- GENERAL ----- */
body, html {
  margin: 0;
  width: 100%;
  height: 100%; }

.container {
  padding: 0% 5% 10% 5%;
  background-color: white; }
  @media only screen and (max-width: 600px) {
    .container {
      /*-S-*/
      padding: 0% 10% 10% 10%; } }
  @media (min-width: 1400px) {
    .container {
      max-width: 1140px; } }
  @media (min-width: 1200px) {
    .container {
      max-width: 1140px; } }
  .container .main-nav {
    position: relative;
    top: 0;
    padding: 2% 0% 5% 0%; }
    @media only screen and (max-width: 600px) {
      .container .main-nav {
        /*-S-*/
        padding-bottom: 15%; } }
    .container .main-nav .container-fluid {
      padding: 0;
      justify-content: flex-end; }
  .container .logo {
    max-width: 20%;
    height: auto;
    margin-bottom: 1%; }
    @media only screen and (max-width: 600px) {
      .container .logo {
        /*-S-*/
        max-width: 50%; } }
    @media only screen and (min-width: 601px) and (max-width: 992px) {
      .container .logo {
        /*-M-*/
        max-width: 40%; } }
    @media only screen and (min-width: 993px) and (max-width: 1200px) {
      .container .logo {
        /*-L-*/
        max-width: 30%; } }
  .container .roadmap .progress {
    --bs-progress-bar-bg: #41a62a; }
  .container .roadmap .points > div {
    text-align: center;
    padding: 1%; }
  .container .alert span {
    vertical-align: middle; }
  .container .card {
    padding: 2%;
    background-color: #f8f8f9;
    border: none; }

.btn-cl {
  background-color: #41a62a;
  color: white;
  font-weight: 600; }

    .btn-cl:hover {
        text-decoration:none;
        color:white;
    }

.nav-link {
  color: #41a62a; }
  .nav-link:focus, .nav-link:hover {
    color: #2d721d; }

.helper-text {
    position: relative;
    min-height: 18px;
    display: block;
    font-size: 12px;
    color: rgba(0,0,0,0.54)
}

/* ----- SCROLLBAR ----- */
::-webkit-scrollbar {
  width: 6px;
  height: 8px;
  border: 0px; }

::-webkit-scrollbar-track:vertical {
  border-radius: 0; }

::-webkit-scrollbar-track:horizontal {
  border-radius: 0;
  background: #e5e8eb; }

::-webkit-scrollbar-thumb:vertical {
  border-radius: 0;
  background: #b0b0b0; }

::-webkit-scrollbar-thumb:horizontal {
  border-radius: 0;
  background: #d6d6d6; }