<style>
	 .btn1-login1.caawiye-button1:hover {
        background-color: #005f8c; /* Darker shade of blue for hover */
        color: #ffffff; /* Maintain white text */
        transform: scale(1.05); /* Slightly enlarge button on hover */
    }
	    /* General Styles */
    .caawiye-question-details input[type="text"] {
        padding: 10px;
        border: 1px solid #ccc;
        border-radius: 5px;
        width: 70%; /* Default for larger screens */
        transition: all 0.3s ease; /* Smooth transition for responsiveness */
    }

    @media (max-width: 1024px) {
        /* Tablet and Mobile Styles */
        .caawiye-question-details input[type="text"] {
            width: auto; /* Adjust width for smaller screens */
        }
    }

    /* Hero Section */
    .hero-wrapper {
        min-height: auto; /* Allow height to adjust automatically */
        height: auto; /* Fit content naturally */
        width: 100%; /* Full width of the device */
        background-size: cover; /* Ensures the image covers the full area */
        background-repeat: no-repeat;
        background-position: center;
        border-radius: 20px;
        overflow: hidden;
        display: flex;
        align-items: start;
        justify-content: start;
        text-align: start;
        padding: 7px; /* Adjust padding for better spacing */
    }

    .cta-banner h2 {
        font-size: 25px; /* Smaller title text for tablets/mobiles */
        padding-bottom: 10px;
		padding-top: 10px;
		padding: 7px; /* Adjust padding for better spacing */
    }
	.cta-banner__title {
        font-size: 25px;
        font-weight: bold;
        margin: 10px 0;
        line-height: 1.5;
    }

    .cta-banner__description {
        font-size: 16px;
        line-height: 1.8;
        margin: 8px 0;
    }
    .cta-banner h6 {
        font-size: 14px; /* Reduce description font size */
        line-height: 1.4; /* Adjust line height for readability */
        padding: 10px; /* Reduce horizontal padding */
    }

    .btn1-login1.caawiye-button1 {
        background-color: #0073aa;
        color: #fff;
        border-radius: 20px;
		padding: 10px 20px; margin-top: 10px; margin-bottom: 20px; margin-left: 40px;
        text-decoration: none;
        display: inline-block;
        transition: all 0.3s ease;
    }

    .btn1-login1.caawiye-button1:hover {
        background-color: #005f8c;
        transform: scale(1.05);
    }
    .btn1-login1.caawiye1-button1:hover {
        background-color: #005f8c; /* Darker shade of blue for hover */
        color: #ffffff; /* Maintain white text */
        transform: scale(1.05); /* Slightly enlarge button on hover */
    }
/* Ensure text stands out */
.cta-banner {
    color: #fff;
}

/* Responsive Design for Mobile and Tablet */
@media (max-width: 768px) { /* Tablets and smaller */
    .hero-wrapper {
        min-height: auto; /* Allow height to adjust automatically */
        height: auto; /* Fit content naturally */
        width: 100%; /* Full width of the device */
        background-size: cover; /* Ensures the image covers the full area */
        background-repeat: no-repeat;
        background-position: center;
        border-radius: 20px;
        overflow: hidden;
        display: flex;
        align-items: start;
        justify-content: start;
        text-align: start;
        padding: 7px; /* Adjust padding for better spacing */
    }
    .cta-banner h2 {
        font-size: 24px; /* Smaller title text for tablets/mobiles */
        padding-bottom: 10px;
		padding-top: 10px;
		padding: 7px; /* Adjust padding for better spacing */
    }
	.cta-banner__title {
        font-size: 25px;
        font-weight: bold;
        margin: 10px 0;
        line-height: 1.5;
    }

    .cta-banner__description {
        font-size: 16px;
        line-height: 1.8;
        margin: 8px 0;
    }
    .cta-banner h6 {
        font-size: 14px; /* Reduce description font size */
        line-height: 1.4; /* Adjust line height for readability */
        padding: 10px; /* Reduce horizontal padding */
    }
    .btn-login.caawiye-button {
        margin: 10px auto; /* Center button */
        padding: 8px 15px; /* Adjust button padding */
        font-size: 14px; /* Smaller button text */
    }
}

@media (max-width: 480px) { /* Phones */
    .cta-banner h2 {
        font-size: 20px; /* Even smaller title for phones */
    }
    .cta-banner h6 {
        font-size: 12px; /* Smaller description font size */
    }
	.cta-banner__title {
        font-size: 25px;
        font-weight: bold;
        margin: 10px 0;
        line-height: 1.5;
    }

    .cta-banner__description {
        font-size: 16px;
        line-height: 1.8;
        margin: 8px 0;
    }
    .btn-login.caawiye-button {
        font-size: 12px; /* Adjust button text size */
    }
}

</style>