body{
        font-family:"Share Tech Mono", monospace;
        background-color:aliceblue;
}

p{
  margin-top:50px;
}

.switch input {
  display: none;
}

.slider {
  margin-bottom:20px;
  display: inline-block;
  width: 80px;
  height: 40px;
  border-radius: 25px;
  background: #c5c7ff;
  position: relative;
  transition: 0.3s;
  cursor:pointer;
  overflow:hidden;
        user-select: none;   /* disable text selection */
    -webkit-user-select: none; /* Safari/Chrome */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* IE/Edge */


}



.slider img {
  position: absolute;
  width: 40px;
  height: 40px;
  top: 0px;
  left: 0px;
  transition: transform 0.3s;
}

input:checked + .slider img {
  transform: translateX(40px); /* move right when checked */
}

.slider::before {
  content: "";
  width: 40px;
  height: 40px;
  background: rgb(255, 255, 255);
  border-radius: 50%;
  position: absolute;
  top: 1px;
  left: 1px;
  transition: 0.3s;
}

input:checked + .slider {
  background: #2c2c4eff;
}

input:checked + .slider::before {
  transform: translateX(40px);
  background:rgb(157, 159, 255);
}

#background{
  font-weight:bolder;
  height:500px;
  border-radius:25px;
  padding-top:10px;
  max-width:700px;
  margin:auto;
  text-align:left;
  box-shadow: #1e0542 0.5px 0.5px 10px;
  transition:box-shadow 0.4s ease;
  min-width: 300px;
      user-select: none;   /* disable text selection */
    -webkit-user-select: none; /* Safari/Chrome */
    -moz-user-select: none;    /* Firefox */
    -ms-user-select: none;     /* IE/Edge */


}

p, h1{
  margin-left:20px;
}

#background:hover{
  cursor:default;
  box-shadow:#1e0542 0.5px 0.5px 15px;
}