
:root { --version: Shelly_style.css 02. 04. 2024  }



body {
    background-color: #2d3b41 !important;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.1em;
 }
 .room {
     background-color: #2d3b41;
     padding: 20px;
     border-radius: 20px;
     color: #eee;
     margin-bottom: 1px;
 }
 .Aroom {
     background-color: #2d3b41;
     padding: 10px;
     border-radius: 20px;
     color: #eee;     
     margin-bottom: 1px;
     z-index: 2;
 }

 .longmsg {
     background-color: black;
     padding: 20px;
     border-radius: 20px;
     color: #eee;
     margin-bottom: 1px;
     visibility: hidden;
 
 }

.time {
     background-color: #2d3b41;
     padding: 20px;
     border-radius: 20px;
     color: #eee;
     margin-bottom: 10px;
 }

 h4 {
     margin: 0;
     margin-bottom: 5px;
 }
 .room > div {
     display: inline-block;
     width: 120px;
     height: 130px;
     background-color: #333d42;
     border-radius: 10px;
     padding: 10px;
 }

 .longmsg > div {
     display: inline-block;
     width: 800px;
     height: 40px;
     background-color: #333d42;
     border-radius: 20px;
     padding: 20px;
      }
 .Aroom > div {
     display: inline-block;
     width: 120px;
     height: 110px;
     background-color: #333d42;
     border-radius: 10px;
     padding: 3px;
     z-index: 2;
 }

.buttons {
font-size:16px;
background: #445258;
border-radius: 10px;
border: none;
padding: 10px 32px;
color: white;
}

 .relay {
     font-size: 4em;
     cursor: pointer;
 }
.relaydark {
     font-size: 4em;
     cursor: pointer;
     filter: brightness(50%);
 }
.current {
     font-size: 3em;
     cursor: pointer;
}
.uni {
     font-size: 4.7em;
     cursor: pointer;
     text-align: center;
}
.time {
     font-size: 6em;
     cursor: pointer;
}
.unidark {
     filter: brightness(50%);
     font-size: 5em;
     cursor: pointer;
}


#BigTimer1 {
  position: fixed;
  display: none;
  width: 1px;
  height: 1px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5);
  z-index: 2;
 }

#BigTimer2 {
  position: fixed;
  display: none;
  width: 1px;
  height: 1px;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.0);
  z-index: 2;
  }
#BigText1{
  position: fixed;
  top: 270px;
  left: 50px;
  text-align: center;
  opacity: 0.8;
  font-size: 300px;
  color: #6495ed;
 }
#BigText2{
  position: fixed;
  top: 270px;
  left: 520px;
  text-align: center;
  opacity: 0.8;
  font-size: 300px;
  color: #6495ed;
 }

      