* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  scroll-behavior: smooth;
}
body {
  position: relative;
}
a {
  text-decoration: none;
}
a:hover {
  text-decoration: none !important;
}

/* main nav bar css  */
.main-header {
  position: sticky;
  top: 0;
  right: 0;
  padding: 10px 6%;
  z-index: 9999;
  /* background-color: transparent!important; */
  width: 98.9vw;
  transition: all 0.3s ease;
}
.main-header .header {
  display: flex;
  justify-content: end;
  align-items: center;
  gap: 30px;
}
.dropdown {
  position: static !important;
}
#loginModal,
#registerModal,
#IndustriesModal,
#IndustriesWebinarModal,
#jobPost,
#Apply-Job {
  z-index: 99999;
}
.form-control-div {
  position: relative;
  margin: 20px 0 26px;
  width: 100%;
}

.form-control-div input {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 2px solid black !important;
  display: block;
  width: 100%;
  padding: 12px 0;
  font-size: 18px;
  color: #000;
}

.form-control-div input:focus,
.form-control-div input:valid {
  outline: 0 !important;
  border-bottom-color: #851c81 !important;
}

.form-control-div label {
  position: absolute;
  top: 15px;
  left: 0;
  pointer-events: none;
}

.file-input {
  margin-top: 12px !important;
}

/* JavaScript */
.form-control-div label span {
  display: inline-block;
  font-size: 18px;
  min-width: 5px;
  transition: 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.form-control-div input:focus + label span,
.form-control-div input:valid + label span {
  color: #851c81;
  transform: translateY(-30px);
}

.dropdown-menu {
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
  margin-top: 0px !important;
  width: 100% !important;
  background: linear-gradient(
    38deg,
    rgb(219 0 243 / 40%) 6.42%,
    #210746 58.11%
  ) !important;
  color: #fff !important;
  z-index: 9999;
  transition: all 0.3s ease;
}
.dropdown-menu a {
  color: #fff !important;
}
.dropdown-menu a:hover {
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.6),
    0 0 20px rgba(255, 255, 255, 0.6), 0 0 30px rgba(255, 255, 255, 0.6),
    0 0 40px rgba(255, 255, 255, 0.6);
}
.line-divd {
  height: 4px;
  width: 30px;
  background: #851c81 !important;
  border-radius: 5px;
}

.main-header .header ul {
  display: flex;
  justify-content: center;
  align-items: center;
  list-style: none;
  gap: 30px;
}
.main-header .header ul li {
  display: flex;
  flex-direction: column;
}
.main-header .header ul li a {
  color: #ffffff;
  font-family: Inter;
  font-size: 16.515px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-transform: uppercase;
  cursor: pointer;
}
.customlink {
  display: flex !important;
  align-items: end;
}
.header-a-hover {
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.6),
    0 0 20px rgba(255, 255, 255, 0.6), 0 0 30px rgba(255, 255, 255, 0.6),
    0 0 40px rgba(255, 255, 255, 0.6);
}
/* .main-header .header ul li a:hover {
  color: #ffffff;
} */

.nav-icon-img {
  height: 25px;
  width: 25px;
  object-fit: contain;
}

 .header-btn {
  text-transform: uppercase;
  border-radius: 3.383px;
  border: 0.677px solid rgba(168, 168, 168, 0.69);
  background: #250821;
  color: #12f7ff;
  font-size: 16.515px;
  padding: 7px 35px;
  font-weight: 500;
  margin-bottom: 3px;

  display: inline-flex;
  justify-content: center;
  align-items: center;
  /* width: 150px; */
  transition: 0.6s;
  box-shadow: 0 0 0.5rem #12f7ff;
  border-radius: 5px;
  position: relative;
  overflow: hidden;
  z-index: 0;
  border: 2px solid #12f7ff;
}
.logout-btn {
  text-transform: uppercase;
  border-radius: 3.383px;
  border: 0.677px solid rgba(168, 168, 168, 0.69);
  background: #250821;
  color: #12f7ff;
  font-size: 16.515px;
  padding: 3px 15px;
  font-weight: 500;
  margin-bottom: 1px;

  display: inline-flex;
  justify-content: center;
  align-items: center;
  /* width: 150px; */
  transition: 0.6s;
  box-shadow: 0 0 0.5rem #12f7ff;
  border-radius: 5px;
  position: relative;
  overflow: hidden;
  /* z-index: 1; */
  border: 2px solid #12f7ff;
}
 .header-btn:hover,
.logout-btn:hover {
  color: #250821;
}
 .header-btn::before,
.logout-btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  /* background: var(--bg-color); */
  background: #12f7ff;
  width: 0%;
  height: 100%;
  z-index: -1;
  transition: 0.4s;
}
 .header-btn:hover::before,
.logout-btn:hover::before {
  width: 100%;
}

.user-profile-link-cont {
  position: absolute;
  background: linear-gradient(
    38deg,
    rgb(219 0 243 / 40%) 6.42%,
    #210746 58.11%
  ) !important;
  /* align-items: center; */
  width: 160px;
  border-radius: 8px;
  top: 83%;
  display: none;
  transition: all 0.2 ease-in;
}

.user-profile-link-cont ul {
  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
  gap: 20px !important;
  padding: 18px 0;
}
.user-profile-link-cont ul li a:hover {
  text-shadow: 0 0 10px rgba(255, 255, 255, 0.6),
    0 0 20px rgba(255, 255, 255, 0.6), 0 0 30px rgba(255, 255, 255, 0.6),
    0 0 40px rgba(255, 255, 255, 0.6);
}
.user-profile-link-cont.viewlink {
  display: block;
}

/* side nav bar css  */
.side-nav-bar-icon {
  position: sticky;
  top: 18%;
  left: 0;
  z-index: 9997;
  padding: 10px;
  background: linear-gradient(
    38deg,
    rgb(219 0 243 / 40%) 6.42%,
    #210746 58.11%
  );
  width: 55px;
  border-radius: 0 5px 5px 0;
  opacity: 0.8;
  transition: all 0.7s linear;
  cursor: pointer;
}
.side-nav-bar-icon:hover {
  opacity: 1;
}
.side-nav-bar-icon i {
  color: #fff;
  font-size: 30px;
}
.side-nav-bar {
  /* display: none; */
  height: 472px;
  width: 91px;
  border-radius: 0px 10px 10px 0px;
  /* background: #3b179e7a; */
  /* background: #3b179e; */
  background: linear-gradient(
    38deg,
    rgb(219 0 243 / 40%) 6.42%,
    #210746 58.11%
  );
  position: sticky;
  top: 18%;
  left: 0;
  z-index: 9997;
  display: none;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 30px;
  /* opacity: 0.8; */
  /* transition: all 0.3s linear; */
  transition: all 0.7s linear;
  cursor: pointer;
}
/* .side-nav-bar:hover{
  background: #3b179e;
  opacity: 1;
} */
.side-nav-bar img {
  height: 26px;
  object-fit: contain;
}
.side-nav-bar .side-nav-links a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}
.side-nav-bar .side-nav-links a p {
  color: #fff;
  font-family: Inter;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
  text-align: center;
}

/* .challenge,.program,.career-link{
  position: relative;
}
.challenge p,.program p,.career-link p{
  width: 350px;
  background: #2e0962;
 
  
  color: #fff;
  padding: 10px;
  text-align: left;
  display: none;
  position: absolute;
  border-radius: 8px;
  left: 50%;
  transform: translate(-50%, -50%);
}

.challenge:hover p{
  display: block;
  top: 190%;
}
.program:hover p{
  display: block;
  top: 350%;
}
.career-link:hover p{
  display: block;
  top: 350%;
} */

.profile_icon {
  height: 50px;
  width: 50px;
  border-radius: 50%;
  border: 1px solid #210746;
  background-color: #fff;
}
.profile_icon img {
  height: 100%;
  width: 100%;
  object-fit: cover;
  /* filter: invert(1); */
}

/* footer css  */
footer {
  background: linear-gradient(283deg, #000 -14.35%, rgba(0, 0, 0, 0.81) 97.92%);
  height: auto;
  display: flex;
  align-items: end;
  margin-top: 6rem;
}

.footer-container {
  width: 90%;
  margin: auto;
  position: relative;
}
.footer-dot {
  position: absolute;
  bottom: 20%;
  right: 0;
  z-index: 1;
  height: 150px;
  width: 200px;
  object-fit: contain;
}
.footer-main {
  display: flex;
}
.footer-sec1 {
  width: 25%;
  display: flex;
  flex-direction: column;
  gap: 40px;
}
.footer-para p {
  color: #9f9f9f;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
.footer-sec2 {
  width: 45%;
  display: flex;
  justify-content: center;
  gap: 60px;
}
.footer-sec2 .footer-links {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.footer-sec2 .footer-links ul {
  display: flex;
  flex-direction: column;
  gap: 20px;
  list-style: none;
  padding: 0;
}
.footer-sec2 .footer-links p {
  color: #9f9f9f;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.footer-sec2 .footer-links li a {
  color: #fff;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 500;
  line-height: normal;
}
.footer-sec3 {
  width: 30%;
  display: flex;
  justify-content: center;
  gap: 10px;
}
.footer-sec3 img {
  height: 40px;
  width: 40px;
  object-fit: contain;
  cursor: pointer;
}
.hr {
  height: 1px;
  width: 100%;
  background-color: #d9d9d9;
}
.footer-bottom p {
  color: #fff;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}
/* Scrollbar */
::-webkit-scrollbar {
  background-color: transparent;
  width: 10px;
}

::-webkit-scrollbar-thumb {
  background: linear-gradient(#21d4fd, #b721ff);
  border-radius: 100px;
}
.custom-alert {
  position: fixed;
  top: 80px;
  right: 25px;
  z-index: 99999;
}

.date-div {
  position: relative;
}
.date-div h6 {
  position: absolute;
  top: -10px;
  left: 0;
  font-family: Inter;
}
@media screen and (max-width: 958px) {
  .footer-sec2 {
    gap: 23px;
    width: 60%;
  }
  .footer-sec3 {
    gap: 6px;
    width: 15%;
  }
  .footer-dot {
    height: 110px;
    width: 149px;
  }
  .footer-sec3 img {
    height: 30px;
    width: 30px;
  }
}
.toggle-mobile-menu-div{
  /* display: flex; */
  justify-content: end;
  transition: all 0.3s ease;
  display: none;
}
.toggle-mobile-menu-div button{
  height: 30px;
  width: 30px;
  text-align: center;
  font-size: 20px;
  color: #fff;
  background: #00000000;
  border: 1px transparent;
  margin-top: 20px;
  margin-right: 20px;
  
}
.mobile-header{
  height: 100vh;
  width: 100%;
  background-color: #000;
  display: none;
}
.mobile-header.active-nav-mob{
  display: block;
}
.mobile-header .close-btn-div{
  display: flex;
  justify-content: end;
  margin-top: 25px;
  margin-right: 25px;
}
.mobile-header .close-btn-div button{
  height: 30px;
    width: 30px;
    text-align: center;
    font-size: 20px;
    color: #fff;
    background: #000;
    border: 1px transparent;
}
.mobile-nav-container{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-top: 30px;
}
.mobile-nav-container ul{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: self-start;
  gap: 20px;
  list-style: none;
}
.mobile-nav-container ul li{
 display: flex;
 justify-content: center;
 align-items: center;
 color: #fff;
 cursor: pointer;
}
@media screen and (max-width: 641px) {
  .main-header{
    padding: 0;
  }
  .main-header .header{
    display: none;
  }
  .toggle-mobile-menu-div{
    display: flex;
  }
  .footer-logo {
    text-align: center;
  }
  .footer-main {
    flex-direction: column;
    align-items: center;
    gap: 20px;
  }
  .footer-sec1 {
    width: 80%;
  }
}
