style.css

*{
    margin:0;
    padding:0;
    
}

.container{
    width: 100vw;
    height: 100vh;
    background-image: linear-gradient(to bottom, rgba(51, 82, 30, 0.432), rgba(22, 32, 46, 0.53)),
    url('green-house.jpg');
    background-position: center;
    background-repeat: no-repeat;
    background-size:cover;
    }
header{
    width:100%;
    height:15%;
    display:flex;
    align-items: center;
    justify-content: center;
    border-bottom: 0.3rem solid rgb(238, 255, 0);
}   
.wf{
    color:#fff;
}
header h2{
    color:#fff;
    font-size: 40px;
    font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    letter-spacing: 2px;
    font-weight: 30;
    text-shadow: 1px 1px 2px black, 0 0 25px blue, 0 0 5px darkblue;
}
.data-readings{
    display:flex;
    justify-content: space-around;
    flex-wrap: wrap;
    color:rgb(255 226 0);
    font-size: 30px;
    
}
.switch{
    color:rgb(0 255 222);
}
.item{
    padding:1.5em;
    margin:1em;
    border:5px solid rgba(12, 55, 196, 0.205);
    border-radius: 10px;
    background-color: rgb(130 82 0 / 34%);
    font-weight: 425;
}

  input[type="checkbox"] {
    height: 25px;
    width: 25px;
    background-color: solid #eee;
}