* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/*Styling the Loader*/

.loader {
  position: fixed;
  top: 0;
  left: 0;
  height: 100vh;
  width: 100vw;
  background-color: rgba(255, 255, 255, 0.9); /* Light background */
  display: flex;
  align-items: center; /* Center vertically */
  justify-content: center; /* Center horizontally */
  z-index: 999; /* Ensure it stays on top */
}

/* Your existing box styles */
.boxes {
  --size: 32px;
  --duration: 800ms;
  height: calc(var(--size) * 2);
  width: calc(var(--size) * 3);
  position: relative;
  transform-style: preserve-3d;
  transform-origin: 50% 50%;
  margin-top: calc(var(--size) * 1.5 * -1);
  transform: rotateX(60deg) rotateZ(45deg) rotateY(0deg) translateZ(0px);
}

.boxes .box {
  width: var(--size);
  height: var(--size);
  top: 0;
  left: 0;
  position: absolute;
  transform-style: preserve-3d;
}

.boxes .box:nth-child(1) {
  transform: translate(100%, 0);
  animation: box1 var(--duration) linear infinite;
}

.boxes .box:nth-child(2) {
  transform: translate(0, 100%);
  animation: box2 var(--duration) linear infinite;
}

.boxes .box:nth-child(3) {
  transform: translate(100%, 100%);
  animation: box3 var(--duration) linear infinite;
}

.boxes .box:nth-child(4) {
  transform: translate(200%, 0);
  animation: box4 var(--duration) linear infinite;
}

.boxes .box > div {
  --background: #14925b; /* Updated color */
  --top: auto;
  --right: auto;
  --bottom: auto;
  --left: auto;
  --translateZ: calc(var(--size) / 2);
  --rotateY: 0deg;
  --rotateX: 0deg;
  position: absolute;
  width: 100%;
  height: 100%;
  background: var(--background);
  top: var(--top);
  right: var(--right);
  bottom: var(--bottom);
  left: var(--left);
  transform: rotateY(var(--rotateY)) rotateX(var(--rotateX))
    translateZ(var(--translateZ));
}

.boxes .box > div:nth-child(1) {
  --top: 0;
  --left: 0;
}

.boxes .box > div:nth-child(2) {
  --background: #1abf8b; /* Slightly lighter variant */
  --right: 0;
  --rotateY: 90deg;
}

.boxes .box > div:nth-child(3) {
  --background: #0e7f5b; /* Darker variant */
  --rotateX: -90deg;
}

.boxes .box > div:nth-child(4) {
  --background: #14925b; /* Same base color */
  --top: 0;
  --left: 0;
  --translateZ: calc(var(--size) * 3 * -1);
}

/* Keyframes */
@keyframes box1 {
  0%,
  50% {
    transform: translate(100%, 0);
  }
  100% {
    transform: translate(200%, 0);
  }
}

@keyframes box2 {
  0% {
    transform: translate(0, 100%);
  }
  50% {
    transform: translate(0, 0);
  }
  100% {
    transform: translate(100%, 0);
  }
}

@keyframes box3 {
  0%,
  50% {
    transform: translate(100%, 100%);
  }
  100% {
    transform: translate(0, 100%);
  }
}

@keyframes box4 {
  0% {
    transform: translate(200%, 0);
  }
  50% {
    transform: translate(200%, 100%);
  }
  100% {
    transform: translate(100%, 100%);
  }
}

.content-item {
  display: none; /* Hidden initially */
}

/*Styling the Loader End */

/*STYLING*/

:root {
  --color1: #14925b;
  --color2: #f8f8ff;
}

a {
  text-decoration: none;
}
li {
  list-style: none;
}

#image-fit {
  width: 400px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}

nav {
  background-color: var(--color1);
  position: sticky; /* Make the navbar sticky */
  top: 0; /* Stick to the top */
  z-index: 1000; /* Ensure it stays above other content */
}
nav,
a {
  color: var(--color2);
}
.nav {
  color: var(--color2);
  font-weight: 600;
}

.service-dropdown {
  float: left;
  overflow: hidden;
}

.service-dropdown-content {
  display: none;
  position: absolute;
  background-color: var(--color1);
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
  padding: 20px;
}

.service-dropdown-content a {
  float: none;
  color: var(--color2);

  text-decoration: none;
  text-align: left;
}

.service-dropdown-content li:hover {
  border-right: 4px solid var(--color2);
}
.service-dropdown:hover .service-dropdown-content {
  display: block;
}

.sub-section {
  overflow: hidden;
}
.sub-section-content {
  display: none;
  position: absolute;
  background-color: var(--color1);
  min-width: 280px;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1;
  padding: 20px;
  margin-left: 90px;
}
.sub-section-content a {
  float: none;
  color: var(--color2);

  text-decoration: none;
  text-align: left;
}
.sub-section:hover .sub-section-content {
  display: block;
}

.smarthub-login {
  border: 2px solid var(--color2);
  color: var(--color2);
  padding: 15px;
  font-weight: 600;
}

.nav:hover {
  border-bottom: 2px solid var(--color2) !important;

  border-radius: 2px;
}

.video-container {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}

.video-container video {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.content {
  position: absolute;

  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: var(--color2);
}

.content > p {
  position: relative;
  display: inline-block;
  font-size: 20px;
}

.content > p::before,
.content > p::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 2px; /* Adjust thickness */
  background-color: var(--color1);
}
.content > p::before {
  top: -5px; /* Space between text and overline */
}
.content > p::after {
  bottom: -5px; /* Space between text and underline */
}

.content > h1 {
  font-size: 42px;
}
.icon {
  background-color: var(--color1);
  padding: 7px;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  align-items: center;
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
  transition: transform 0.3s ease-in-out;
}
.icon:hover {
  transform: scale(0.9);
}

.content2 > p > a {
  font-size: 12px;
  font-weight: 600;
  padding-top: 20px;
}

.main2 {
  padding: 50px;
  text-align: center;
  background-color: var(--color1);
  color: var(--color2);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px,
    rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px,
    rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
.main3 {
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

.people {
  position: relative;
  display: inline-block;
  font-size: 50px;
}
.people::before,
.people::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  height: 1px; /* Adjust thickness */
  background-color: var(--color2);
}
.people::before {
  top: -5px; /* Space between text and overline */
}
.people::after {
  bottom: -5px;
}

.rlx {
  border-radius: 10px;
  height: 363px;
  object-fit: cover;
}
.info {
  background: linear-gradient(
    to bottom,
    rgba(76, 175, 80, 0.7),
    /* Light Green */ rgba(27, 94, 32, 0.7) /* Dark Green */
  ) !important;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top;
  padding-top: 10%;
  padding-bottom: 25%;
  position: absolute;

  left: 3%;
  right: 3%;
  bottom: 0;
  height: 300px;
  transition: 0.5s;
}
.real:hover .info {
  height: 100%;

  padding: 10% 0px;
  border-radius: 20px;
}

.why-choose {
  text-align: center; /* Center text */
  height: 350px; /* Fixed height for the container */

  flex-direction: column; /* Stack items vertically */
  justify-content: space-between; /* Space items evenly */
}

.why-choose img {
  width: 250px; /* Fixed width for the images */
  height: 250px; /* Fixed height for the images */
  object-fit: cover; /* Cover the box and maintain aspect ratio */
  margin-bottom: 10px; /* Space between image and text */
  border-radius: 10px;
}

.story {
  background-color: var(--color1);
  padding: 10px;
  color: var(--color2);
  font-weight: bolder;
}
.story-body > img {
  width: 400px;
  float: left;
  margin-right: 20px;
}

.get-in-touch {
  padding: 10px;
  padding-left: 20px;
  padding-right: 20px;
  border: none;
  background-color: var(--color2);
  color: var(--color1);
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.3s ease, transform 0.3s ease;
}

.get-in-touch:hover {
  transform: translateY(-5px);
  background-color: var(--color1);
  color: var(--color2);
  border: 2px solid var(--color2);
}

.follow-us {
  background-image: url("./images/follow-us.webp");
  background-size: cover;
  background-position: center;
  padding: 20px;
  position: relative;
  height: 300px;
}

.follow-up-gradient {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(rgba(0, 128, 0, 0.3), rgba(0, 128, 0, 0.3));
}

.follow-us-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  text-align: center;
  margin-top: 10px;
}

.footer1 {
  background-color: var(--color1);
  padding: 60px;
}

.footer1 h6 {
  padding: 10px;
  background-color: var(--color2);
  color: var(--color1);
}
.footer1 li:hover {
  border-right: 1px solid var(--color2);
}

/*About Us Page styling */
.main-about {
  background-image: url("./images/aboutUs.webp");
  background-size: cover;
  background-position: center;
  padding: 20px;
  position: relative;
  height: 100vh;
}
.about-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(rgba(0, 128, 0, 0.6), rgba(0, 128, 0, 0.6));
}

.main-about-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  text-align: center;
}
.main-about-3 {
  width: 90%;
  margin-right: auto;
  margin-right: auto;
}
.main-about-3 img {
  margin-top: 60px;
}
.fa-car {
  padding: 15px;
  border: 1px solid var(--color1);
}
.fa-car:hover {
  background-color: var(--color1);
  color: var(--color2);
}
#main-about-2 {
  padding: 25px;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
}

div.gallery {
  border: 1px solid var(--color1);
  border-radius: 10px;
}

div.gallery:hover {
  border: 1px solid #777;
}

div.gallery img {
  width: 100%;
  max-height: 200px;
}

div.desc {
  padding: 15px;
  text-align: center;
  background-color: var(--color1);
  color: var(--color2);
}

.responsive {
  padding: 0 6px;
  float: left;
  width: 24.99999%;
}

@media only screen and (max-width: 700px) {
  .responsive {
    width: 49.99999%;
    margin: 6px 0;
  }
}

@media only screen and (max-width: 500px) {
  .responsive {
    width: 100%;
  }
}

.clearfix:after {
  content: "";
  display: table;
  clear: both;
}

/*Countries Page Styling */
.main-countries {
  background-image: url("./images/world.webp");
  background-size: cover;
  background-position: center;
  padding: 20px;
  position: relative;
  height: 82vh;
}
.countries-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(rgba(0, 128, 0, 0.4), rgba(0, 128, 0, 0.4));
}

.main-countries-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  text-align: center;
}

.main-countries-content > h3 {
  font-size: 60px;
}

.country {
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
  padding: 30px;
}

.country img {
  border-radius: 10px;
}

/*Contact Us Page Styling */
.main-contact-us {
  position: relative;
  height: 100vh;
  background-image: url("./images/contactus.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-contact-us-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.contact-us-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}
.contactus2 {
  width: 100%;
}
/*Careers Page Styling */
.careers-main {
  position: relative;
  height: 100vh;
  background-image: url("./images/careers.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.careers-main-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.careers-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}
#diversity {
  font-size: 13px;
}
#culture {
  font-size: 18px;
  background-color: var(--color1);
  color: var(--color2);
  padding: 10px;
  margin-bottom: 10px;
}

/* Airfreight page styling */
.main-airfreight {
  position: relative;
  height: 50vh;
  background-image: url("./images/airfreight.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-airfreight-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-airfreight-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

.schedule {
  background-color: var(--color1);
  padding: 10px;
  box-shadow: rgb(38, 57, 77) 0px 20px 30px -10px;
}
.schedule > li {
  padding: 10px;
  font-weight: 600;
  color: var(--color2);
}
.cargolux {
  width: 300px;
}
.testimony > img {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  object-fit: cover;
  overflow: hidden;
  float: left;
  margin-right: 10px;
}
.fa-star {
  color: var(--color1);
  font-size: 30px;
}
.reliable {
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  padding: 20px;
}

/* Cargo Insurance page styling */
.main-cargo-insurance {
  position: relative;
  height: 50vh;
  background-image: url("./images/cargo-insurance.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-cargo-insurance-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-cargo-insurance-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Customs Brokage page styling */
.main-customs-brokage {
  position: relative;
  height: 50vh;
  background-image: url("./images/industries.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-customs-brokage-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-customs-brokage-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}
.accordion {
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 10px;
}

.accordion-item {
  border-bottom: 1px solid #ccc;
}

.accordion-header {
  background-color: var(--color1);
  padding: 10px;
  cursor: pointer;
  font-weight: bold;
  transition: background-color 0.3s;
  color: var(--color2);
}

.accordion-header:hover {
  background-color: var(--color2);
  color: var(--color1);
}

.accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease-out;
  padding: 0 10px;
  background-color: white;
}

.accordion-header.active + .accordion-content {
  max-height: 100px; /* Adjust as needed */
  padding: 10px; /* Add padding when expanded */
}

/* Contract Logistics Page Styling */
.main-contract-logistics {
  position: relative;
  height: 50vh;
  background-image: url("./images/fly.jpeg");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-contract-logistics-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-contract-logistics-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}
.warehouse-img {
  width: 70%;
}
.line1 {
  padding: 20px;
  background-color: var(--color1);
}

/* Bio fuels Page Styling */
.main-biofuels {
  position: relative;
  height: 50vh;
  background-image: url("./images/biofuels.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-biofuels-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-biofuels-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Cross Border E commerce Page Styling */
.main-cross-border {
  position: relative;
  height: 50vh;
  background-image: url("./images/truck.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-cross-border-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-cross-border-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Green Solution Page Styling */
.main-green-solution {
  position: relative;
  height: 50vh;
  background-image: url("./images/green.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-green-solution-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-green-solution-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Mickey E container Page Styling */
.main-mickey-e-container {
  position: relative;
  height: 50vh;
  background-image: url("./images/cargo-insurance.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-mickey-e-container-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-mickey-e-container-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Multi modal Page Styling */
.main-multimodal {
  position: relative;
  height: 50vh;
  background-image: url("./images/usa.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-multimodal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-multimodal-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Network Optimization Page Styling */
.main-network-optimization {
  position: relative;
  height: 50vh;
  background-image: url("./images/contain.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-network-optimization-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-network-optimization-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Ocean Freight (fcl) Page Styling */
.main-fcl {
  position: relative;
  height: 50vh;
  background-image: url("./images/canada.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-fcl-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-fcl-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Ocean Freight (lcl) Page Styling */
.main-lcl {
  position: relative;
  height: 50vh;
  background-image: url("./images/taiwan.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-lcl-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-lcl-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Rail Freight Page Styling */
.main-railfreight {
  position: relative;
  height: 50vh;
  background-image: url("./images/rail.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-railfreight-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-railfreight-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Road Freight Page Styling */
.main-roadfreight {
  position: relative;
  height: 50vh;
  background-image: url("./images/implement.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-roadfreight-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-roadfreight-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Solas Weighing and filing Page Styling */
.main-solas-weighing {
  position: relative;
  height: 50vh;
  background-image: url("./images/usa.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-solas-weighing-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-solas-weighing-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Sea Air Page Styling */
.main-sea-air {
  position: relative;
  height: 50vh;
  background-image: url("./images/fly.jpeg");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-sea-air-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-sea-air-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Short sea Page Styling */
.main-short-sea {
  position: relative;
  height: 50vh;
  background-image: url("./images/cargo-insurance.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-short-sea-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-short-sea-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Technology customer solution Page Styling */
.main-tech-customer-solution {
  position: relative;
  height: 50vh;
  background-image: url("./images/tech.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-tech-customer-solution-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-tech-customer-solution-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/*For Industries */

/* Aerospace & Defense Page Styling */
.main-aerospace {
  position: relative;
  height: 50vh;
  background-image: url("./images/aerospace.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-aerospace-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-aerospace-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Aid & Relief Page Styling */
.main-aid-relief {
  position: relative;
  height: 50vh;
  background-image: url("./images/aid-relief.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-aid-relief-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-aid-relief-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Automotive Page Styling */
.main-automotive {
  position: relative;
  height: 50vh;
  background-image: url("./images/automotive2.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-automotive-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-automotive-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Building Materials Page Styling */
.main-building-materials {
  position: relative;
  height: 50vh;
  background-image: url("./images/building-materials.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-building-materials-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-building-materials-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Chemical Page Styling */
.main-chemical {
  position: relative;
  height: 50vh;
  background-image: url("./images/chemicals.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-chemical-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-chemical-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Energy Solutions Page Styling */
.main-energy-solutions {
  position: relative;
  height: 50vh;
  background-image: url("./images/energy.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-energy-solutions-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-energy-solutions-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Energy Machinery and Manufacturing Page Styling */
.main-engineering-machinery {
  position: relative;
  height: 50vh;
  background-image: url("./images/engineering-manufacturing.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-engineering-machinery-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-engineering-machinery-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Food and Beverage Page Styling */
.main-food-beverage {
  position: relative;
  height: 50vh;
  background-image: url("./images/food-beverage.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-food-beverage-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-food-beverage-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Live Animals Page Styling */
.main-live-animals {
  position: relative;
  height: 50vh;
  background-image: url("./images/live-animal.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-live-animals-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-live-animals-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Luxury and Fashion Page Styling */
.main-luxury-fashion {
  position: relative;
  height: 50vh;
  background-image: url("./images/luxury.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-luxury-fashion-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-luxury-fashion-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Motor sport Page Styling */
.main-motorsport {
  position: relative;
  height: 50vh;
  background-image: url("./images/motorsport.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-motorsport-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-motorsport-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Pharma Healthcare Page Styling */
.main-pharma-healthcare {
  position: relative;
  height: 50vh;
  background-image: url("./images/pharma2.jpg");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-pharma-healthcare-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-pharma-healthcare-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Projects Page Styling */
.main-projects {
  position: relative;
  height: 50vh;
  background-image: url("./images/minig.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-projects-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-projects-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Retail and Consumer Products Page Styling */
.main-retail-consumer {
  position: relative;
  height: 50vh;
  background-image: url("./images/consumer.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-retail-consumer-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-retail-consumer-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Technology Page Styling */
.main-technology {
  position: relative;
  height: 50vh;
  background-image: url("./images/technology.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-technology-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-technology-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Wine & Spirits Page Styling */
.main-wine-spirits {
  position: relative;
  height: 50vh;
  background-image: url("./images/wine-spirit.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-wine-spirits-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-wine-spirits-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* News Page Styling */
.main-news {
  position: relative;
  height: 50vh;
  background-image: url("./images/news.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-news-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-news-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/* Company Profile Page Styling */
.main-company-profile {
  position: relative;
  height: 50vh;
  background-image: url("./images/about.webp");
  background-size: cover;
  background-position: center;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
}
.main-company-profile-overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: rgba(0, 128, 0, 0.5);
}
.main-company-profile-content {
  position: relative;
  text-align: center;
  padding: 20px;
  z-index: 1;
}

/*Sidebar*/
#side-bar {
  background-color: var(--color1);
}

.w3-sidebar a {
  margin-top: 15px;
  font-size: 18px;
  color: var(--color2);
}

.w3-sidebar a:hover {
  background-color: var(--color2);
  color: var(--color1);
  border-radius: 0 10px 10px 0;
}
.page-content {
  margin-left: 23%;
}
.top-bar {
  background-color: var(--color1);
  border-radius: 0 0 40px 40px;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 3px 6px, rgba(0, 0, 0, 0.23) 0px 3px 6px;
  color: var(--color2);
}

/*For Mobile Screen*/
@media (max-width: 767px) {
  #image-fit {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    display: block;
  }
  .real {
    width: 100%;
  }

  .video-container {
    height: 130vh;
  }

  .content > h1 {
    margin-top: 60px;
    font-size: 35px;
  }
  .content > p {
    font-size: 12px;
  }
  nav li {
    display: none;
  }

  .list {
    display: block !important;
  }
  .motto {
    font-size: 14px !important;
  }

  .menu {
    display: none;
    flex-direction: column;
    width: 100%;
    position: absolute;
    top: 100px;
    right: 0;
    color: var(--color2);
    background-color: rgba(20, 146, 91, 0.9);
    padding: 30px;
    z-index: 1;
    height: 100vh;
  }
  .menu > a {
    padding: 20px;
    text-align: center;
    font-weight: 600;
  }
  #menu-item:hover {
    background-color: var(--color2);
    color: var(--color1);
  }
  .menu-icon {
    border: none;
    margin-right: 30px;
    font-size: 30px;
    background: none;
    color: var(--color2);
  }
  .menu-icon.close {
    display: block;
  }
  .menu.active {
    display: flex;
  }
  .ovx {
    overflow-x: scroll !important;
  }
  .story-body > img {
    width: 200px;
  }

  /*About us Page Styling */
  .main-about-3 {
    width: 100%;
  }
  .main-about-3 img {
    margin-top: 0;
  }

  /*Countries Page Styling */
  .main-countries-content > h3 {
    font-size: 50px;
  }
  .main-countries {
    height: 75vh;
  }
  .country img {
    width: 100%;
  }
  /*Airfreight*/
  .cargolux {
    width: 200px;
  }
  .testimony-scroll {
    overflow-x: scroll !important;
  }

  /*Sidebar */
  #side-bar {
    display: none;
  }
  .page-content {
    margin-left: 0;
  }

  /*Bottom Navbar*/
  #bottom-navbar {
    background-color: var(--color1);
  }

  #bottom-navbar a {
    color: var(--color2);
    text-align: center;
    padding: 10px;
  }

  #bottom-navbar a:hover {
    background-color: var(--color2);
    color: var(--color1);
  }
}

/*For Tablet Screen*/
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  nav li {
    display: none;
  }
  .menu {
    display: none;
    flex-direction: column;
    width: 100%;
    position: absolute;
    top: 100px;
    right: 0;
    color: var(--color2);
    background-color: rgba(20, 146, 91, 0.9);
    padding: 30px;
    z-index: 1;
    height: 100vh;
  }
  .menu > a {
    padding: 20px;
    text-align: center;
    font-weight: 600;
  }
  #menu-item:hover {
    background-color: var(--color2);
    color: var(--color1);
  }
  .menu-icon {
    border: none;
    margin-right: 30px;
    font-size: 30px;
    background: none;
    color: var(--color2);
  }
  .menu-icon.close {
    display: block;
  }
  .menu.active {
    display: flex;
  }
  #image-fit {
    width: 300px;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }

  .why-choose img {
    width: 200px; /* Fixed width for the images */
    height: 200px; /* Fixed height for the images */
  }
}

/*Making the plane icon to  move*/
.plane {
  position: absolute;
  left: 100px; /* Start off-screen */
  animation: move 5s linear infinite;
}
@keyframes move {
  0% {
    left: 100px;
    transform: rotate(0deg);
  }
  50% {
    left: 90%;
    transform: rotate(0deg);
  }
  100% {
    left: 100px;
    transform: rotate(180deg);
  }
}

/* Total Duty */
.duty-calc-box {
  border: 3px dotted var(--color1);
  padding: 10px;
}

.hover-zoom {
  transition: transform 0.3s ease-in-out;
}
.hover-zoom:hover {
  transform: scale(0.9);
}