.led {
  width: 50px;
  height: 50px;
  background-color: #d4d4d4;
  border-radius: 50%;
  margin-bottom: 20px;
}

.led.on {
  background-color: #00ff00;
}

.led.off
{
  background-color: #d4d4d4;
}
              img{
                margin-left: 0px;
              }
              
              .switch {
                /*margin-left: 30px;*/
                position: relative;
                display: inline-block;
                width: 60px;
                height: 34px;
                margin-bottom: 10px;
              }
          
              .switch input {
                opacity: 0;
                width: 0;
                height: 0;
              }
          
              .slider {
                position: absolute;
                border-radius: 8%;
                cursor: pointer;
                top: 0;
                left: 0;
                right: 0;
                bottom: 0;
                background-color: #ccc;
                -webkit-transition: .2s;
                transition: .2s;
              
              }
          
              .slider:before {
                position: absolute;
                border-radius: 8%;
                content: "";
                height: 26px;
                width: 26px;
                left: 4px;
                bottom: 4px;
                background-color: white;
                -webkit-transition: .2s;
                transition: .2s;
              }
          
              input:checked + .slider {
                background-color: #0960a7;
              }
          
              input:focus + .slider {
                box-shadow: 0 0 1px #29699d;
              }
          
              input:checked + .slider:before {
                -webkit-transform: translateX(26px);
                -ms-transform: translateX(26px);
                transform: translateX(26px);
              }
              
              
              
              .container{
                display: grid;
                grid-template-rows: 1fr;
                row-gap: 1px;
                margin-top: 0px;
                 margin-left:0px;
                 /* margin-bottom: 10px; */
                 /* width: 10px; */
               }
                 
                 /* img {
                   max-width: 130%;
                   max-height: 130%;;
              
                 } */
                 
                 .text {
                   font-size: 23px;
                   padding: 10px;
                   margin-bottom:120px;
                   text-align:left;
                 }
              
                 .button{
                  padding-top: 40px;
                  margin-bottom: 20px;
                  /* margin-left: 350px; */
                  height:100%
                 }

                 #align_items{
                  display: grid;
                  grid-template-columns: 3fr 2fr;
                  column-gap: 1rem;
                  padding: 1rem;
                  margin-top: 50px;
              }
                        
              #item{
                /* border: 1px solid black; */
                border-radius: 0rem;
                margin: 1px;
                min-height: fit-content;
                height: 50rem;
                margin-top: 0rem;
              }
              
              #align_demo{
                display: grid;
                align-items: center;
                grid-template-columns: 1fr 1fr 1fr;
                column-gap: 1rem;
                padding: 0rem;
              }
              
              #demo_item{
                /* border: 1px solid black; */
                border-radius: 0rem;
                margin: 1px;
                min-height: fit-content;
                height: 20rem;
                width: 1fr;
                margin-top: 0rem;
              }