body {
    margin: 0;
    font-family: Arial, Helvetica, sans-serif;
background: rgb(0,0,0);
background: linear-gradient(180deg, rgba(0,0,0,1) 5%, rgb(23, 156, 38) 50%, rgba(0,0,0,1) 95%);
padding: 0;
//overflow: hidden;
  }
  .background-video {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  overflow: hidden; /* Ensure the video stays within the viewport */
}

.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  pointer-events: none; /* Dezactivează evenimentele pointer pentru overlay */
}
.background-video video {
  width: 100%; /* Make the video cover the entire container */
  height: auto; /* Allow the height to adjust proportionally */
  position: absolute;
  top: 50%;
  left: 50%;
    transform: scale(5); /* Equivalent to 300% scaling */
    object-fit: cover;
  pointer-events: none; /* Dezactivează evenimentele pointer pentru video */

}

  .content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  text-align: center;
  z-index: 1; /* Ensure content is above the video */
}
.vid-bg{
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
}
  .topnav {
    overflow: hidden;
    background-color: #000;
    position: fixed;
    top: 0;
    width: 40%;
    margin: auto;
  }

  .topnav a {
    float: right;
    display: block;
    color: #f2f2f2;
    text-align: center;
    padding: 20px;
    padding-top: 45px;
    text-decoration: none;
    font-size: 23px;
  }

  .topnav a:hover {
    color: #03913e;
  }

  .topnav a.active {
    background-color: #03913e;
    color: #03913e;
  }

  .topnav .icon {
    display: none;
  }

  @media screen and (max-width: 600px) {
    .topnav a:not(:first-child) {
      display: none;
    }
    .topnav a.icon {
      float: right;
      display: block;
    }
  }

  @media screen and (max-width: 600px) {
    .topnav.responsive {
      position: relative;
    }
    .topnav.responsive .icon {
      position: absolute;
      right: 0;
      top: 0;
    }
    .topnav.responsive a {
      float: none;
      display: block;
      text-align: left;
    }
  }
  footer {
    text-align: center;
    padding: 3px;
   /* background: rgb(0,0,0);
*/
  }
  
  .social {
    font-size: 16px;
    background-color: #000;
  }
  .image {
    text-align: center;
    justify-content: center;
    margin: 0 auto;
  }

  .typing-container {
  font-size: 30px;
  white-space: nowrap;
  overflow: hidden;
  border-right: 2px solid #fff;
  margin-top: 100px !important;
 
}

@keyframes typing {
  from {
      width: 0;
  }
  to {
      width: 100%;
  }
}

@keyframes blink-caret {
  from, to {
      border-color: transparent;
  }
  50% {
      border-color: #fff;
  }
}
.Roadmap{
  //background: rgb(0,0,0);
//background: linear-gradient(180deg, rgba(0,0,0,1) 5%, rgb(23, 156, 38) 50%, rgba(0,0,0,1) 95%);
}
.text::first-letter{
  color:  #38f313;
}
.text1::first-letter{
  color: #38f313;
}
.text2::first-letter{
  color: #38f313;
}
.text3::first-letter{
  color: #38f313;
}
.textconv::first-letter{
  color: #38f313;
}
.textteam::first-letter{
  color: #38f313;
}
.bg-layers {
  -webkit-animation: filter-animation 4s infinite;
  animation: filter-animation 4s infinite;
}

.bg-scale {
  -webkit-animation: filter-animation 8s infinite;
  animation: filter-scale 8s infinite;
}

@-webkit-keyframes filter-animation {
  0% {
    -webkit-filter: hue-rotate(0deg);
  }
  50% {
    -webkit-filter: hue-rotate(45deg);
  }
  
  100% {
    -webkit-filter: hue-rotate(0deg);
  }
}

@keyframes filter-animation {
  0% {
    filter: hue-rotate(0deg);
  }
  50% {
    filter: hue-rotate(45deg);
  }
  100% {
    filter: hue-rotate(0deg);
  }
}

@keyframes filter-scale {
  0% {
    transform:scale(1);
  }
  50% {
    transform:scale(1.4);
  }
  100% {
      transform:scale(.8);
  }
}
.inputs::placeholder{ color: white;}

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

  :root {
      --font-family: 'Inter', sans-serif;
      --font-size: 1rem;
      --bg: white;

  }

  html, body {
      font-family: var(--font-family);
  }

  body {
      background-color: var(--bg);  
  }

  .modal.fade .modal-content {
      opacity: 0;
      visibility: hidden;
      transform: scale(1.1);
  }
  .modal.show .modal-content{
      opacity: 1;
      visibility: visible;
      transform: scale(1);
  }

  .modal-content {
  transform: scale(1.1);
  transition: visibility 0.25s ease-out, opacity 0.25s ease-out,
      transform 0.25s ease-out;
  }

  /** Modal static */

  .modal.modal-static .modal-content {
  transform: scale(1.02);
  }