Monitorr slim minimal - forked & updated in 2020

monitorr-min.css

/* Monitorr minimal - WillPresley fork - https://gist.github.com/WillPresley/b80072238c665ba1170e03cc092c0ab6 */
body.embedded-view {
    background: transparent !important;
    margin-bottom: 0 !important;
}

body.embedded-view #footer {display:none !important;}

#headermin {
    margin-top: 0;
}

#services {
    margin-bottom: 0 !important;
}

    #services * {box-sizing: content-box !important;}

#time, #togglemin, #ajaxtimeout, #summary {display:none !important;}

.double-val-label > span, #center, #stats, .col-lg-4, .btnoffline, .btnunknown, .btnonline  {box-shadow: none !important; -webkit-box-shadow:none !important;}

#stats {
    background-color:transparent !important;
}

#statusloop {
    border-radius: 0 !important;
    /*background-color: rgba(0,0,0,.15) !important;*/
    background-color:transparent !important;
    padding-left: .0rem !important;
    padding-right: 1.11rem !important;
    box-shadow: none !important;
}

.row{display: flex !important; flex-flow: row wrap!important; justify-content: space-evenly !important;}

.col-lg-4 {
    background-color:transparent !important;
    margin: 1rem !important;
    height: 1rem !important;
    /*width: 13rem;*/
    min-width: 140px;
    max-width: 320px;
}

.servicetile, .servicetilenolink, .servicetileoffline {display:flex !important; max-height: 30px !important;}
#servicetitle, #servicetitlenolink, #servicetitleoffline {height: 1.5rem !important; font-size: 1rem !important;}
.servicetile {display:flex !important;}

#pingindicator {
    position: absolute !important;
    top: -18px !important;
    left: -8px !important;
    margin: 0 !important;
    float: unset !important;
}

#pinggreen {
    background: lime;
    /*background: radial-gradient(circle at .1rem .1rem, #2dff31, rgba(20, 20, 20, 0.75));*/
}

#pingyellow {
    background: yellow;
    /*background: radial-gradient(circle at .1rem .1rem, yellow, rgba(20, 20, 20, 0.75));*/
}

#pingred {
    background: red;
    /*background: radial-gradient(circle at .1rem .1rem, rgb(255, 48, 48), rgba(20, 20, 20, 0.75));*/
}

.serviceimg {height: 1.5rem !important;}

#serviceimg, #servicetitle, #servicetitlenolink, #servicetitleoffline  {
    background-color: #656565 !important;
    -webkit-filter: none !important;
    filter: none !important;
    margin-bottom: 0 !important;
}

#serviceimg  {
    padding: 3px !important;
}

#serviceimg img {
    height: 24px !important;
}

#servicetitle, #servicetitlenolink, #servicetitleoffline {
    min-height: 30px !important;
    font-weight: 600 !important;
}

.servicetile {
    text-shadow: none !important;
}

    .servicetile:hover, .servicetile:focus {
        text-shadow: none;
    }
    
        .servicetile:hover #servicetitle, .servicetile:focus #servicetitle {
            text-decoration: underline;
        }
        
        .servicetile:hover .btnonline, .servicetile:focus .btnonline {
            background-color: #2db94d !important;
        }

#servicetitle {
    font-style: italic;
    padding-left: 0;
    min-width: 75px;
}

    #servicetitle:hover, #servicetitle:focus {
        text-shadow: none;
        /*text-decoration: underline;*/
    }

.btnonline {background-color: #28a745 !important;}

.btnoffline, .btnunknown, .btnonline  {
    margin-left: 0 !important;
    padding: 9px .5rem 5px .5rem !important;
    border-radius: 0 !important;
    text-transform: uppercase !important;
    text-shadow: none !important;
    font-size: .75rem;
}