/*
 * Globals
 */

/* Links */
a,
a:focus,
a:hover {
    color: #fff;
}

/*
 * Base structure
 */


html {
    position: relative;
    min-height: 100%;
}
body {
    margin-top: 100px;
    height: 100%;
    background-color: #333;
    color: #EEE
}


/* Custom page CSS
-------------------------------------------------- */
/* Not required for template or sticky footer method. */

main > .container {
    padding: 60px 15px 0;
}


.online {
    color: #83B621;
}

.offline {
    color: #ec0404;
}

th {
    color: #b2afa9;
}

.alignleft {
    float: left;
}

.alignright {
    float: right;
}

/* just the line */
.sparkline {
    stroke: red;
    fill: none;
}

/* line with highlight area */
.sparkline {
    stroke: red;
    fill: rgba(255, 0, 0, .3);
}

/* change the spot color */
.sparkline--spot {
    stroke: blue;
    fill: blue;
}

/* change the cursor color */
.sparkline--cursor {
    stroke: orange;
}

/* style fill area and line colors using specific class name */
.sparkline--fill {
    fill: rgba(255, 0, 0, .3);
}

.sparkline--line {
    stroke: red;
}

.progress-bar[aria-valuenow="1"],
.progress-bar[aria-valuenow="2"] {
    z-index: 1;
}

.progress-bar[aria-valuenow="0"] {
    color: gray;
    z-index: 1;
    background: transparent !important;
    box-shadow: none;
}

.progress-bar-stat[aria-valuenow^="9"]:not([aria-valuenow="9"]) {
    background: red;
}

.blinking{
    animation:blinkingText 1.2s infinite;
    font-weight: bold;
}
@keyframes blinkingText{
    0%{     color: #ff0000;    }
    49%{    color: #ff0000; }
    60%{    color: transparent; }
    99%{    color:transparent;  }
    100%{   color: #ff0000;    }
}

@keyframes flickerAnimation {
    0%   { opacity:1; }
    50%  { opacity:0; }
    100% { opacity:1; }
}
@-o-keyframes flickerAnimation{
    0%   { opacity:1; }
    50%  { opacity:0; }
    100% { opacity:1; }
}
@-moz-keyframes flickerAnimation{
    0%   { opacity:1; }
    50%  { opacity:0; }
    100% { opacity:1; }
}
@-webkit-keyframes flickerAnimation{
    0%   { opacity:1; }
    50%  { opacity:0; }
    100% { opacity:1; }
}
.animate-flicker {
    -webkit-animation: flickerAnimation 2.2s infinite;
    -moz-animation: flickerAnimation 2.2s infinite;
    -o-animation: flickerAnimation 2.2s infinite;
    animation: flickerAnimation 2.2s infinite;
}

.link {
    text-decoration: underline;
    color: #fff;
}

.pulse {
    overflow: visible;
    position: relative;
}
.pulse:before {
    content: '';
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-color: inherit;
    border-radius: inherit;
    transition: opacity .3s, transform .3s;
    animation: pulse-animation 1s cubic-bezier(0.24, 0, 0.38, 1) infinite;
    z-index: -1;
}
@keyframes pulse-animation {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    50% {
        opacity: 0;
        transform: scale(1.5);
    }
    100% {
        opacity: 0;
        transform: scale(1.5);
    }
}

.navbar .dropdown-menu {
    background-color: #49525a;
}

.dropdown-item {
    color: rgba(255,255,255,0.5);
}