#grid[data-columns]::before {
    content: '3 .column.size-1of3';
}

.column {
    float: left;
}

.size-1of3 {
    width: 33.333%;
}

a {
    color: white;
    text-decoration: none;
}

.btn {
    --bs-btn-bg: #4e910a;
}

.form-check-input:checked {
    background-color:#4e910a;
    border-color: #4e910a;
}

@media screen and (max-width: 480px) {
    #grid[data-columns]::before {
        content: '1 .column.size-1of1';
    }
}

@media screen and (min-width: 481px) and (max-width: 768px) {
    #grid[data-columns]::before {
        content: '2 .column.size-1of2';
    }
}

@media screen and (min-width: 769px) {
    #grid[data-columns]::before {
        content: '3 .column.size-1of3';
    }
}
        
.pagination > li > a
{
    background-color: white;
    color: #343a40;
}

.pagination > li > a:focus,
.pagination > li > a:hover,
.pagination > li > span:focus,
.pagination > li > span:hover
{
    color: #4e910a;
    background-color: #eee;
    border-color: #ddd;
}

.pagination > .active > a
{
    color: white;
    background-color: #4e910a !Important;
    border: solid 1px #4e910a !Important;
}

.pagination > .active > a:hover
{
    background-color: #343a40 !Important;
    border-color: white !Important;
    color: white;
}