@import"https://fonts.googleapis.com/css2?family=Roboto:wght@400;500;700&display=swap";.circle{display:block;border:.1rem solid #3f51b5;margin:30px auto 0;border-radius:50%;height:100px;width:100px}body{font-family:Roboto,sans-serif;margin:0}.light-switch-container{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background-color:#f5f5f5;border-radius:8px;height:100vh;padding:0;box-shadow:0 4px 8px #0000001a}.light-switch-container h1{font-size:35px;color:#3f51b5;margin:0}.light-switch-container span{display:block;font-weight:700;margin-bottom:35px}.light-switch-container p{font-size:30px;font-weight:700;margin-top:20px;color:#3f51b5}.light-switch-container textarea{display:block;margin:20px auto;width:80%;max-width:200px;padding:15px;border-radius:4px;border:1px solid #ccc;box-shadow:inset 0 1px 3px #0000001a;transition:border-color .3s}.light-switch-container textarea:focus{border-color:#3f51b5;outline:none}.light-switch-container button{padding:10px 20px;font-size:16px;border:none;border-radius:4px;background-color:#3f51b5;color:#fff;cursor:pointer;margin-top:10px;transition:background-color .3s,box-shadow .3s;box-shadow:0 2px 4px #0003}.light-switch-container button:hover{background-color:#32408f;box-shadow:0 4px 6px #0003}.light-switch-container .form-data{margin-top:20px;text-align:center}.light-switch-container .form-data h2{font-size:20px;color:#3f51b5}.light-switch-container .form-data p{font-size:16px;margin:5px 0;color:#333}.switch{width:60px;height:120px;background-color:#f5f5f5;border-radius:30px;position:relative;margin:0 auto;box-shadow:0 2px 6px #0003;cursor:pointer;transition:background-color .3s}.switch.on{background-color:#3f51b5}.switch.on .switch-toggle{top:initial;bottom:10px;left:calc(100% - 50px)}.switch.off{background-color:#e0e0e0}.switch .switch-toggle{width:40px;height:40px;background-color:#fff;border-radius:50%;position:absolute;top:10px;left:10px;transition:top .3s,left .3s;box-shadow:0 2px 4px #0003}