.gradient {
   z-index: -1;
}

.obsidian-server-on {
    border-left: 3px solid green;
}

.obsidian-server-off {
    border-left: 3px solid red;
}

.obsidian-server-on > .gradient {
    height: 100%;
    background: linear-gradient(to right, #228b2250, #90ee9010);
}

.obsidian-server-off > .gradient {
    height: 100%;
    background: linear-gradient(to right, #ff000050, #f001);
}

.uk-card-default .uk-card-header {
    border-bottom: none;
}

.vertical-progress.off {
    position: absolute;
    background: linear-gradient(crimson, orange);
    transform: rotate(180deg);
    right: -7px;
    width: 7px;
    bottom: 0;
    height: 100%;
}

.vertical-progress.on {
    position: absolute;
    transform: rotate(180deg);
    right: -7px;
    width: 7px;
    bottom: 0;
    height: 100%;
}

.vertical-progress.on > div {
    background: linear-gradient(royalblue, aqua);
}

.right-block.monitoring {
    border-radius: 0;
    border-bottom: 5px solid #eee;
}

.monitoring-server-version {
    padding: 3px;
    background: whitesmoke;
    color: black;
    font-size: 14px;
    font-weight: bold;
}

.monitoring-server-online {
    padding: 5px;
    background: #3b3b4b;
    color: white;
    font-size: 14px;
    font-weight: bold;
}

.monitoring-progress-container {
    height: 5px;
    background: #3b3b4b;
    width: 100%
}

.monitoring-progress {
    height: 5px;
    background: #5b7ff5;
    z-index: 1;
}