@media (min-width: 992px) {
    .facts {
        position: relative;
        margin-top: -150px;
        z-index: 1;
    }
    .navbar-dark {
        position: absolute;
        width: 100%;
        top: 0;
        left: 0;
        border-bottom: 1px solid rgba(256, 256, 256, .1);
        z-index: 2;
    }
    
    .sticky-top.navbar-dark {
        position: fixed;
        background: #FFFFFF;
        width: 100%;
    }

    .navbar-dark .navbar-nav .nav-link::before {
        position: absolute;
        content: "";
        width: 0;
        height: 2px;
        bottom: -1px;
        left: 50%;
        background: var(--primary);
        transition: .5s;
    }

    .navbar-dark .navbar-nav .nav-link:hover::before,
    .navbar-dark .navbar-nav .nav-link.active::before {
        width: 100%;
        left: 0;
    }

    .navbar-dark .navbar-nav .nav-link.nav-contact::before {
        display: none;
    }

    .sticky-top.navbar-dark .navbar-brand h1 {
        color: var(--primary);
    }
}
@media (min-width: 768px) {
    .footer-about {
        margin-bottom: -75px;
    }
}

@media screen and (max-width:1399px){
    .extra-info-list a {
        padding: 10px !important;
        font-size: 14px;
    }
}

@media screen  and (max-width:1199px){
    .navbar-dark .navbar-nav .nav-link{font-size: 14px;}
     .navbar-nav {gap: 15px; padding: 0 10px;}
     .extra-info-list a{font-size: 12px;}
     .extra-info-list{gap: 5px;}

}


@media screen and (max-width:1023px){
    .hydrogen-box h3 {font-size: 20px;}
    .hydrogen-box p{font-size: 14px;}
    .hydrogen-box ul li{font-size: 14px;}
    .conference-box{padding: 10px !important;}
    .conference-box h4{font-size: 20px;}
    .join-hydrogen a {font-size: 14px;}
    .conference-box{height: 430px;}
    .banner-text {max-width: 768px;}
}

@media (max-width: 991px) {
    .map iframe{height: 350px !important;}
    .conference-box {height: 396px;}
    .sticky-top.navbar-dark {
        position: relative;
        background: #FFFFFF;
        }
        .navbar-collapse{background-color: aliceblue;}
        .navbar-expand-lg{padding-bottom: 10px;}
    .navbar-dark .navbar-nav .nav-link,
    .navbar-dark .navbar-nav .nav-link.show,
    .sticky-top.navbar-dark .navbar-nav .nav-link {
        padding: 10px 0;
        /* color: var(--dark); */
    }

    .funt-slotion-col-img {
        text-align: center;
    }

    .funt-slotion-col-img img {
        width: 100%;
        height: 353px;
    }
    .project-heading h5{font-size: 14px;}
    .project-heading h2{font-size: 20px;}
    .icone {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .project-text-main {bottom: 0;}
    #banner-section .carousel-inner{height: 470px;}
    .banner-text {max-width: 570px;}
    .banner-text p{font-size: 13px;}
    .banner-text h1{font-size: 20px;}
    .banner-text a{padding: 10px  20px!important; font-size: 14px;}
    .hydrogen-img-col {height: 400px;}

 .navbar-nav .nav-link{color: black !important;}

    .navbar-dark .navbar-brand h1 {
        color: var(--primary);
    }
    .section-title h2 {font-size: 22px;}
    .section-title h3 {font-size: 18px;}
    /* .navbar-collapse{background-color: #EEF9FF;} */
    .h2-icone-col img{width: 95px;}
    .bg-header{height: 400px;}
    .enttend-col {height: 320px;}
    .attend-box {height: 238px;}
    .visit-col-img,.exhibit-col {height: 350px;}
    /* .visit-col-img img{height: 100%;} */
}

@media screen and (max-width:767px){
    .attend-box{height: 269px;}
    .conference-box{height: 250px;}
    #conference-contect-section h5{font-size: 16px;}
    #banner-section .carousel-inner{height: 390px;}
    .carousel-caption h1 {font-size: 22px;}
    .banner-text p{font-size: 12px;}
    .banner-text{max-width: 500px;}
    .project-main{padding: 20px 10px !important;}
    .project-heading h2 {font-size: 15px;}
    .icone{width: 30px; height: 30px;}
    .carousel-control-prev-icon, .carousel-control-next-icon{height: 24px; height: 24px;}
    .contect-text{gap: 20px;}
    .contect-text p{max-width: 300px;}
    .contect-text{margin-bottom: 20px !important;}
}

@media (max-width: 480px) {
    .carousel-caption h1 {font-size: 16px;}
    .banner-text p{font-size: 11px;}
    .banner-text{max-width: 304px;}
    .project-heading h5{font-size: 12px;}
    .icone{width: 23px; height: 23px;}
    .project-heading h2{font-size: 12px;}
    .project-main {padding: 5px !important;}
    .hydrogen-img-col{height: 300px;}
    .section-title h2{font-size: 20px;}
    .tob-header{padding: 40px 0;}
    .social-icons-main{display: flex; justify-content: center;}
    .extra-info-list{margin: 0;}
    .extra-info-list a {font-size: 9px;}
    .icone{width: 40px; height: 40px;}
    .conference-box {height: 328px;}
    .conference-box h4{font-size: 16px;}
    .conference-box p{font-size: 15px;}
    #conference-section-future{padding: 30px 0;}
    #conference-contect-section h5 {font-size: 12px;}
    #conference-contect-section{padding: 30px 0;}
    .navbar-nav{gap: 0;}
    .bg-header{height: 214px;}
    .contect-text h2{font-size: 20px;}
    .attend-box{height: 370px;}
    #reasons-section{padding:  0;}
    #join-hydrogen-section{padding: 30px 10px;}
    .back-to-top{right: 10px;}
    .footer-bottom  p{font-size: 13px;}
    .project-main{flex-direction: column; gap: 0;}
    div:where(.swal2-container) h2:where(.swal2-title){font-size: 20px;}
    .enttend-col {height: 190px;}
    .section-title{margin-bottom:30px !important;}
    .blog-img{height: 180px;}
}