* {
  margin: 0;
  padding: 0;
}
#loading-spinner {
  display: none;
}
#loading-spinner-home {
  display: none;
  color: white;
  padding-left: 150px;
}

.navbar-sticky {
  position: sticky;
  top: 0;
  z-index: 1000; /* Adjust the z-index as needed */
  background-color: #ffffff; /* Set the background color of your navbar */
}
/* header-part */
.header-content {
  height: 160px;
  background-color: #ffff;
}
.main_logo img {
  max-width: 100%;
  height: auto;
  background-size: cover;
  cursor: pointer;
}
.connecting-icons {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 14px;
}
.icon img {
  width: 63px;
  height: 63px;
  cursor: pointer;
}
.second-logo img {
  max-width: 100%;
  height: auto;
  cursor: pointer;
}
.hero-section {
  background-image: linear-gradient(
      to right,
      rgba(3, 45, 95, 1),
      rgba(9, 18, 66, 0.1)
    ),
    url("../assets/images/hero-image.png"); 
  background-size: cover;
  background-position: center center;
  max-width: 100%;
  height: 850px;
  margin-top: -84px;
}
.navbar {
  background-color: rgba(9, 18, 66, 0.25);
  height: 83px;
  z-index: 1000;
}
.nav-link {
  font-family: "Krub", sans-serif;
  font-weight: 600;
  font-size: 16px;
  color: #ffff;
}
.navbar {
  transition: background-color 0.3s ease;
}

.navbar.navbar-sticky {
  background-color: #81899a; /* Set your desired background color */
}
/* Adjust your existing styles as follows */
.nav-item {
  position: relative;
}

.nav-link {
  margin: 0;
  color: white;
  text-decoration: none;
  display: flex;
  align-items: center;
  display: inline;
}

/* Add a centered vertical line (right side border) between nav items */
.nav-link::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  left: 110%;
  transform: translateY(-50%);
  height: 50%; /* Adjust the height of the vertical line as needed */
  border-left: 1px solid white; /* Adjust the color and style of the line */
}

/* Remove the vertical line from the last nav item */
.nav-item:last-child .nav-link::before {
  display: none;
}
/* Add underline effect on hover */
.nav-link::after {
  content: "";
  position: absolute;
  bottom: -5px;
  left: 0;
  width: 0;
  height: 2px; /* Adjust the height of the underline */
  background-color: white; /* Adjust the color of the underline */
  transition: width 0.8s; /* Add a smooth transition effect */
}

.nav-link:hover::after {
  width: 100%;
}

.hero-heading h1 {
  /* padding-left:-100px ; */
  margin-top: 100px;
  font-family: "Rubik", sans-serif;
  font-family: 700;
  font-size: 50px;
}
.hero-paragraph p {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 16px;
}
.hero_row {
  margin-top: 120px;
}

.hero_button {
  width: 324px;
  height: 103px;
  background-color: #fe0000;
  border: none;
  border-radius: 192px;
  font-family: "Rubik", sans-serif;
  font-size: 20px;
  font-weight: 600;
}

.about_image img {
  max-width: 100%;
  height: auto;
}

.about_container {
  margin-top: 80px; /* Adjust the margin based on your design */
}
.about_text {
  padding-left: 40px;
}

.about_title {
  width: 100%; /* Full width on smaller screens */
  max-width: 131px; /* Maximum width on larger screens */
  height: auto;
  background-color: #e8e8e8;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 24px;
  border-left: 3px solid #fe0000;
}

.about_heading {
  width: 100%;
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 45px; /* Adjust the font size based on your design */
}

.about_company {
  /* width: 100%; Full width on smaller screens */
  width: 250px; /* Maximum width on larger screens */
  height: 60px;
  background-color: #fe0000;
  font-family: "krub", sans-serif;
  font-weight: 600;
  font-size: 24px; /* Adjust the font size based on your design */
}

.about_paragraph {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 18px; /* Adjust the font size based on your design */
}

.about_button {
  width: 100%; /* Full width on smaller screens */
  max-width: 234px; /* Maximum width on larger screens */
  height: 70px;
  border: none;
  background-color: #fe0000;
  border-radius: 12px;
  font-family: "krub", sans-serif;
  font-weight: 600;
  font-size: 18px; /* Adjust the font size based on your design */
}

.welcome_container {
  margin-top: 80px; /* Adjust the margin based on your design */
}

.welcome_heading {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 45px; /* Adjust the font size based on your design */
}

.welcome_paragraph {
  margin-top: 20px; /* Adjust the margin based on your design */
}

.welcome_paragraph {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 18px; /* Adjust the font size based on your design */
  margin-top: 58px;
}

.welcome_image img {
  max-width: 100%;
  height: auto;
}
.subscribe_container {
  margin-top: 120px;
  height: 400px;
  background-color: #091242;
}

.subscribe_title h6 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 20px;
  color: white;
  padding-top: 80px;
  margin-left: 200px; /* Add this line to move the text 300px to the left */
}
.form_input {
  margin-left: 200px; /* Add this line to move the text 300px to the left */
  margin-top: 100px;
  background-color: #ffff;
  width: 400px;
  max-width: 496px;
  height: 80px;
  border-radius: 192px;
}
.subscribe_input {
  width: 430px;
  margin: 30px;
  font-family: "Rubik", sans-serif;
  font-size: 18px;
  border: none;
  color: black;
  outline: none; /* Add this line to remove the outline when focused */
}

.subscribe_input:focus {
  border: none; /* Remove border when the input is focused */
}
.subscribe_button button {
  margin-top: 100px;
  margin-left: 20px;
  width: 200px;
  max-width: 496px;
  height: 80px;
  border-radius: 192px;
  border: none;
  background-color: #fe0000;
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 18px;
}
.footer_container {
  height: 500px;
  background-color: #091242;
  /* margin-top: 120px; */
}
.footer_container_spcl {
  margin-top: 120px;
}

.footer_content {
  font-family: "Rubik", sans-serif;
  padding-top: 100px;
}
.footer_content_image img {
  max-width: 100%;
  width: 180px;
  height: auto;
  background-size: cover;
  cursor: pointer;
}
.footer_icons img {
  width: 35px;
  height: auto;
  margin-left: 12px;
  margin-top: 50px;
}

.footer_icons_sm {
  opacity: 0;
}

.footer_icons a:first-child {
  margin-left: 0; /* Remove margin-left for the first child */
}
.menu_link ul {
  margin-top: 40px;
}

.menu_list {
  margin-bottom: 8px;
  font-weight: 400;
  font-size: 16px;
  cursor: pointer;
}
.menu_list a {
  color: #ffffff;
  text-decoration: none;
}
.menu_heading {
  font-weight: 700;
  font-size: 24px;
}
.service_heading {
  margin-left: 80px;
  font-weight: 700;
  font-size: 24px;
}
.service_link {
  margin-top: 40px;
}
.service_list {
  margin-bottom: 8px;
  font-weight: 400;
  font-size: 16px;
  cursor: pointer;
  margin-left: 80px;
}
.address_heading {
  margin-left: 100px;
}
.address ul {
  margin-top: 40px;
  margin-left: 100px;
}
.address_line {
  margin-bottom: 8px;
}

/* about_section */

.about_hero-section {
  background-image: linear-gradient(
      90.54deg,
      #032d5f 21.35%,
      rgba(9, 18, 66, 0.1) 61.31%
    ),
    url("../assets/images/about-hero-image.png");
  background-size: cover;
  width: 100%;
  height: 400px;
  margin-top: -84px;
  z-index: 1;
}
.container {
  width: 100%; /* or a specific width */
  overflow-x: hidden; /* to hide horizontal scrollbar */
}
.about_container h1 {
  font-family: "Rubik", sans-serif;
  font-size: 60px;
  font-weight: 700;
  margin-left: 70px;
  padding-top: 100px;
}
.about_second {
  width: 100%;
  height: 150px;
}
.about_second h3 {
  font-family: "Rubik", sans-serif;
  font-size: 35px;
  font-weight: 600;
}

.about_second_bg {
  background-image: url("../assets/images/about-middle-bg.png");
  max-width: 100%;
  height: 350px;
  background-size: cover;
  position: relative; /* Establish positioning context for z-index */
  z-index: 1; /* Set a lower z-index */
}
.about_text_bottom {
  width: 100%;
  height: 700px;
  position: relative; /* Establish positioning context for z-index */
  z-index: 7;
}

.about_text_center {
  background-color: white;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 1000px;
  height: 600px;
  box-shadow: 0px 10px 30px 1px #00000040;
}
.text_content {
  margin-left: 50px;
}

.about_text_container {
  margin-top: -80px;
  background: transparent;
  position: relative;
  /* background-color: rgba(184, 40, 40, 0);; Change the last value (0.5) to adjust transparency */
}
.text_content_title {
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 14px;
  width: 114px;
  height: 40px;
  background-color: #e8e8e8;
  padding: 10px;
  border-left: 3px solid #fe0000;
}
.text_content_heading {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 38px;
}
.text_content_paragraph {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 20px;
}
.footer_image img {
  max-width: 100%;
  height: auto;
}

/* service_section */

.service_hero-section {
  background-image: linear-gradient(
      90.54deg,
      #032d5f 21.35%,
      rgba(9, 18, 66, 0.1) 61.31%
    ),
    url("../assets/images/service-image-top.png");
  background-size: cover;
  width: 100%;
  height: 400px;
  margin-top: -84px;
}
.service_title h2 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 32px;
}
.service_content_img_up img {
  max-width: 100%;
  height: auto;
}
.service_content_img_down img {
  width: 100%;
  height: auto;
}
.service_text_container_up {
  border-left: 0.1px solid black;
  padding-left: 50px;
}
.service_text_container_down {
  border-left: 0.1px solid black;
  padding-left: 50px;
}

.service_row {
  margin-top: 100px;
}
.service_content_heading_up h2 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 28px;
}
.service_content_heading_down h2 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 28px;
}
.service_content_paragraph_up p {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 18px;
}
.service_content_paragraph_down p {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 18px;
}

/* vision_mission */

.vision_misssion_hero-section {
  background-image: linear-gradient(
      90.54deg,
      #032d5f 21.35%,
      rgba(9, 18, 66, 0.1) 61.31%
    ),
    url("../assets/images/vision-mission.png");
  background-size: cover;
  width: 100%;
  height: 400px;
  margin-top: -84px;
}
.vision-mission_title h2 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 32px;
  margin-top: 60px;
}
.shadow_box_container {
  width: 100%;
  height: auto;
}
.shadow_box_one {
  max-width: 950px;
  height: 500px;
  background: #f7f7f7;
  margin: auto;
  border-radius: 30px;
  box-shadow: 0px 21px 19px 0px #00000012;
}

.box_one_content_title h4 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 30px;
}
.box_one_body_paragraph p {
  font-family: "krub", sans-serif;
  font-weight: 500;
  font-size: 20px;
}
.box_one_body_image img {
  max-width: 400px;
  height: 300px;
  background-size: cover;
  margin-left: 50px;
  padding-bottom: 60px;
  cursor: pointer;
}
.box_two_body_image img {
  max-width: 400px;
  height: 300px;
  background-size: cover;
  margin-left: 5px;
  padding-bottom: 60px;
  cursor: pointer;
}

.box_one_content {
  padding-top: 60px;
  padding-left: 60px;
}
.shadow_box_one {
  margin-top: 80px;
}

/* contact page */
.contact_hero-section {
  background-image: linear-gradient(
      90.96deg,
      #032d5f 17.98%,
      rgba(9, 18, 66, 0.3) 43.08%
    ),
    url("../assets/images/contact-bg-img.png");
  background-size: cover;
  width: 100%;
  height: 400px;
  margin-top: -84px;
}
.contact_container_title h4 {
  font-family: "Rubik", sans-serif;
  font-weight: 600;
  font-size: 25px;
  margin-top: 80px;
}
.contact_form-wrapper {
  width: 900px;
  height: 780px;
  margin: auto;
  background-color: #091242;
}
.contact_form_titles {
  padding-top: 80px;
  font-family: "Rubik", sans-serif;
}
.contact_form_titles h6 {
  margin: auto;
  font-weight: 400;
  font-size: 14px;
  width: 71px;
  height: 23px;
  background-color: rgba(232, 232, 232, 0.1);
  border-left: 3px solid #fe0000;
}
.contact_form_titles h3 {
  font-weight: 600;
  font-size: 32px;
}
.contact_form_icons {
  margin-top: 60px;
  display: flex;
  justify-content: center;
}
.contact_form_icons img {
  max-width: 100%;
  height: auto;
  cursor: pointer;
}
.form-input input {
  width: 300px;
  height: 45px;
  border: 1px solid #ffffff; /* Set border color to white */
  background: none;
  outline: none;
  color: white; /* Set text color to white */
  caret-color: white; /* Set cursor color to white */
  padding-left: 10px;
  font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
  font-size: 20px; /* Set the font size */
  font-weight: 400; /* Set the font weight */
}

/* Optional: Add alternative styling for better focus indication */
.form-input input:focus {
  box-shadow: 0 0 5px rgba(0, 0, 255, 0.5); /* Example: Add a box shadow on focus */
}
.form_contact {
  margin-top: 100px;
}
.form-group {
  position: relative;
}
.form-group textarea {
  position: absolute;
  width: 612px;
  height: 100px;
  left: 50%;
  transform: translateX(-50%);
  margin-left: 6px;
  border: 1px solid #ffffff; /* Set border color to white */
  background: none;
  outline: none;
  color: white; /* Set text color to white */
  caret-color: white; /* Set cursor color to white */
  padding-left: 10px;
  padding-top: 10px;

  /* Placeholder styles */
  font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
  font-size: 20px; /* Set the font size */
  font-weight: 400; /* Set the font weight */
}

.form-group textarea::placeholder {
  font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
  font-size: 20px; /* Set the font size */
  font-weight: 400; /* Set the font weight */
}
.form-submit button {
  margin-top: 130px;
  width: 194px;
  height: 60px;
  background-color: #fe0000;
  border: none;
  color: #ffff;
  font-family: "krub", sans-serif;
  font-size: 16px;
  font-weight: 600;
  padding-bottom: -130;
}
.c_code input {
  width: 97px;
  height: 45px;
  border: 1px solid #ffffff; /* Set border color to white */
  background: none;
  outline: none;
  color: white; /* Set text color to white */
  caret-color: white; /* Set cursor color to white */
  padding-left: 10px;
  font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
  font-size: 20px; /* Set the font size */
  font-weight: 400; /* Set the font weight */
}
.form_input_number input {
  width: 200px;
  height: 45px;
  border: 1px solid #ffffff; /* Set border color to white */
  background: none;
  outline: none;
  color: white; /* Set text color to white */
  caret-color: white; /* Set cursor color to white */
  padding-left: 10px;
  font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
  font-size: 20px; /* Set the font size */
  font-weight: 400; /* Set the font weight */
  margin-left: 3px;
}
.phone_city_row,
.message_row {
  margin-top: 15px;
}
.connecting_accounts {
  width: 900px;
  height: 450px;
  background: #ffffff;
  margin: auto;
  margin-top: 80px;
  box-shadow: 0px 11px 28px 0px #00000040;
}
.whats_appp_section {
  padding-left: 120px;
  padding-top: 60px;
}
.email_section {
  padding-left: 100px;
  padding-top: 60px;
}
.whatsapp_button button {
  margin-top: 60px;
  width: 140px;
  height: 40px;
  background-color: #69e383;
  border: none;
  border-radius: 7px;
}
.whatsapp_button img {
  margin-left: 10px;
  max-width: 100%;
  height: auto;
}
.whats_appp_section h6 {
  background-color: #e8e8e8;
  border-left: 3px solid #fe0000;
  width: 75px;
  height: 23px;
  padding-left: 3px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 14px;
  padding-top: 3px;
}
.whats_appp_section h2 {
  font-family: "Rubik";
  font-size: 35px;
  font-weight: 600;
}
.whats_appp_section p {
  font-family: "Rubik", sans-serif;
  font-size: 16px;
  font-weight: 400;
}

.email_section h6 {
  background-color: #e8e8e8;
  border-left: 3px solid red;
  width: 75px;
  height: 23px;
  padding-left: 3px;
  font-family: "Rubik", sans-serif;
  font-weight: 400;
  font-size: 14px;
  padding-top: 3px;
}
.email_section h2 {
  font-family: "Rubik";
  font-size: 35px;
  font-weight: 600;
}
.email_section p {
  font-family: "Rubik", sans-serif;
  font-size: 16px;
  font-weight: 400;
}
.email_section button {
  margin-top: 60px;
  width: 140px;
  height: 40px;
  background-color: #6992e3;
  border: none;
  border-radius: 7px;
}
.email_button img {
  margin-left: 10px;
  max-width: 100%;
  height: auto;
}

/* error_page */

.error_container{
  height: 80vh;
}
.error_content img{
  width: 400px;
  height: 254;
}
.error_content{
  width: 400px;
  height: 254;
}
.error_content h4{
  font-family: "Rubik",sans-serif;
  font-weight: 700;
  font-size: 40;
}
.err_btn {
  font-family: "Rubik",sans-serif;
  font-size: 18px;
  font-weight: 500;
  width: 180px;
  height: 50px;
  border: none;
  background-color: #FF0000;
  border-radius: 7px;
}






@media (max-width: 540px) {
  .navbar {
    background-color: #81899a;
  }

  .navbar-nav {
    background-color: #4a5586;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
  }
  .nav-link {
    padding-left: 40px;
  }
  .social-icon_bg {
    background-color: #4a5586;
    padding-left: 20px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
  }

  .hero-section {
    background: none;
  }
  .hero-mobile {
    background-image: linear-gradient(
        to right,
        rgba(3, 45, 95, 1),
        rgba(9, 18, 66, 0.1)
      ),
      url("../assets/images/hero-image.png");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    max-width: 100%;
    height: 500px;
  }

  .hero-heading h1 {
    margin-top: 60px;
    font-family: "Rubik", sans-serif;
    font-family: 700;
    font-size: 25px;
  }

  .hero-paragraph p {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 10px;
    margin-bottom: 40px;
    width: 100%;
  }
  .hero_row {
    margin-top: 30px;
  }

  .hero_button {
    width: 150px;
    height: 50px;
    background-color: #fe0000;
    border: none;
    border-radius: 192px;
    font-family: "Rubik", sans-serif;
    font-size: 14px;
    font-weight: 600;
  }
  .about_container {
    margin-top: 40px; /* Adjust the margin based on your design */
  }
  .about_text {
    padding-left: 0;
  }

  .about_title {
    width: 100%; /* Full width on smaller screens */
    max-width: 131px; /* Maximum width on larger screens */
    height: auto;
    background-color: #e8e8e8;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 20px;
    border-left: 3px solid #fe0000;
    margin-top: 20px;
    padding: 0;
  }

  .about_heading {
    width: 100%;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 30px; /* Adjust the font size based on your design */
    margin-top: 10px;
  }

  .about_company {
    /* width: 100%; Full width on smaller screens */
    width: 150px; /* Maximum width on larger screens */
    height: 50px;
    background-color: #fe0000;
    font-family: "krub", sans-serif;
    font-weight: 600;
    font-size: 16px; /* Adjust the font size based on your design */
    margin-top: 10px;
  }

  .about_paragraph {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px; /* Adjust the font size based on your design */
  }

  .about_button {
    width: 100%; /* Full width on smaller screens */
    max-width: 120px; /* Maximum width on larger screens */
    height: 45px;
    border: none;
    background-color: #fe0000;
    border-radius: 12px;
    font-family: "krub", sans-serif;
    font-weight: 600;
    font-size: 14px; /* Adjust the font size based on your design */
  }

  .welcome_container {
    margin-top: 80px; /* Adjust the margin based on your design */
  }

  .welcome_heading {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 30px; /* Adjust the font size based on your design */
  }

  .welcome_paragraph {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px; /* Adjust the font size based on your design */
    margin-top: 20px;
  }
  .subscribe_container {
    margin-top: 120px;
    height: 300px;
    background-color: #091242;
  }

  .subscribe_title h6 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
    color: white;
    padding-top: 50px;
    margin-left: 20px; /* Add this line to move the text 300px to the left */
  }

  .form_input {
    margin-left: 5px; /* Add this line to move the text 300px to the left */
    margin-top: 80px;
    background-color: #ffff;
    width: 350px;
    height: 40px;
    border-radius: 192px;
  }
  .subscribe_input {
    width: 220px;
    margin: 15px;
    font-family: "Rubik", sans-serif;
    font-size: 12px;
    border: none;
    color: black;
    outline: none; /* Add this line to remove the outline when focused */
  }

  .subscribe_input:focus {
    border: none; /* Remove border when the input is focused */
  }

  .subscribe_button button {
    margin-top: 80px;
    margin-left: 5px;
    width: 90px;
    height: 40px;
    border-radius: 192px;
    border: none;
    background-color: #fe0000;
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 12px;
  }
  .footer_container {
    height: 1200px;
    background-color: #091242;
    /* margin-top: 120px; */
  }
  .footer_container_spcl {
    margin-top: 120px;
  }
  .footer_content_image img {
    max-width: 100%;
    width: 180px;
    height: auto;
    background-size: cover;
    cursor: pointer;
  }

  .footer_icons img {
    display: none;
  }
  .footer_icons_sm {
    opacity: 1;
    margin-left: 100px;
    margin-top: 20px;
  }
  .footer_icons_sm img {
    margin-left: 10px;
    width: 35px;
  }

  .footer_content_menu {
    margin-top: 50px;
    padding-left: 75px;
  }

  .footer_content_service {
    margin-top: 50px;
    padding-left: 40px;
  }
  .footer_content_address {
    margin-top: 50px;
    padding-left: 20px;
  }

  /* about_page */

  .about_hero-mobile {
    background-image: linear-gradient(
        90.54deg,
        #032d5f 21.35%,
        rgba(9, 18, 66, 0.1) 61.31%
      ),
      url("../assets/images/about-hero-image.png");
    background-size: cover;
    background-position: center;
    max-width: 100%;
    height: 300px;
  }

  .about_container h1 {
    font-family: "Rubik", sans-serif;
    font-size: 35px;
    font-weight: 700;
    margin-left: 30px;
    padding-top: 120px;
  }
  .about_second {
    width: 100%;
    height: 80px;
  }
  .about_second h3 {
    font-family: "Rubik", sans-serif;
    font-size: 20px;
    font-weight: 600;
  }

  .about_second_bg {
    background-image: url("../assets/images/about-middle-bg.png");
    max-width: 100%;
    height: 250px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    z-index: 1; /* Set a lower z-index */
  }

  .about_text_center {
    background-color: white;
    width: 100%;
    height: 600px;
    box-shadow: 0px 10px 30px 1px #00000040;
  }
  .about_text_container {
    margin-top: -80px;
    background: transparent;
    position: relative;
    /* background-color: rgba(184, 40, 40, 0);; Change the last value (0.5) to adjust transparency */
  }

  .text_content_title {
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 14px;
    width: 90px;
    height: 25px;
    background-color: #e8e8e8;
    padding-bottom: 20px;
  }

  .text_content_heading {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 23px;
  }

  .text_content_paragraph {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px;
  }
  .text_content {
    margin-left: 20px;
  }

  /* service_page  */
  .service_hero-section {
    background: none;
  }
  .service_hero-mobile {
    background-image: linear-gradient(
        90.96deg,
        #032d5f 17.98%,
        rgba(9, 18, 66, 0.3) 43.08%
      ),
      url("../assets/images/service-image-top.png");
    background-size: cover;
    background-position: center;
    max-width: 100%;
    height: 300px;
  }
  .service_row {
    margin-top: 40px;
  }

  .service_title h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
  }

  .service_content_img_up img {
    width: 90%;
    height: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .service_text_container_up {
    border-left: 0;
    padding-left: 50px;
    margin-top: 250px;
  }

  .service_content_img_down img {
    width: 90%;
    height: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .service_text_container_down {
    border-left: 0;
    padding-left: 50px;
    margin-top: 250px;
  }

  .service_content_heading_up h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
    margin-top: 10px;
  }
  .service_content_paragraph_up p {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px;
  }
  .service_content_heading_down h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
    margin-top: 10px;
  }
  .service_content_paragraph_down p {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px;
  }

  /* vision-mission_page */

  .vision_misssion_hero-section {
    background: none;
  }
  .vision_misssion_hero-mobile {
    background-image: linear-gradient(
        90.96deg,
        #032d5f 17.98%,
        rgba(9, 18, 66, 0.3) 43.08%
      ),
      url("../assets/images/vision-mission.png");
    background-size: cover;
    background-position: center;
    max-width: 100%;
    height: 300px;
  }
  .vision-mission_title h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 32px;
    margin-top: 60px;
  }
  .vision-mission_title h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
    margin-top: 60px;
  }
  .shadow_box_one {
    width: 360px;
    height: 600px;
    background: #f7f7f7;
    margin: auto;
    border-radius: 15px;
    box-shadow: 0px 21px 19px 0px #00000012;
    margin-top: 50px;
  }

  .box_one_body-content {
    display: flex;
    flex-direction: column;
  }
  .box_one_content_title h4 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
  }
  .box_one_body_paragraph p {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 10px;
  }
  .box_one_body_image,
  .box_two_body-content img {
    max-width: 350px;
    height: 250px;
    background-size: cover;
    margin-top: 20px;
    padding-bottom: 60px;
  }

  /* service_page  */
  .service_hero-section {
    background: none;
  }
  .service_hero-mobile {
    background-image: linear-gradient(
        90.96deg,
        #032d5f 17.98%,
        rgba(9, 18, 66, 0.3) 43.08%
      ),
      url("../assets/images/service-image-top.png");
    background-size: cover;
    background-position: center;
    max-width: 100%;
    height: 300px;
  }
  .service_row {
    margin-top: 40px;
  }

  .service_title h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
  }

  .service_content_img_up img {
    width: 90%;
    height: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .service_text_container_up {
    border-left: 0;
    padding-left: 50px;
    margin-top: 250px;
  }

  .service_content_img_down img {
    width: 90%;
    height: auto;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .service_text_container_down {
    border-left: 0;
    padding-left: 50px;
    margin-top: 250px;
  }

  .service_content_heading_up h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
    margin-top: 10px;
  }
  .service_content_paragraph_up p {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px;
  }
  .service_content_heading_down h2 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 20px;
    margin-top: 10px;
  }
  .service_content_paragraph_down p {
    font-family: "krub", sans-serif;
    font-weight: 500;
    font-size: 12px;
  }

  /* contact_page */
  .contact_hero-section {
    background-image: none;
  }
  .contact_hero-mobile {
    background-image: linear-gradient(
        90.96deg,
        #032d5f 17.98%,
        rgba(9, 18, 66, 0.3) 43.08%
      ),
      url("../assets/images/contact-bg-img.png");
    background-size: cover;
    background-position: center;
    max-width: 100%;
    height: 300px;
  }

  .contact_container_title h4 {
    font-family: "Rubik", sans-serif;
    font-weight: 600;
    font-size: 18px;
    margin-top: 80px;
  }
  .contact_form-wrapper {
    width: 500px;
    height: 800px;
    margin: auto;
    background-color: #091242;
  }

  .contact_sd_container {
    padding: 0;
  }

  .contact_form_titles h6 {
    font-weight: 400;
    font-size: 14px;
    width: 71px;
    height: 23px;
    background-color: rgba(232, 232, 232, 0.1);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .contact_form_titles h3 {
    font-weight: 600;
    font-size: 18px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    padding-top: 30px;
  }

  .contact_form_icons {
    margin-top: 80px;
  }
  .contact_form_icons img {
    width: 45px;
    height: 45px;
  }
  .contact_form_icons {
    font-size: 10px;
    padding-right: 130px;
  }
  .form-input input {
    border: 1px solid #ffffff; /* Set border color to white */
    background: none;
    outline: none;
    color: white; /* Set text color to white */
    caret-color: white; /* Set cursor color to white */
    font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
    font-size: 16px; /* Set the font size */
    font-weight: 400; /* Set the font weight */
  }

  .input_name {
    width: 300px;
    height: 40px;
    /* margin-right: 180px; */
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .input_email {
    width: 300px;
    height: 40px;
    margin-top: 60px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .form_phone_input input {
    border: 1px solid #ffffff; /* Set border color to white */
    background: none;
    outline: none;
    color: white; /* Set text color to white */
    caret-color: white; /* Set cursor color to white */
    font-family: "League Spartan", sans-serif; /* Replace 'Your Font' with the desired font family */
    font-size: 16px; /* Set the font size */
    font-weight: 400; /* Set the font weight */
  }
  .form_phone_input {
    margin-top: 105px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .input_city {
    width: 300px;
    height: 40px;
    margin-top: 165px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .form-group textarea {
    margin-top: 210px;
    width: 300px;
    display: flex;
    justify-content: start;
    margin-left: 0;
  }

  .form-group {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .form-submit button {
    margin-top: 130px;
    width: 126px;
    height: 37px;
    background-color: #fe0000;
    border: none;
    color: #ffff;
    font-family: "krub", sans-serif;
    font-size: 12px;
    font-weight: 600;
    margin-top: 340px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  #loading-spinner {
    display: none;
    padding-top: 380px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .connecting_accounts {
    width: 365px;
    height: 700px;
    background: #ffffff;
    margin-top: 80px;
    box-shadow: 0px 11px 28px 0px #00000040;
    display: flex;
    justify-content: center;
  }

  .email_section {
    padding-left: 100px;
    padding-top: 60px;
  }

  .whats_appp_section h6 {
    background-color: #e8e8e8;
    border-left: 3px solid red;
    width: 75px;
    height: 23px;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 14px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .whats_appp_section h2 {
    font-family: "Rubik";
    font-size: 35px;
    font-weight: 600;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 30px;
  }
  .whats_appp_section p {
    font-family: "Rubik", sans-serif;
    font-size: 12px;
    font-weight: 400;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 80px;
  }
  .whatsapp_button button {
    width: 180px;
    height: 40px;
    background-color: #69e383;
    border: none;
    border-radius: 7px;
    margin-top: 150px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .whatsapp_button img {
    margin-left: 10px;
    max-width: 100%;
    height: auto;
  }

  .email_section h6 {
    background-color: #e8e8e8;
    border-left: 3px solid red;
    width: 75px;
    height: 23px;
    padding-left: 3px;
    font-family: "Rubik", sans-serif;
    font-weight: 400;
    font-size: 14px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }

  .email_section h2 {
    font-family: "Rubik";
    font-size: 35px;
    font-weight: 600;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 60px;
  }
  .email_section p {
    font-family: "Rubik", sans-serif;
    font-size: 12px;
    font-weight: 400;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 110px;
  }
  .email_section button {
    margin-top: 180px;
    width: 180px;
    height: 40px;
    background-color: #6992e3;
    border: none;
    border-radius: 7px;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
  }
  .email_button img {
    margin-left: 10px;
    max-width: 100%;
    height: auto;
  }
  .email_section {
    padding: 0;
  }
}

@media (min-width: 540px) and (max-width: 960px) {
  /* Styles for screens between 540 pixels and 960 pixels */
  /* Add your specific styles for this range of screens here */
  .navbar {
    background-color: #ffffff;
  }

  .navbar-nav {
    background-color: #4a5586;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
  }
  .nav-link {
    padding-left: 40px;
  }
  .social-icon_bg {
    background-color: #4a5586;
    padding-left: 20px;
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
  }
}
