@media (min-width: 1900px) {

  .home-details .homeLogo {
    width: 450px;
  }

  .home-details .personAvtar {
    width: 275px;
  }

  .home-details {
    gap: 100px;
  }

  .mainNav ul .navBox {
    gap: 10px;
  }

  .mainNav ul .navBox img {
    width: 100px;
    height: 100px;
  }

  .mainNav ul .navBox h6 {
    font-size: 24px;
  }

  p {
    font-size: 24px;
  }

  .home-details p {
    font-size: 30px;
  }

  .socialBar a {
    width: 72px;
    height: 40px;
  }

  .socialBar a img {
    width: 40px;
    height: 40px;
    object-fit: contain;
  }

  .mainFooter .brandLogo img {
    width: 300px;
  }

  .pwrdBy p {
    font-size: 24px;
    padding-right: 50px;
  }

  .pwrdBy img {
    width: 200px;
  }

  .mainFooter .socialBar {
    gap: 50px;
  }

  .copyRight p {
    font-size: 20px;
  }

  .mainTitle {
    font-size: 36px;
  }

  .AccordionContainer .accordion-item .accordion-header button {
    font-size: 22px;
  }

  .personalInfo .name,
  .personalInfo .post-name,
  .personalInfo a {
    font-size: 26px !important;
  }

  .Roadmap-steps .nav-tabs {
    margin: 0 40px 90px;
  }

  .Roadmap-steps .nav-tabs button {
    width: 150px;
    min-width: 150px;
    height: 150px;
    font-size: 24px;
  }

  .Roadmap-steps .current-position {
    top: 200px;
    left: 140px;
    font-size: 24px;
  }

  .AccordionDescription .mainTitle {
    font-size: 24px;
  }
}

@media (max-width: 991.98px) {

  header {
    position: fixed;
    gap: 20px;
    padding: 10px 20px;
    z-index: 99;
    transition: all 0.3s ease-in-out;
    min-height: 70px;
  }

  .sticky-header {
    background: #000;
  }

  .ToggleMenu {
    display: flex;
  }

  .socialBar {
    gap: 30px;
  }

  .fitHeader {
    padding-top: 70px !important;
  }

  .mainNav {
    position: fixed;
    width: 50%;
    opacity: 0;
    z-index: 12;
  }

  .leftNav {
    transform: translateX(-100%);
  }

  .rightNav {
    transform: translateX(100%);
  }

  .mobileNav-show .mainNav {
    transform: translateX(0);
    opacity: 1;
  }

  .mobileNav-show {
    overflow: hidden;
  }

  .mobileNav-show .navOverlay {
    position: fixed;
    top: 0;
    left: 0;
    background: rgb(0 0 0 / 85%);
    width: 100%;
    height: 100vh;
    z-index: 11;
    backdrop-filter: blur(1px);
    transition: all 0.3s ease-in-out;
  }

  .pageLayout {
    max-width: 100%;
  }

  .home-details .homeLogo {
    width: 290px;
  }

  .home-details p br {
    display: none;
  }

  .home-details {
    gap: 50px;
  }

  .container-fluid {
    padding: 0 30px;
  }

  .mainFooter {
    padding: 20px;
    min-height: 117px;
  }

  .copyRight {
    padding: 5px 20px;
  }

  .bodylayout,
  .pageLayout,
  .homeInfo,
  .center-contentBody,
  .Roadmap-container,
  .benefits-conatiner,
  .teams-container {
    min-height: calc(100vh - 145px);
  }

  .teams-container {
    padding: 20px 0;
    display: flex;
    align-items: center;
  }

  .Roadmap-steps .nav-tabs {
    margin: 0 0px 90px;
  }

  .Roadmap-steps .nav-tabs button {
    width: 80px;
    min-width: 80px;
    height: 80px;
    font-size: 20px;
  }

  .Roadmap-steps .tab-content {
    padding: 0 30px;
  }
}

@media (max-width: 767.98px) {

  p {
    font-size: 16px;
  }

  .InroScreen video {
    object-fit: fill;
  }

  .mainFooter .brandLogo img {
    width: 100%;
  }

  .mainFooter {
    flex-wrap: wrap;
  }

  .mainFooter .brandLogo {
    width: calc(50% - 20px);
  }

  .mainFooter .pwrdBy {
    width: 100%;
    text-align: center;
    order: 3;
    padding: 10px 0 0;
  }

  .mainFooter .socialBar {
    gap: 20px;
    width: calc(50% - 20px);
  }

  .mainFooter .socialBar a {
    width: 25px;
    height: 25px;
  }

  .mainFooter .pwrdBy p {
    padding: 0;
    font-size: 13px;
  }

  .mainFooter .pwrdBy img {
    width: 100px;
  }

  .container-fluid {
    padding: 30px 20px;
  }

  .home-details {
    padding: 20px 0;
  }

  .bodylayout,
  .pageLayout,
  .homeInfo,
  .center-contentBody,
  .Roadmap-container,
  .benefits-conatiner,
  .teams-container {
    min-height: 100vh;
  }

  .visionDetails {
    padding-bottom: 0;
  }

  .Roadmap-steps .tab-content {
    padding: 0;
  }

  .benefits-conatiner {
    flex-wrap: wrap;
  }

  .benefits-conatiner .right-details {
    width: 100%;
    max-width: 100%;
  }

  .pt-130 {
    padding-top: 30px !important;
  }

  .FAQs-container {
    padding: 0;
  }

  .AccordionContainer .accordion-item .accordion-header button {
    font-size: 16px;
    line-height: normal;
  }

  .Roadmap-steps {
    padding: 0;
  }

  .Roadmap-steps .nav-tabs button {
    width: 50px;
    min-width: 50px;
    height: 50px;
    font-size: 16px;
  }

  .Roadmap-steps .nav-tabs .nav-item:last-child button div i {
    font-size: 20px;
  }

  .Roadmap-steps .current-position {
    top: 100px;
    left: 40px;
  }

  .Roadmap-stepContent .fullVideo .person-img {
    width: 100px;
  }

  .copyRight p {
    text-align: center;
  }

}


@media (max-width: 320px) {

  header {
    min-height: 50px;
  }

  .fitHeader {
    padding-top: 50px !important;
  }

  .ToggleMenu img {
    width: 20px;
    height: 20px;
  }

  .socialBar {
    gap: 20px;
  }

  .socialBar a {
    width: 26px;
    height: 22px;
  }

  .home-details .homeLogo {
    width: 200px;
  }

  .home-details p {
    font-size: 16px;
  }

  .mainTitle {
    font-size: 20px;
    margin: 0 0 30px;
  }

  .AccordionDescription .mainTitle {
    font-size: 16px;
  }

  .AccordionContainer .accordion-item .accordion-header button {
    font-size: 16px;
    padding: 12px;
  }

  .Roadmap-steps .nav-tabs button {
    width: 40px;
    min-width: 40px;
    height: 40px;
    font-size: 12px;
  }

  .Roadmap-steps .current-position {
    font-size: 14px;
  }
}