svg {
    max-width: 100%;
}

/*Seventeen segment display*/
.seg {
    transition: fill 0.3s ease; /* Adjust duration as needed */
}
.seg.on {
    fill: #08FF08; /* Color for 'on' state */
}
.seg.off {
    fill: #1d1d1d; /* Color for 'off' state */
}
.seventeen-seg-display {
    margin-right: 4px;
}
.scrolling-seg-display {
    display: flex;
    background: black;
    align-items: center;
}

/*LED stack display*/
.ledstack-display {
    
}
.stack {
    transition: fill 0.5s ease; /* Adjust duration as needed */
}
.stack.on {
    fill: #08FF08; /* Color for 'on' state */
}
.stack.off {
    fill: #1d1d1d; /* Color for 'off' state */
}
.stack.onmed {
    fill: yellow; /* Color for 'medium' state */
}
.stack.onhigh {
    fill: red; /* Color for 'high' state */
}


/*Dial*/
/*.dial-container {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 400px;*/ /* Adjust as needed */
    /*height: 400px;*/ /* Adjust as needed */
    /*background-color: #f0f0f0;  Light background color for contrast */
/*}*/

/*.dial {
    width: 100px;*/ /* Adjust size as needed */
    /*height: 100px;*/ /* Adjust size as needed */
    /*background-color: white;
    border-radius: 50%;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);*/ /* Optional shadow for effect */
/*}*/