/* Move down content because we have a fixed navbar that is 50px tall */
body {
    padding-top: 50px;
    padding-bottom: 20px;
    font-family:Arial;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 20px;
    padding-right: 20px;
    font-family:Arial;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: grey;
}
::-moz-placeholder { /* Firefox 19+ */
  color: grey;
}
:-ms-input-placeholder { /* IE 10+ */
  color: grey !important;
}
:-moz-placeholder { /* Firefox 18- */
  color: grey;
}

/* Set widths on the form inputs since otherwise they're 100% wide */
/*
input[type="text"],
input[type="password"] {
    max-width: 280px;
}
*/
.MeterAlarmEditFormRow {
    display: flex;
    flex-direction: column;
}
/* Responsive: Portrait tablets and up */
@media screen and (min-width: 768px) {
    .MeterAlarmEditFormRow {
        display: flex;
        flex-direction: column;
    }
    .jumbotron {
        margin-top: 20px;
    }
    .body-content {
        padding: 0;
    }
}

/*S105 App Customizations*/
.S105MinWidthForMobile {
    min-width:568px;
}

.S105AppPanel {
    border:1px solid #C7C7C7;
    border-radius:8px;
    /*padding:5px;*/
    padding-top:5px;
    padding-bottom:5px;
    padding-left:12px;
    padding-right:12px;
    margin-top:1px;
    margin-bottom:1px;
}

.S105AppPanelSXSWrapperRightmost{
    padding-left:0px;
    padding-right:0px;
}

.S105AppPanelSXSWrapper{
    padding-left:0px;
    padding-right:2px;
}

.S105AppPanelTitle {
    font-size:x-large;
}

.S105AppPanelMargin {
    /*width:99%;*/
    margin:1px;
    column-gap: 40px;
}

.S105AppSpacer {
    height:5px;
    width:5px;
}

.S105AppGeneralContent {
}

.S105Button {
    border:1px solid #C7C7C7;
    border-radius:8px;
    background-color:#3fba6a;
    font-size:smaller;
    color:#ffffff;
}

.S105Button:hover {
    /*this is for anchors <a> that look/act like buttons*/
    color:#ffffff;
    text-decoration:none;
}


.S105InputBox {
    border:1px solid #C7C7C7;
    border-radius:5px;
}

.S105InputLabel {

}

.S105InputBoxPopup {
    border:1px solid #C7C7C7;
    border-radius:5px;
    font-size:x-small;
}

.S105InputBoxPopupSm {
    width:103px;
}

.S105InputBoxPopupLg {
    width:225px;
}

.S105InputBoxPopup {
    border:1px solid #C7C7C7;
    border-radius:5px;
    font-size:x-small;
}

.S105InputLabelPopup {
    font-size:x-small;
}


.S105Selector {
    border-radius:5px;
    background-color:#3fba6a;
    color:#ffffff;
}

.S105DashboardHeaderText {
    /*color:#3fba6a;*/
    font-size:x-large;
    /*vertical-align:bottom;*/
}

.btn-pref .btn {
    -webkit-border-radius:0 !important;
}

.S105ProgressBar {
    /*#C80000*/
    background-color: white;
    position: relative;
    width: 100%;
    border: 1px solid #000000;
    border-radius: 8px;
    position: relative;
    padding: 0px;
}
    
.S105ProgressBar_Bar {
    /*#3FBA6A*/
    background-color: lightsteelblue;
    border-radius: 6px;
    width: 0%;
    height: 25px;
}
    
.S105ProgressBar_Text {
    position: absolute;
    display: inline-block;
    width:100%;
    top: 5px;
    color:#000000;
    text-align:center;
    /*font-weight:bold;*/
}

.S105Thermometer {
    /*C80000*/
    background-color: #FFFFFF;
    position: relative;
    height: 100px;
    width: 50px;
    border: 1px solid #000000;
    border-radius: 8px;
    padding: 0px;   
}
    
.S105Thermometer_Bar {
    position:absolute;
    /*3FBA6A*/
    /*background-color: lightgreen;*/
    border-radius: 6px;
    width: 48px;
    height: 0%;
    bottom:0;
}
    
.S105Thermometer_Text {
    position: absolute;
    display: inline-block;
    /*height:148px;*/
    top: 25%;
    /*left:50%;*/
    /*right:25%;*/
    width:100%;
    color:#000000;
    text-align:center;
    vertical-align:middle;

    /*font-weight:bold;*/
}
.S105Thermometer_Title {
    width:100%;
    text-align:center;
    font-weight:bold;
}

._GaugeNumCircle {
    width:100px;
    height:100px;
    border: 10px solid #000000;
    border-radius:100%;
    text-align:center;
    font-size:16pt;
    font-weight:bold;
    vertical-align:middle;
}

._GaugeTextStandard {
    font-family:sans-serif;
    font-size:initial;
}

._GaugeTitle {
    font-family:sans-serif;
    font-size:initial;
    font-weight:bold;
}

._GaugeRight {
    text-align:right;
}

._GaugePadLeft-Sm {
    padding-left:2px;
}

._GaugePadRight-Sm {
    padding-right:2px;
}
._GaugePadLeft-Md {
    padding-left:5px;
}

._GaugePadRight-Md {
    padding-right:5px;
}
._GaugePadLeft-Lg {
    padding-left:10px;
}

._GaugePadRight-Lg {
    padding-right:10px;
}
._GaugeSpacer-Sm {
    width:2px;
    height:2px;
}
._GaugeSpacer-Md {
    width:5px;
    height:5px;
}
._GaugeSpacer-Lg {
    width:10px;
    height:10px;
}
._GaugeAlignRight {
    text-align:right;
}

.GaugeArrowPercent {
    width:100px;
    height:100px;
    border: 10px solid #000000;
    border-radius:100%;
    text-align:center;
    font-size:16pt;
    font-weight:bold;
}

.GaugeArrowPercent_Title {
    width:100px;
    text-align:center;
}

.GaugeArrowPercent_Percent {
    color:#000000;
}

.GaugeCircleText_Circle {
    width:100px;
    height:100px;
    border: 10px solid #000000;
    color:#000000;
    border-radius:100%;
    font-size:small;
    text-align:center;
}

.GaugeCircleText_Title {
    width:100px;
    text-align:center;
}

.GaugeCircleText_Text {
    font-size:large;
    font-weight:bold;
}

.GaugeCircleText_TextLower{
    font-size:smaller;
}

.NotDisplayed {
    display:none;
}

.AppSubtleGlyph {
    color:#909090;
}