.bg-kelly-green {
    background-color: #04aa6d !important;
    color: white !important;
    font-size: 1.2em !important;
}

.bg-lake-blue {
    background-color: #2397cc !important;
    color: white !important;
    font-size: 1.2em !important;
}

.bg-crimson {
    background-color: #da2c43 !important;
    color: white !important;
    font-size: 1.2em !important;
}

.bg-notepad-yellow {
    background-color: #ffff80 !important;
}

.text-kelly-green {
    color: #04aa6d !important;
}

.text-lake-blue {
    color: #2397cc !important;
}

.text-baby-blue {
    color: #0093D4 !important;
}

.text-crimson {
    color: #da2c43 !important;
}

.munch-btn-kelly-green {
    background-color: #04aa6d !important;
    color: white !important;
    font-size: 1.2em !important;
    color: whitesmoke !important;
    border: 2px solid lightblue !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 3px 5px !important;
}

    .munch-btn-kelly-green:hover {
        color: yellow !important;
        border: 2px solid yellow !important;
        border-radius: 10px !important;
    }

.munch-btn-lake-blue {
    background-color: #2397cc !important;
    color: white !important;
    font-size: 1.2em !important;
    color: whitesmoke !important;
    border: 2px solid lightblue !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 3px 5px !important;
}

    .munch-btn-lake-blue:hover {
        color: yellow !important;
        border: 2px solid yellow !important;
        border-radius: 10px !important;
    }

.munch-btn-xsm {
    font-size: 0.6rem !important;
    padding: 8px 12px !important;
    margin: 0 1px !important;
}

.munch-btn-sm {
    font-size: 0.8rem !important;
    /*padding: 5px 9px !important;*/
    padding: 8px 12px !important;
    margin: 0 1px !important;
}

munch-btn-md {
    font-size: 1.0rem !important;
    padding: 12px 12px !important;
    margin: 0 1px !important;
}

.spinner-border {
    width: 1.5rem;
    height: 1.5rem;
    border-width: 0.2em;
    border-style: solid;
    border-color: currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    box-sizing: border-box;
     display: none;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     animation: spin 0.75s linear infinite;
}

@keyframes spin {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }

    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

.btn-loading {
    position: relative;
}

    .btn-loading .btn-text {
        visibility: hidden;
    }

    .btn-loading .spinner-border {
        display: inline-block;
    }

/* New CSS for smaller spinner */
.spinner-border-sm {
    width: 0.75rem; /* Half the size of the regular spinner */
    height: 0.75rem;
    border-width: 0.15em;
    border-style: solid;
    border-color: currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    box-sizing: border-box;
     display: none;
     position: absolute;
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
     animation: spin 0.75s linear infinite;
}

.btn-loading-small {
    position: relative;
}

    .btn-loading-small .btn-text {
        visibility: hidden;
    }

    .btn-loading-small .spinner-border-sm {
        display: inline-block;
    }

/*=== SPINNER BUTTONS END ===*/