body {
        margin: 0;
        padding: 0;
        font-family: Georgia, serif;
    }

    .main-div {
        width: 100%;
        height: 400px;
        /* border: 2px solid red; */
        color: white;
        /* background-image: url('assets/images/satta_king.png'); */
        background: url('<?php echo base_url('assets/images/satta_king.png'); ?>') center/cover no-repeat;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        display: flex;
        flex-direction: column;
        justify-content: center; /* Center content vertically */
        align-items: center;
        z-index: 7; /* Center content horizontally */
        position: relative;
    }

    .main-div > .content {
        background-color: rgba(0, 0, 0, 0.7); /* Background becomes transparent but the content is not */
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        position: absolute;
        z-index: 10; /* Ensure content is above the background */
    }

    h1 {
    color: yellow;
    text-align: center;
    margin-top: 30px;
    letter-spacing: 3px;
    font-size: 2.8rem;
    padding-bottom: 10px; /* Adds space between text and underline */
    text-decoration: underline; /* Adds underline below the heading */
    text-decoration-color: yellow; /* Sets the color of the underline */
    text-decoration-thickness: 3px; /* Sets the thickness of the underline */
   }


    .aaj {
        color: white;
        text-align: center;
        margin-top: 15px;
        letter-spacing: 1px;
        font-size: 2.5rem; /* Set relative font size */
    }

    /* WhatsApp Icon Styling */
    .whatsapp-icon {
        font-size: 2.5rem;
        color: white;
        background-color: green;
        border-radius: 10px;
        display: inline-flex;
        align-items: center;
        padding: 10px 20px;
        margin-top: 35px;
        cursor: pointer;
        text-align: center;
        border-radius: 12px;
        transition: all 0.3s ease;
        border:2px solid white;
    }

    .whatsapp-icon span {
        color: white;
        font-size: 1rem;
        margin-left: 10px;
        text-transform: capitalize;
    }

    .whatsapp-icon:hover {
        background-color: #25D366;
        font-size: 2.8rem;
    }

    /* Button Styles */
   /* Default button style */
.btn {
    background: linear-gradient(to right, rgb(212, 101, 73), #feb47b);
    padding: 20px;
    text-align: center;
    font-weight: bold;
    color: darkred;
    font-size: 1.5rem;
    border-radius: 10px;
    margin-top: 25px;
    transition: all 0.3s ease;
    border: 2px solid white;
    cursor: pointer;
    width: 20%; /* This is the width that can be changed for responsiveness */
}

/* Hover effect */
.btn:hover {
    font-size: 1.2rem;
    background: linear-gradient(to right, #feb47b, #ff7e5f);
    color: darkred;
    border: 2px solid #feb47b;
}

/* Make button width 100% on smaller screens */
@media (max-width: 768px) {
    .btn {
         /* Full width on smaller screens like tablets */
        padding: 15px;
        font-size: 1.2rem; /* Slightly smaller font size for mobile */
    }
}

/* Further adjustments for mobile devices */
@media (max-width: 480px) {
    .btn {
        width: 100%; /* Full width on small screens */
        padding: 12px;
        font-size: 1rem; /* Adjust font size for smaller screens */
    }
}


    /* Media Queries for responsiveness */
    @media (max-width: 768px) {
        h1 {
            font-size: 1.5rem;
        }

        .aaj {
            font-size: 1.5rem;
        }

        .whatsapp-icon {
            font-size: 2rem;
            padding: 8px 15px;
        }

        .whatsapp-icon span {
            font-size: 0.9rem;
        }

        button {
            font-size: 1.2rem;
            padding: 15px;
        }
    }

    @media (max-width: 480px) {
        h1 {
            font-size: 1.2rem;
        }

        .aaj {
            font-size: 1.2rem;
        }

        .whatsapp-icon {
            font-size: 1.8rem;
            padding: 6px 12px;
        }

        .whatsapp-icon span {
            font-size: 0.8rem;
        }

        button {
            font-size: 1rem;
            padding: 12px;
        }
    }