/* screen - milestone */

.milestone {
  align-items: flex-end;
  background-color: var(--white);
  font-family: 'Montserrat', sans-serif;  /* Set font to Montserrat */
  display: flex;
  flex-direction: column;
  gap: 4245px;
  height: 4508px;
  overflow: hidden;
  width: 1440px;
}

.milestone .overlap-group3 {
  align-items: center;
  background-image: url(../img/white-2-1.png);
  background-position: 50% 50%;
  background-size: cover;
  display: flex;
  flex-direction: column;
  margin-top: -510px;
  min-height: 5952px;
  padding: 510px 0;
  width: 1440px;
}

.milestone .overlap-group4 {
  background-image: url(../img/white-5.png);
  background-size: 100% 100%;
  height: 498px;
  position: relative;
  width: 1440px;
}

.milestone .img_0891-1 {
  height: 498px;
  left: 0;
  object-fit: cover;
  position: absolute;
  top: 0;
  width: 1440px;
}

.milestone .grad-white {
  height: 498px;
  left: 0;
  position: absolute;
  top: 0;
  width: 1440px;
}

.milestone .left {
  height: 236px;
  left: 310px;
  position: absolute;
  top: 148px;
  width: 132px;
}

.milestone .right {
  height: 236px;
  left: 1027px;
  position: absolute;
  top: 148px;
  width: 126px;
}

.milestone .gencys_e-commerce_-s {
  cursor: pointer;
  height: 100px;
  right: 1000px;
  object-fit: contain;
  position: absolute;
  top: 15px;
  width: 500px;
}

.milestone .title {
  height: 236px;
  left: 241px;
  letter-spacing: 0;
  line-height: normal;
  position: absolute;
  text-align: center;
  text-shadow: 0px 4px 4px #00000040;
  top: 147px;
  width: 958px;
}

.milestone .navbar {
  display: flex; /* Use flexbox for the navbar */
  justify-content: flex-end; /* Align items to the right */
  align-items: center; /* Center items vertically */
  padding: 45px; /* Padding for the navbar */
  position: relative;
}


.milestone .nav-item {
    margin-left: 20px; /* Space between nav items */
    border: 5px solid transparent;
}

.milestone .nav-link {
  color: rgb(0, 0, 0); /* Text color */
  padding: 10px; /* Padding for links */
  transition: background-color 0.3s ease; /* Transition for hover effect */
  display: table-cell;
  padding: .5rem 1rem;
  text-decoration: none;
  transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out;
}

.milestone .nav-link:hover {
  background-color: #ffffff; /* Background color on hover */
  border-radius: 5px; /* Rounded corners on hover */
  color: #333333; /* Change text color on hover */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); /* Subtle shadow effect */
  transform: scale(1.05); /* Slight scale-up effect */
}

.milestone .navbar .nav-item.nav-link {
  font-family: 'Montserrat', sans-serif;  /* Set font to Montserrat */
  font-size: 18px;  /* Increase font size */
  font-weight: 600; /* Optional: Set font weight */
  color:rgb(14, 119, 154);
}

.milestone .awards-acknowlegements {
  height: 99px;
  letter-spacing: 0;
  line-height: normal;
  margin-left: 31.0px;
  margin-top: 79px;
  text-align: center;
  width: 985px;
}

.milestone .award-a {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-right: 10.0px;
  margin-top: 137px;
  min-height: 764px;
  width: 1306px;
}

.milestone .every-journey-starts-with-a-small-step {
  height: 80px;
  letter-spacing: 0;
  line-height: normal;
  margin-left: 10.0px;
  text-align: center;
  width: 992px;
}

.milestone .award-container {
  align-items: flex-start;
  display: flex;
  gap: 19px;
  height: 684px;
  margin-right: 2.0px;
  min-width: 1304px;
}

.milestone .award {
  align-items: center;
  display: flex;
  flex-direction: column;
  gap: 22px;
  min-height: 684px;
  width: 422px;
}

.milestone .exec-5-1 {
  height: 295px;
  object-fit: cover;
  width: 302px;
}

.milestone .rectangle-63 {
  background-color: var(--sea-serpent-3);
  border-radius: 50px;
  height: 367px;
  width: 422px;
}

.milestone .award-1 {
  align-items: center;
  display: flex;
  flex-direction: column;
  margin-right: 10.0px;
  margin-top: 66px;
  min-height: 764px;
  width: 1306px;
}

.milestone .the-first-one-hundredth-thousands {
  height: 80px;
  letter-spacing: 0;
  line-height: normal;
  margin-left: 10.0px;
  text-align: center;
  width: 992px;
}

.milestone .the-first-million {
  height: 80px;
  letter-spacing: 0;
  line-height: normal;
  margin-left: 10.0px;
  text-align: center;
  width: 992px;
}

.milestone .overlap-group5 {
  height: 1185px;
  margin-top: 86px;
  position: relative;
  width: 1440px;
}

.milestone .network-flow-backgro {
  height: 696px;
  left: 0;
  position: absolute;
  top: 489px;
  width: 1440px;
}

.milestone .footer-logo {
  align-items: flex-start;
  display: flex;
  height: 187px;
  left: 291px;
  min-width: 860px;
  position: absolute;
  top: 950px;
}

.milestone .valenin {
  align-self: center;
  height: 109px;
  margin-bottom: 33.79px;
  width: 130px;
}

.milestone .overlap-group1 {
  height: 187px;
  margin-left: 31px;
  position: relative;
  width: 489px;
}

.milestone .overlap-group {
  height: 187px;
  left: 0;
  position: absolute;
  top: 0;
  width: 488px;
}

.milestone .gencys {
  height: 115px;
  left: 373px;
  position: absolute;
  top: 14px;
  width: 116px;
}

.milestone .erp {
  height: 124px;
  margin-left: 53px;
  margin-top: 14.01px;
  object-fit: cover;
  width: 156px;
}

.milestone .award-d {
  align-items: center;
  display: flex;
  flex-direction: column;
  left: 62px;
  min-height: 764px;
  position: absolute;
  top: 0;
  width: 1306px;
}

.milestone .project-1-b {
  height: 80px;
  letter-spacing: 0;
  line-height: normal;
  margin-left: 10.0px;
  text-align: center;
  width: 992px;
}

.milestone .text {
  height: 81px;
  margin-right: -207px;
  width: 1147px;
}