nav {
  height: 100px;
  background: rgb(2, 0, 36);
  background: linear-gradient(
    180deg,
    rgb(2 0 36 / 41%) 11%,
    rgba(9, 9, 121, 0) 77%,
    rgba(0, 212, 255, 0) 100%
  );
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}

.nav-white {
  background: white;
  transition: 0.3s ease-in-out;
  box-shadow: 1px 1px 6px #00000017;
}
nav .menu {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
nav .menulink {
  text-decoration: none;
  text-shadow: 1px 1px 4px #000000b3;
  color: white;
}
.menulink-black {
  text-shadow: none !important;
  color: black !important;
}
.menulink-black.active {
  color: #003aab !important;
  font-weight: 500;
}

nav .left {
  display: flex;
  align-items: center;
  width: 100%;
}
nav .left .menu-list {
  width: 85%;
  display: flex;
  justify-content: space-evenly;
}

nav .left .menu-list a:hover {
  display: block;
transform: translateY(-7px);
  transition: 0.3s ease-in-out;
  color: white;
}
nav .left .logo img {
  width: 100px;
}

nav .right .lang {
  border: white 1px solid;
  border-radius: 50px;
  width: 88px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: white;
}

nav .right img {
  width: 16px;
  margin-right: 0.25rem;
}
.lang-black {
  border: rgb(0, 0, 0) 1px solid !important;
  color: black !important;
  transition: 0.3s ease-in-out;
}
.offcanvas a,
.offcanvas a:hover {
  color: black;
}
.offcanvas ul {
  margin: 0;
  padding: 0;
}
.offcanvas li {
  list-style-type: none;
  padding: 1rem 1.5rem;
  border-bottom: 1px #96969624 solid;
}
.offcanvas li img {
  width: 22px;
}
.offcanvas-header {
  box-shadow: 0px 0px 6px #00000026;
  height: 4rem;
}
.offcanvas-body {
  padding: 0 !important;
}

footer {
  background-color: #1a2782;
  color: white;
  padding: 2rem 0 0 0;
}
footer .text {
  margin: 0 0 0.75rem 0;
}
footer .name {
  font-size: 22px;
  font-weight: 600;
}
footer .address,
footer .email,
footer .tel {
  font-size: 18px;
  font-weight: 200;
}
footer a,
footer a:hover {
  color: white;
  text-decoration: none;
}
footer .social i {
  font-size: 20px;
}
footer .social {
  display: flex;
  margin: 3rem 0 1rem 0;
}
footer .social .box {
  width: 40px;
  height: 40px;
  display: grid;
  place-items: center;
  border: 1px white solid;
  border-radius: 50px;
  margin-right: 0.75rem;
}
footer .social .box:hover {
  background-color: white;
  transition: 0.3s ease-in-out;
}
footer .social .box:hover i {
  color: #1a2782;
  transition: 0.3s ease-in-out;
}

footer .menu {
  margin: 1.5rem 0;
  font-size: 18px;
  font-weight: 200;
}

footer .menu a:hover {
  color: white;
}

@media (max-width: 991px) {
  nav {
    position: fixed;
    top: 0;
    background: white;
    height: 4rem;
    justify-content: space-between;
    padding: 0 5%;
    box-shadow: 0px 0px 6px #00000026;
    z-index: 10;
  }
  nav .logo img,
  .offcanvas .logo img {
    width: 70px;
  }
  nav a {
    color: black;
  }
  nav .lang img {
    width: 22px;
  }
  nav .lang-black {
    border: none !important;
  }
  nav .toggle i {
    font-size: 26px;
    margin-left: 1rem;
  }

  footer {
    padding: 2rem 0 0 0;
    text-align: center;
  }
  footer .social {
    justify-content: center;
  }
  footer .name {
    font-size: 15px;
  }
  footer .address,
  footer .email,
  footer .tel {
    font-size: 16px;
  }
  footer .social {
    margin: 1rem 0;
  }
}
