﻿<style>
        .header-banner {
            width: 100%;
            height: 300px;
            background-image: url('images/header-desktop.jpg');
            background-size: cover;
            background-position: center;
        }




        /* Mobile header image */
        @media (max-width: 768px) {
            .header-banner {
                background-image: url('images/header-mobile.jpg');
                height: 200px;
            }
        }


        /*----Hon'ble Ministers----*/
        /* Minister images */
        .minister-img {
            width: 120px;
            margin: 0 auto;
            display: block;
            margin-bottom: 10px;
        }

        /* Text below images */
        .minister-text {
            margin-top: 5px;
        }

        /* Optional: adds spacing between each minister box on small screens */
        @media (max-width: 768px) {
            .minister-text {
                margin-bottom: 20px;
            }
        }


        /*----Desk Of Director----*/
        /* Director image */
        .director-img {
            width: 120px;
            margin: 0 auto 10px auto;
            display: block;
        }

        /* Name + designation block */
        .director-info {
            margin-top: 10px;
        }

        /* Paragraph padding */
        .director-text {
            padding: 10px;
        }

        /* Optional spacing on small screens */
        @media (max-width: 767px) {
            .director-info {
                margin-bottom: 20px;
            }
        }


        /*----Cancer Samiksha----*/
        /* Full width panel */
        .panel-full {
            width: 100%;
        }

        /* Cancer Samiksha main logo */
        .cs-logo {
            width: 50%;
            margin: 0 auto;
            display: block;
        }

        /* India GIF container */
        .cs-india-box {
            margin-top: 15px;
        }

        /* India GIF image */
        .cs-india-img {
            width: 50%;
            margin: 0 auto;
            display: block;
        }

        /* Button box spacing */
        .cs-btn-box {
            margin-top: -10px;
            margin-bottom: -10px;
        }


         /*----Important Links----*/
        /* Important Links panel height */
        /* Remove extra row and column spacing */
.no-margin {
    margin: 0 !important;
}
.no-padding {
    padding: 0 !important;
}

/* Panel spacing reduction */
.panel-imp-links {
    margin-bottom: 10px;
}

/* Reduce header height */
.imp-header {
    padding: 8px 15px !important;
}
.imp-header-title h4 {
    margin: 0;
    font-size: 18px;
}

/* Reduce inside box padding */
.imp-links-box {
    padding: 8px 12px !important;
}

/* Reduce link item spacing */
.imp-item {
    padding: 5px 0 !important;
    display: block;
}


        /* Remove bottom border from last link */
        .no-border {
            border-bottom: none !important;
        }

        /*----Visitors Count----*/
        /* Center alignment for the whole box */
        .move-right {
    margin-left: 40px;   
}

        .visitor-box {
            text-align: center;
        }

        /* Title spacing */
        .visitor-title {
            margin-bottom: 5px;
            display: block;
        }

        /* Visitor image styling */
        .visitor-img {
            width: 70px;
            margin: 0 auto 5px auto;
            display: block;
        }

        /* Spacing for the red badges */
        .visitor-badge {
            margin-bottom: 20px;
            display: inline-block;
        }


        /*----Director General----*/
        /* DG Image */
        .dg-img {
            width: 120px;
            margin: 0 auto;
            display: block;
            margin-bottom: 10px;
        }

        /* Empty space paragraph (was <br><br>) */
        .dg-empty-text {
            margin-top: 20px;
            margin-bottom: 20px;
        }

        /* Right side text box */
        .dg-text {
            padding: 0px;
            margin-top: 0px;
        }

        /* somewhere in your CSS file or <style> block */
        .taller-panel .panel-body {
            min-height: 235px; /* adjust as needed */
        }

        /* Name margin (was margin-top:70px) */
        .dg-name {
            display: inline-block;
            margin-top: 20px;
        }

        /*----objective----*/
        /* For spacing instead of <br> */
        .mt-10 {
            margin-top: 10px;
        }

        /* Styling for the logo image */
        .obj-image {
            float: left;
            width: 150px;
            margin-right: 15px;
        }

        /* Paragraph spacing */
        .obj-text {
            margin-bottom: 3px;

        }

        /* Button spacing */
        .obj-btn {
            margin-top: 4px;
            margin-bottom: 15px;
            display: inline-block;
        }

        /*----ncdir film ----*/
        /* Responsive video styling */
        .video-responsive {
            max-width: 100%;
            width: 80%;
            display: block;
            margin: 0 auto;
            border-radius: 4px; /* optional */
        }

        /*----Latest updates----*/
        /* Background settings for the section */
        .gallery-bg {
            background-size: cover;
            background-attachment: fixed;
        }

        /* Container spacing adjustments */
        .gallery-container {
            margin-top: -30px;
            margin-left: 0;
            margin-right: -30px;
        }

        /* Update text formatting */
        .update-text {
            margin-bottom: 4px;
            overflow: hidden;
        }

        /* Image styling in marquee updates */
        .update-img {
            float: left;
            width: 170px;
           margin-right: 10px;
        }

        /* Divider hr style */
        .divider {
            margin: 6px 0;
            height: 1px;
            background-color: #e6e1d5;
            border: none;
        }

        /* View buttons */
        .view-btn {
            cursor: pointer;
            
        }

        /* Optional: Clear float for safety */
        .update-text::after {
            content: "";
            display: block;
            clear: both;
            margin-bottom:10px;
        }

        /*----Ph.D Degree Admission Notice----*/
        /* Move panel up slightly */
        .phd-box {
            margin-top: -20px;
        }

        /* Body area: padding + border */
        .phd-card-body {
            padding: 15px;
            padding-bottom: 5px !important;
            border: 1px solid #d9d9d9;
            border-radius: 3px;
        }

        /* Image styling */
        .phd-img {
            cursor: pointer;
            border-radius: 4px;
        }


        /* Spacing above description text */
        .phd-link-box {
            padding-top: 10px;
        }

        /* Paragraph spacing & overflow */
        .phd-para {
            margin-bottom: 4px;
            overflow: hidden;
        }

        /* Link styling (replaces inline border:0 & padding) */
        .phd-link {
            border: 0 !important;
            padding: 4px !important;
            display: block;
        }

        /*----Hospital Based Cancer Registry (HBCR)----*/
        /* HBCR box spacing */
        .hbcr-box {
            margin-bottom: 20px;
        }

        /* HBCR header */
        .hbcr-header h4 {
            padding-left: 10px; /* replaces &nbsp;&nbsp; */
            margin: 0;
            padding-top: 10px;
            padding-bottom: 10px;
        }

        /* HBCR links */
        .hbcr-link {
            display: block;
            border: 1px solid #e6e6e6;
            padding: 8px 12px;
            margin-bottom: 5px;
            text-decoration: none;
            color: inherit;
            border-radius: 4px;
            transition: background 0.3s;
        }

            .hbcr-link:hover {
                background-color: #f2f2f2;
            }


        /*----Achievement ----*/
        /* Achievement images */
        .achievement-img {
            float: left;
            width: 150px;
            margin-right: 10px;
            margin-bottom: 10px;
        }

        /* Achievement text paragraphs */
        .achievement-text {
            margin-bottom: 4px;
            overflow: hidden;
        }

        /* Achievement buttons */
        .achievement-btn {
            cursor: pointer;
            display: inline-block;
            margin-top: 5px;
        }

        /* Custom HR styling */
        .achievement-hr {
            margin: 6px 0;
            height: 1px;
            background-color: #e6e1d5;
            border: none;
            clear: both;
        }




        /*----Quick Links Section ----*/
        .quick-links-section {
            border-radius: 2px;
            padding: 20px 0;
        }

        .quick-links-buttons a {
            margin: 5px;
        }

        /* National Links Header */
        .national-links-header {
            background-color: #f0ad4e !important;
            color: #003B58 !important;
            text-decoration: none;
        }

        /*----National Website Links----*/
        /*National Links Images*/
        .link-img {
            width: 150px;
            margin: 0 auto 10px auto;
            display: block;
        }

        .custom-width {
            width: 100%;
        }

        /* Adjust spacing for national links row */
        .national-links-row {
            margin-top: 10px;
            margin-bottom: 6px;
        }

        /* Responsive tweaks */
        @media (max-width: 768px) {
            .link-img {
                width: 100px;
                margin-bottom: 15px;
            }

            .quick-links-buttons a {
                margin-bottom: 10px;
            }
        }

         /*----marquee-container----*/
         .marquee-container {
        display: flex;
        align-items: center;
        background: #f74349;
        color: #fff;
        font-size: 15px;
        padding: 3px;
    }

    .announcement-box {
        display: flex;
        align-items: center;
        background: #0e4066;   /* Yellow */
        color: #000;
        font-weight: bold;
        padding: 4px 10px;
        border-radius: 4px;
        margin-left: 20px;
        margin-right: -5px;
        white-space: nowrap;
        background:#260223; 
        color:yellow; 
        font-weight:bold; 
        font-family:Arial;
    }

    .marquee-text {
        flex: 1;
    }

    .marquee-button {
        background: #f2f2f2;   
        color: #f2f2f2;           
        border: none;
        border-radius: 2px;
        padding: 1px 3px;
        margin-left: 8px;
        cursor: pointer;
        font-weight: bold;
        font-size: 17px;
    }



    header .fill {
    width: 100%;
    height: 450px;     /* change height as needed */
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

    .carousel-control {
    background: none !important;
    width: 5%;
    text-shadow: none;
}

.arrow-text {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    font-size: 60px;
    color: white;
    font-weight: bold;
    
}

.custom-arrow-left .arrow-text {
    left: 50px;

}

.custom-arrow-right .arrow-text {
    right: 50px;
}

/* Center carousel indicators */
.carousel-indicators {
    bottom: 20px; /* distance from bottom of carousel */
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    justify-content: center;
    padding-left: 0;
    margin: 0;
    list-style: none;
}


.carousel-indicators li {
    display: inline-block;
    width: 12px !important;
    height: 12px !important;
    margin: 0 5px !important;
    background-color: transparent !important;
    border: 2px solid #fff !important; /* white hollow circle */
    border-radius: 50% !important;
    cursor: pointer;

}

.carousel-indicators .active {
    background-color: #fff !important; /* filled white circle */
    border-color: #fff !important;

}



    </style>