<style>
#dummy {
}

thead {
    vertical-align: middle;
    text-align: left;
}


fieldset {
    display: inline-block;
    width: 95%;
}
label {
    display: inline-block;
    width: 200px;
}

input {
    display: inline-block;
    width: 200px;
}

select {
    display: inline-block;
    width: 200px;
}
.configInput {
    display: inline-block;
    width: 500px;
}
fieldset {
    display: inline-block;
}
.st_label {
    display: inline-block;
    width : 90px;
    padding : 1px;
}
.pa_label {
    display: inline-block;
    width : 120px;
    padding : 1px;
    font-size : 8pt;
}
.sv_label {
    display: inline-block;
    width : 50px;
    padding : 1px;
    font-size : 8pt;
}
.po_label {
    display: inline-block;
    height: 20px;
    width : 150px;
    padding : 1px;
    vertical-align : middle;
}
.st_data {
    text-align: left;
    display: inline-block;
    width : 100px;
    padding : 1px;
}
.st_sat_req {
    text-align: right;
    display: inline-block;
    width : 30px;
    padding : 1px;
}
#top {
    font-family:Arial;
    background-color:black;
    color:white;
    text-align:center;
    padding:5px;
}
#nav {
    font-family:Arial;
    line-height:30px;
    background-color:#eeeeee;
    height:83%;
    width:15%;
    float:left;
    padding:5px; 
}
#main {
    font-family:Arial;
    width:100%;
    height:88%;
    float:left;
    padding:0px; 
}
#bot {
    font-family:Arial;
    background-color:black;
    color:white;
    clear:both;
    text-align:center;
    padding:5px; 
}

.dropbtn {
    background-color: #12B0E3;
    width: 120px;
    height: 47px;
    color: white;
    padding: 0px;
    font-size: 16px;
    border: none;
    cursor: pointer;
    border-radius: 0px;
    box-shadow: 0 0px #999;
}

.dropbtn:hover, .dropbtn:focus {
    font-family:Arial;
    background-color: #12A0C3;
}

.dropbtn:active {
  box-shadow: 0 0px #666;
  transform: translateY(0px);
}

.dropdown {
    position: relative;
    display: inline-block;
    background-color: #12B0E3;
}

.dropdown-content {
    background-color: #12B0E3;
    font-family:Arial;
    display: none;
    padding: 3px 3px;
    position: absolute;
    min-width: 200px;
    overflow: auto;
    box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
    z-index: 100;
}

.dropdown-content a {
    background-color: #12B0E3;
    font-family:Arial;
    color: white;
    padding: 1px 1px;
    text-decoration: none;
    display: block;
    z-index: 100;
}

.dropdown a:hover {
    background-color: #12A0C3;
}

.show {display:block;}

.pow_switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 20px;
  vertical-align : middle;
}

.pow_switch input {display:none;}

.pow_slider {
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #006400;
  -webkit-transition: .4s;
  transition: .4s;
}

.pow_slider:before {
  position: absolute;
  content: "";
  height: 16px;
  width: 16px;
  left: 2px;
  bottom: 2px;
  background-color: white;
  -webkit-transition: .4s;
  transition: .4s;
}

input:checked + .pow_slider {
  /*background-color: #2196F3;*/
  background-color: #DD0000;
}

input:focus + .pow_slider {
  box-shadow: 0 0 1px #2196F3;
}

input:checked + .pow_slider:before {
  -webkit-transform: translateX(38px);
  -ms-transform: translateX(38px);
  transform: translateX(38px);
}

/* Rounded sliders */
.pow_slider.round {
  border-radius: 20px;
}

.pow_slider.round:before {
  border-radius: 50%;
}

#powProgress {
  position: relative;
  width: 100%;
  height: 20px;
  background-color: #ddd;
}

#powProgress_X {
  text-align: center;
  position: relative;
  width: 100%;
  height: 20px;
  background-color: #ddd;
  color: black;
}

#powBar_1 {
  position: absolute;
  height: 100%;
  background-color: #4CAF50;
}

#powBar_2 {
  position: absolute;
  height: 100%;
  background-color: #4CAF50;
}

#powBar_X {
  position: absolute;
  height: 100%;
  background-color: #4CAF50;
}

#powLabel_1 {
  text-align: center;
  line-height: 20px;
  color: white;
}

#powLabel_2 {
  text-align: center;
  line-height: 20px;
  color: white;
}

#powLabel_X {
  width: 100%;
  text-align: center;
  line-height: 20px;
  color: black;
}

button {
  display: inline-block;
  padding: 4px 4px;
  font-size: 12px;
  cursor: pointer;
  text-align: center;
  text-decoration: none;
  outline: none;
  border: none;
  border-radius: 3px;
  box-shadow: 0 4px #999;
}

button:active {
  box-shadow: 0 2px #666;
  transform: translateY(2px);
}

.armbutton {
  color: #fff;
  background-color: #4CAF50;
}

.armbutton:hover {background-color: #3e8e41}

.armbutton:active {
  background-color: #3e8e41;
}

.disarmbutton {
  color: #fff;
  background-color: #f44336;
}

.disarmbutton:hover {background-color: #e43325}

.disarmbutton:active {
  background-color: #e43325;
}


select {
  padding: 1px 1px;
  text-decoration: none;
  outline: none;
  border-radius: 5px;
  box-shadow: 0 2px #999;
}
</style>
