/* MAIN FEED STYLE */
html, body {
    background-color: #525354;
    color: #eee;
    scrollbar-color: #565758 #4a4a4d; /* FireFox scrollbar */
}
.wall-color {
    background-color: #525354!important;
}
a {
    color: #eee;
}
.bg {
    background-color: #353535;
}
body::-webkit-scrollbar-track {
    background: #4a4a4d;
}
body::-webkit-scrollbar-thumb {
    background-color: #565758;    
    border-radius: 20px;       
    border: 3px solid #4a4a4d;  
}
.menu {
    background-color: #353535;
}
.menu li:hover {
    background-color: #222222;
}
.menu .active {
    background-color: #222222;
}

/* PUSH STYLE */
.push {
    box-shadow: 0.1rem 0.1rem 0.3rem rgb(36, 36, 36, 0.57);
}
.app_name {
    text-transform: none;
    font-weight: normal;
}
h1 {
    text-transform: none;
    font-weight: normal;
}
.side_dish {
    font-weight: normal;
}
.time_since_timestamp {
    color: #b6b6b6;
}
input[type=input] {
    background-color: #bdbdbd;
}

/* On mouse-over, add a grey background color */
.source-label:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */
.source-label input:checked ~ .checkmark {
    background-color: #2196F3;
}

/* Style the checkmark/indicator */
.source-label .checkmark:after {
    border: solid white;
}

/* OVERLAY LOADER */


div.loading{
    background-color: rgba(16, 16, 16, 0.5);
}

.uil-ring-css > div {
    box-shadow: 0 0.2185rem 0 0 #ffffff;
}

/* TINGLE */
.tingle {
    animation-name: tingle;
    animation-duration: 4s;
    animation-iteration-count: 1;
  }
  
  @keyframes tingle {
    0% {
        filter: brightness(120%);
        -webkit-filter: brightness(120%);
    }
    100% {
        filter: brightness(100%);
        -webkit-filter: brightness(100%);
    }
}