body
{
    font-family: Nunito,sans-serif;
}
.bg-off-white
{
    background-color: #fafafa;
}
.text-red-500
{
    color:#ff0000;
}

/* Set Blinking Animation WHen Not Cloaked In and When In Break */
.blink
{
    animation: blink 350ms infinite;
    transition: all 350ms ease-in-out;
}
@keyframes blink
{
    0%{
        scale:calc(1);
    }
    50%{
        scale:calc(1.05)
    }
    100%{
        scale:calc(1);
    }

}
.toast
{
    z-index: 10000;
}
.status-navbar
{
    z-index: 1;
}
.search-list-container
{
    z-index: 1000;
}
/* Snackbar/Toast CSS */
#snackbar {
    visibility: hidden; /* Hidden by default. Visible on click */
    min-width: 250px; /* Set a default minimum width */
    margin-left: -125px; /* Divide value of min-width by 2 */
    background-color: #333; /* Black background color */
    color: #fff; /* White text color */
    text-align: center; /* Centered text */
    border-radius: 2px; /* Rounded borders */
    padding: 16px; /* Padding */
    position: fixed; /* Sit on top of the screen */
    z-index: 1; /* Add a z-index if needed */
    left: 50%; /* Center the snackbar */
    bottom: 30px; /* 30px from the bottom */
}

/* Show the snackbar when clicking on a button (class added with JavaScript) */
#snackbar.show {
    visibility: visible; /* Show the snackbar */
/* Add animation: Take 0.5 seconds to fade in and out the snackbar.
However, delay the fade out process for 2.5 seconds */
    animation: fadein 0.5s, fadeout 0.5s 1.5s;
}

/* Animations to fade the snackbar in and out */

@keyframes fadein {
    from {bottom: 0; opacity: 0;}
    to {bottom: 30px; opacity: 1;}
}

@keyframes fadeout {
    from {bottom: 30px; opacity: 1;}
    to {bottom: 0; opacity: 0;}
}

    /* Snackbar Ends */

.card-title
{
    font-family: Nunito,sans-serif;
    font-weight: 700;
    font-size: 18px;
    line-height: 120%;
    cursor: pointer;
}
.card-title:hover
{
    text-decoration: underline;
}
.card-subtitle
{
    font-family: Nunito,sans-serif;
    font-weight: 500;
    font-size: 14px;
}
.card-icon{
    transition: 150ms all ease-in-out;
    padding:6px;
    cursor: pointer;
    border-radius: 5px;
}
.card-icon:hover
{
    background-color: rgba(0,255,0,0.1);
    scale:calc(1.05);
}
.card-container p,.card-container label
{
 padding: 0;
 margin: 0;   
 margin-bottom: 4px;
 font-size:14px;
}
.card-container label
{
    margin-bottom: 0;
}
.card-subtitle
{
    font-size: 14px;
    font-weight: 600;
}
.card-label
{
    font-size:13px;
    font-weight: 300;
}
.btn-rounded
{
    padding:3px 10px;
    border-radius: 50px;
    background-color: #333;
    color:#fff;
    font-size: 11px;
    cursor: pointer;
}
