﻿<style > 

body {
    font-family: Arial, sans-serif;
    background: #eaf2f7;
}


/* Outer container */
.card-marquee {
    width: 100%;
    overflow: hidden;
    position: relative;
    padding: 20px 0;
}

/* Moving container */
.marquee-track {
    display: flex;
    gap: 20px;
    animation: scroll-cards 18s linear infinite;
}
/* Animation */
@keyframes scroll-cards {
    0% { transform: translateX(100%); }
    100% { transform: translateX(-120%); }
}

.stats-container {
    display: flex;
    justify-content: Left;
    gap: 20px;
    padding: 0px;
    flex-wrap: wrap;
}

.stat-card {
    width:199px;
    padding:10px;
    border-radius: 8px;
    color: #fff;
    text-align: center;
    box-shadow: 0 3px 8px rgba(0,0,0,0.2);
}

    .stat-card .icon {
        width: 55px;
        height: 55px;
        margin-bottom: 10px;
    }

    .stat-card h3 {
        font-size:20px;
        margin-bottom: 5px;
    }

    .stat-card .value {
        font-size: 24px;
        font-weight: bold;
    }



/* Background Colors */
.blue {
    background: #2e6da4;
}

.teal {
    background: #1fbad6;
}

.green {
    background: #28a745;
}

.orange {
    background: #ff7043;
}

.yellow {
    background: #ffa726;
}

.Ram {
    background: #706255;
}
.Ram1 {
    background: #E98167;
}


.Coll {
    background: #A4CAC8;
}
.Coll1 {
    background: #79ACA9;
}
.Coll2 {
    background: #D8D6D6;
}


</style >
