1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465 |
- * {
- box-sizing: border-box;
- }
- body {
- padding: 30px;
- text-align: center;
- }
- .wrapper {
- border: solid rgb(54, 47, 47) 3px;
- padding: 10px;
- width: 100px;
- margin-left: auto;
- margin-right: auto;
- background-color: lightgray;
- border-radius: 5px;
- margin-bottom: 20px;
- }
- #rootSpeed.wrapper {
- width: auto;
- }
- .lightColor {
- width: 70px;
- height: 70px;
- border-radius: 50%;
- background-color: rgb(54, 47, 47);
- margin-bottom: 5px;
- margin-left: auto;
- margin-right: auto;
- text-align: center;
- color: antiquewhite;
- font-weight: 700;
- line-height: 450%;
- }
- #red.on {
- background-color: red;
- }
- #yellow.on {
- background-color: rgb(255, 224, 49);
- }
- #green.on {
- background-color: green;
- }
- #redPed.on {
- background-color: red;
- }
- #greenPed.on {
- background-color: green;
- }
- #switchBtn {
- margin-left: auto;
- margin-right: auto;
- width: 100px;
- height: 50px;
- }
- #switchBtnPed {
- margin-left: auto;
- margin-right: auto;
- width: 100px;
- height: 50px;
- }
- .inputSpeed {
- font-size: 12px;
- width: 300px;
- }
|