body {
  opacity: 0; 
  animation: fadeIn 2s ease-in-out forwards; 
  font-family: 'Quicksand', serif;
  overflow-x: hidden;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* Navbar Style */
.navbar-brand img {
  max-height: 40px;
  margin-right: 10px;
}

.navbar-toggler .material-symbols-outlined {
  color: #70aad8 !important;
}

.navbar-nav {
  justify-content: right;
  flex: 1;
}

.nav-link {
  text-align: right;
}

.navbar-nav .nav-item {
  color: #70aad8 !important;
  margin-right: 10px;
}

.navbar {
  justify-content: space-between;
  background-color: #062333 !important;
}
.navbar a {
  color: #70aad8 !important;
}

@media (max-width: 767px) {
  .navbar-nav {
    flex-direction: column;
    align-items: stretch;
  }
}

/* Section Style */
section {
  position: relative;
}

.flex-container {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: center;
  justify-content: center;
}

/* About Style */
.about {
  background-color: #062333;
}

@media (max-width: 767px) {
  .about {
    background-color: #062333;
    min-height: 650px;
  }
}

.banner-image {
  width: 100%;
  padding: 20px;
}

.banner-statement {
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: 2.5em;
}

.banner-statement h3 {
 margin-top: 25px;
 padding: 20px;
}

/* Service Section Styles */
.services {
  color: #062333;
  text-align: center;
  padding: 50px;
}

.service-tile {
  padding: 20px;
  margin: 20px;
}

.services .material-symbols-outlined {
  color: #062333;
  font-size: 120px; 
}

/* Technologies Section Styles */
.technologies {
  min-height: 450px;
  text-align: center;
  color: white;
  background: #062333;
  padding-top: 125px;
}

@media (max-width: 767px) {
  .technologies {
    min-height: 1000px;
    text-align: center;
    color: white;
    background: #062333;
    padding-top: 125px;
  }
}

.tech-image {
  width: 100px;
  height: auto;
  margin: 20px;
}

/* Contact Form Styles */
.contact-form {
  padding: 50px 0;
  min-height: 500px;
}

@media (max-width: 767px) {
  .contact-form {
    min-height: 600px;
  }
}

.contact-text {
  color: #062333;
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-text p{
 padding-left: 5px;
}

.contact-form-wrapper {
  padding: 20px;
}

.contact-form-wrapper input,textarea {
  margin-bottom: 10px;

}

.contact-form-wrapper button {
  background-color: #062333 !important;
  border-color: #062333 !important;
}

/* Footer Styles */
.footer {
  min-height: 100px;
  position: relative;
  background: #062333;
  color: #fff;
  padding-top: 5vh;
  padding-bottom: 1vh;
}

.footer-logo {
  max-width: 350px;
}

/* Curve Styles */
.custom-shape-divider-bottom-1701991771 {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  transform: rotate(180deg);
}

.custom-shape-divider-bottom-1701991771 svg {
  position: relative;
  display: block;
  width: calc(162% + 1.3px);
  height: 162px;
}

.custom-shape-divider-bottom-1701991771 .shape-fill {
  fill: #FFFFFF;
}

.custom-shape-divider-top-1701992275 {
  position: absolute;
  top: -1px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
  transform: rotate(180deg);
}

.custom-shape-divider-top-1701992275 svg {
  position: relative;
  display: block;
  width: calc(113% + 1.3px);
  height: 94px;
}

.custom-shape-divider-top-1701992275 .shape-fill {
  fill: #FFFFFF;
}

.custom-shape-divider-bottom-1702005791 {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}

.custom-shape-divider-bottom-1702005791 svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 76px;
}

.custom-shape-divider-bottom-1702005791 .shape-fill {
  fill: #FFFFFF;
}

.custom-shape-divider-bottom-1702005911 {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}

.custom-shape-divider-bottom-1702005911 svg {
  position: relative;
  display: block;
  width: calc(100% + 1.3px);
  height: 104px;
}

.custom-shape-divider-bottom-1702005911 .shape-fill {
  fill: #062333;
}