*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    background: #222;
}
body.on{
    background: radial-gradient(#555,#111);
}
.wire{
 position:absolute;
 left: calc(50% - 2px);
 bottom: 50%;
 height: 60vh;
 width: 4px;
 background: black;
 z-index: 1;
}
.bulb{
    position: relative;
    width: 80px;
    height: 80px;
    background: transparent;
    z-index: 2;
}
.bulb i{
    font-size: 4rem;
    color: #444;
    position: absolute;
    top: 50%;
    left: 50%;
transform: translate(-50%,-50%)rotate(180deg);

}
.switch{
    position: absolute;
    top:60px;
    right: 100px;
    width: 40px;
    height: 40px;
    background: #ccc;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: gray opx 10px 15px -5px;
    cursor: pointer;
    color: red;
}
.switch i{
    font-size: 1.5rem;

}
.on .bulb i{
    color: #ffd700;
}
.on .switch{
    color:#4caf50 ;
}