@media (max-width: 1300px) {}

@media (max-width: 1120px) {}

@media (max-width: 767px) {}

@media (max-width: 992px) {
  .hero_area {
    min-height: auto;
  }


  .custom_nav-container .navbar-nav {
    padding-top: 15px;
  }


  .custom_nav-container .navbar-nav .nav-item .nav-link {
    padding: 5px 25px;
    margin: 5px 0;
  }

  .slider_section .detail-box h1 {
    font-size: 2.5rem;
  }

  .slider_section {
    padding: 75px 0;
    background-image: url('/static/images/Night sky bkgnd 3.png');
    background-size: cover; /* Ensures the image covers the container */
    background-position: center; /* Centers the image */
    background-repeat: no-repeat; /* Prevents the image from repeating */
    height: 100%; /* Ensure the item takes full height of the container */
    
   
  }

  .slider_section .carousel_btn-box a {
    position: unset;
    transform: none;
  }

  .about_section .img-box img {
    height: 10%;
    width: auto;
    min-width: 100%;
  }
}
/* Mobile-specific styles */
@media (max-width: 768px) {
  .slider_section .detail-box .btn-box {
    flex-direction: column; /* Stack buttons vertically */
    align-items: center; /* Center align buttons */
  }

  .slider_section .detail-box .btn-box .btn1 {
    width: 100%; /* Make buttons full width */
  }
}

@media (max-width: 768px) {
  .slider_section .detail-box .btn-box {
    flex-direction: column; /* Stack buttons vertically */
    align-items: center; /* Center align buttons */
  }

  .slider_section .detail-box .btn-box .btn1 {
    width: 100%; /* Make buttons full width */
  }
}

/* Mobile-specific styles */
@media (max-width: 768px) {
  .slider_section {
    padding-bottom: 20px; /* Adjust spacing if needed */
  }

  .slider_section .btn1 {
    display: block;
    width: 40%;
    margin-bottom: 10px; /* Space between buttons */
    margin-left:30%;
  }
}

@media (max-width: 576px) {
  .header_section .header_top .social_box {
    display: none;
  }

  .header_section .header_top .contact_nav a span {
    font-size: 15px;
  }

  .slider_section .detail-box {
    text-align: center;
  }

  .slider_section .detail-box .btn-box {
    justify-content: center;
  }

  .about_section .img-box {
    margin-top: 45px;
  }

  .contact_section .form_container {
    padding-left: 10px;
    padding-right: 10px;
  }

  .info_section .info_contact {
    margin: 15px 0;
  }

  .info_section .row>div {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
  }

  .info_section .info_main .rov>div {
    margin-bottom: 25px;
  }

  .info_section .social_box {
    margin-bottom: 25px;
  }

}

@media (max-width: 576px) {
  .header_section .header_top .contact_nav a span {
    display: none;
  }


  .carousel_btn-box {
    margin-top: 20px;
  }
}

@media (max-width: 480px) {}

@media (max-width: 420px) {}

@media (max-width: 376px) {}

@media (min-width: 1200px) {
  .container {
    max-width: 1170px;
  }
}


/* Media Queries for Responsive Design */
@media (max-width: 768px) {
  .carousel-caption-custom {
    padding: 15px;
  }
  .carousel-caption-custom h1 {
    font-size: 2rem;
  }
  .carousel-caption-custom p {
    font-size: 1rem;
  }
  .carousel-caption-custom .btn1 {
    padding: 8px 16px;
  }
  
}

@media (max-width: 576px) {
  .carousel-caption-custom {
    padding: 10px;
  }
  .carousel-caption-custom h1 {
    font-size: 2rem;
  }
  .carousel-caption-custom p {
    font-size: 15px;
  }
  .carousel-caption-custom .btn1 {
    padding: 8px 14px;
  }

  .carousel_btn-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
  }

  .carousel_btn-box .carousel-control-prev, 
  .carousel_btn-box .carousel-control-next {
    
    padding: -91px; /* reduce the padding around the icons */
    top: 1px;
    display: none;
    
    
  }
  
  .carousel_btn-box .carousel-control-prev i, 
  .carousel_btn-box .carousel-control-next i {
    font-size: 10px; /* reduce the font size of the icons */
    padding: 5px; /* reduce the padding around the icons */
    
    
  }
}

@media (max-width: 480px) {
  .carousel_btn-box .carousel-control-prev, 
  .carousel_btn-box .carousel-control-next {
    font-size: 10px; /* reduce the font size of the icons */
    padding: 3px; /* reduce the padding around the icons */
    
  }
  
  .carousel_btn-box .carousel-control-prev i, 
  .carousel_btn-box .carousel-control-next i {
    font-size: 12px; /* reduce the font size of the icons */
  }
}

@media (max-width: 768px) {
  .carousel-caption {
    position: static;
    transform: none;
    text-align: center;
    padding: 20px;
  }

  .carousel-caption h1 {
    font-size: 1.5rem;
  }

  .carousel-caption p {
    font-size: 0.9rem;
    margin-top: 10%;
  }

  .btn1 {
    padding: 8px 10px;
    font-size: 0.95rem;
  }
}

/* Add responsive styles for tablets and mobile */

@media screen and (max-width: 1024px) {
  .columns {
    gap: 5%;
  }
}

@media screen and (max-width: 768px) {
  .columns {
    flex-direction: column;
    gap: 0;
  }

  .column {
    max-width: 100%;
  }

  .column h2 {
    font-size: 1.3rem;
    margin-bottom: 3%;
  }

  .column p {
    font-size: 0.9rem;
  }
}



@media screen and (max-width: 480px) {
  .about_section .detail-box a {
    padding: 8px 30px;
  }

  .mission-container {
    padding: 10px;
  }

  .mission-image-container img {
    width: 100%;
  }

  .mission-text-container h1 {
    font-size: 1rem;
    margin-bottom: 3%;
    margin-top: 5%;
  }

  .mission-text-container .item {
    padding: 15px;
  }

  .mission-text-container .item h2 {
    font-size: 1rem;
  }

 
}



/* Mobile-specific styles */
@media (max-width: 768px) {
  .news-item {
    width: calc(50% - 40px);
  }

  .news h2 {
    font-size: 2em;
  }

  .news-item h3 {
    font-size: 1.2em;
  }

  .news-item p {
    font-size: 0.9em;
  }

  .cta-button2 {
    margin-top: 30px;
  }
}

@media (max-width: 480px) {
  .news-item {
    width: calc(100% - 40px);
  }

  .news h2 {
    font-size: 1.8em;
  }

  .news-item h3 {
    font-size: 1.1em;
  }

  .news-item p {
    font-size: 0.8em;
  }
}

/* Mobile-specific styles */
@media (max-width: 768px) {
  .coming-soon {
    height: 100%;
  }

  .coming-soon .soon-moon {
    width: 80px;
    height: 80px;
    top: 5%;
    right: 40%;
    
  }

  .coming-soon-content {
    padding: 20px;
  }

  .coming-soon h1 {
    font-size: 1.8em;
  }

  .coming-soon p {
    font-size: 0.9em;
  }

  .countdown div {
    font-size: 0.9em;
  }
}

@media (max-width: 480px) {
  .coming-soon .soon-moon {
    width: 60px;
    height: 60px;
  }

  .coming-soon h1 {
    font-size: 1.5em;
  }

  .coming-soon p {
    font-size: 0.8em;
  }

  .countdown div {
    font-size: 0.8em;
  }
}

/* Responsive Styles for carousel */
@media (max-width: 1200px) {
  .carousel-caption-custom h1 {
    font-size: 2.5rem;
  }
  .carousel-caption-custom p {
    font-size: 1.125rem;
  }
}

@media (max-width: 992px) {
  .carousel-caption-custom h1 {
    font-size: 2.3rem;
  }
  .carousel-caption-custom p {
    font-size: 1rem;
  }
  .carousel-caption-custom .btn1 {
    padding: 10px 25px;
  }
}

@media (max-width: 768px) {

  .carousel-caption-custom {
    position: absolute;
    top: 5%; /* Adjust this value as needed to control the vertical position */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 100%;
    color: #fff; /* Ensure the text color contrasts well with the background */
    padding: 0 15px; /* Add padding to ensure text isn't too close to the edges */
    z-index: 10; /* Ensure it appears above the image */
}


  .carousel-caption-custom .btn1 {
    padding: 10px 25px;
  }
}

@media (max-width: 576px) {
  .carousel-item {
    height: 70vh; /* Reduced height for mobile screens */
    min-height: 200px; /* Ensure a minimum height for small screens */

    
  }

  .carousel-caption-custom {
    position: absolute;
    top: 5%; /* Adjust this value as needed to control the vertical position */
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    width: 100%;
    color: #fff; /* Ensure the text color contrasts well with the background */
    padding: 0 15px; /* Add padding to ensure text isn't too close to the edges */
    z-index: 10; /* Ensure it appears above the image */
}
 

  .image-container img {
    display: block;
    width: 100%;
    height: 700px; /* Set image height to cover entire container */
    object-fit: cover; /* Ensure the image covers the container */
}
}