/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jun 25 2025 | 11:25:51 */
/* --- Feature Banner (Custom HTML - No BG, 15px Font) --- */

/* 1. Style the main container div */
.feature-banner-html {
    /* 
       The text color is set to white to match the original image.
       If you place this on a light-colored background, you MUST 
       change this color to something dark, e.g., color: #333333; 
    */
    color: #ffffff; 
    
    /* Adds some vertical spacing */
    padding: 20px 0;
}

/* 2. Style the list (ul) to be a horizontal flex container */
.feature-banner-html ul {
    display: flex;
    justify-content: space-around; /* Distributes items evenly */
    align-items: center;           /* Vertically centers items */
    margin: 0;
    padding: 0;
    list-style: none;              /* Removes the default list bullets */
}

/* 3. Style each list item (li) */
.feature-banner-html li {
    font-weight: bold;
    font-size: 15px; /* --- FONT SIZE SET TO 15px --- */
    padding: 5px 10px; 
    text-align: center;
}

/* 4. Add the green checkmark icon before each list item */
.feature-banner-html li::before {
    content: ''; 
    display: inline-block;
    height: 20px;
    width: 20px;
    margin-right: 10px; /* Space between icon and text */
    vertical-align: middle; 
    background-size: contain;
    background-repeat: no-repeat;
    
    /* Green checkmark SVG icon */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath fill='%2332cd32' d='M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E");
}

/* 5. Responsive styles for mobile devices */
@media (max-width: 782px) {
    .feature-banner-html ul {
        /* Stack the items vertically */
        flex-direction: column;
        align-items: flex-start; /* Aligns items to the left when stacked */
    }
    
    .feature-banner-html li {
        margin-bottom: 15px;
    }
    
    .feature-banner-html li:last-child {
        margin-bottom: 0;
    }
}