h1 {
                                                                    font-family: Libre Baskerville;
                                                                    margin: 10;
                                                                    color: #323143;
                                                                    text-transform: uppercase;
                                                                    font-weight: bold;
                                                                }
                                                                h2 {
                                                                    text-transform: uppercase;
                                                                }
                                                                body {
                                                                    font-family: Titillium Web;
                                                                    margin: 20;
                                                                    padding: 10;
                                                                    background-color: #feefc6;
                                                                }
                                                                header {
                                                                    background-color: #c1d1d1;
                                                                    color: #4a686a;
                                                                    padding: 20px;
                                                                    text-align: center;
                                                                }
                                                                footer {
                                                                    background-color: #323143;
                                                                    color: white;
                                                                    padding: 10px;
                                                                    text-align: center;
                                                                }
                                                                .grid-container {
                                                                    display: grid;
                                                                    grid-template-columns: 1fr;
                                                                    grid-gap: 20px;
                                                                    padding: 20px;
                                                                    font-family: Titillium Web;
                                                                }
                                                                .grid-item {
                                                                    margin-bottom: 20px;
                                                                }
                                                                .full-width {
                                                                    grid-column: span 1;
                                                                }
                                                                .navbar-items {
                                                                    display: flex;
                                                                    justify-content: space-between;
                                                                    /* Adjust space between items */
                                                                    padding: 10px;
                                                                    font-family: Titillium Web;
                                                                }
                                                                .navbar-item {
                                                                    background-color: #4a686a;
                                                                    /* Button color */
                                                                    color: #ffffff;
                                                                    /* Text color */
                                                                    padding: 15px 20px;
                                                                    /* Add space inside the button */
                                                                    font-size: 18px;
                                                                    /* Text size */
                                                                    text-decoration: none;
                                                                    /* Remove underline */
                                                                    border-radius: 5px;
                                                                    /* Rounded corners */
                                                                    /* Center text inside */
                                                                    width: 200px;
                                                                    /* Width of the button */
                                                                    display: inline-block;
                                                                    /* Makes the link behave like a button */
                                                                    text-transform: uppercase;
                                                                    /* Uppercase text for the button */
                                                                    font-weight: bold;
                                                                    /* Bold text */
                                                                }
                                                                .navbar-item:hover {
                                                                    background-color: #fdb137;
                                                                    /* Darken color on hover */
                                                                    cursor: pointer;
                                                                    /* Change cursor to indicate a clickable button */
                                                                }
                                                                section {
                                                                    background-color: #fdb137;
                                                                    padding: 10px;
                                                                    border-radius: 5px;
                                                                    text-transform: uppercase;
                                                                }
                                                                .large-button {
                                                                    background-color: #c1d1d1;
                                                                    /* Default button color */
                                                                    color: 4a686a;
                                                                    /* Text color */
                                                                    padding: 15px 30px;
                                                                    /* Padding for button */
                                                                    font-size: 18px;
                                                                    /* Font size */
                                                                    border: none;
                                                                    /* Remove border */
                                                                    border-radius: 5px;
                                                                    /* Rounded corners */
                                                                    text-align: center;
                                                                    /* Center text */
                                                                    text-decoration: none;
                                                                    /* Remove underline */
                                                                    display: inline-block;
                                                                    /* Display as inline block */
                                                                    cursor: pointer;
                                                                    /* Change cursor to indicate clickable */
                                                                    transition: background-color 0.3s ease;
                                                                    font-size: 20px;
                                                                    font-weight: bold;
                                                                    /* Smooth transition effect */
                                                                }
                                                                /* Hover effect to change button color */
                                                                
                                                                .large-button:hover {
                                                                    background-color: #4a686a;
                                                                    color: #ffffff;
                                                                    font-size: 20px;
                                                                    font-weight: bold;
                                                                    font-family: Titillium Web;
                                                                }
                                                                .image-container {
                                                                    display: flex;
                                                                    justify-content: space-around;
                                                                    /* Ensure space between images */
                                                                    flex-wrap: wrap;
                                                                    /* Allow images to wrap if needed */
                                                                }
                                                                /* Styling for each image-item */
                                                                
                                                                .image-item {
                                                                    text-align: center;
                                                                    /* Center text (label) under each image */
                                                                    display: inline-block;
                                                                    /* Ensures that each image and label group is treated as a block */
                                                                    margin: 10px;
                                                                    /* Optional: Add space between items */
                                                                }
                                                                /* Optional: Make sure the images fit their container */
                                                                
                                                                .image-item img {
                                                                    max-width: 100%;
                                                                    /* Ensure the image scales properly */
                                                                    height: auto;
                                                                    /* Maintain aspect ratio */
                                                                }
                                                                /* Optional: Add some margin to labels if necessary */
                                                                
                                                                .image-item label {
                                                                    display: block;
                                                                    /* Ensure label is treated as a block element */
                                                                    margin-top: 10px;
                                                                }
                                                                .image-item label {
                                                                    display: inline-block;
                                                                    width: 40px;
                                                                    /* Adjust the size of the circle */
                                                                    height: 40px;
                                                                    /* Adjust the size of the circle */
                                                                    background-color: #c1d1d1;
                                                                    /* Change to your preferred color */
                                                                    color: white;
                                                                    text-align: center;
                                                                    line-height: 40px;
                                                                    /* Vertically center the number inside the circle */
                                                                    border-radius: 50%;
                                                                    /* Makes the background a perfect circle */
                                                                    font-size: 18px;
                                                                    /* Adjust the font size as needed */
                                                                    margin-top: 10px;
                                                                    /* Adds space between the image and the label */
                                                                }
                                                                .image-item button {
                                                                    display: inline-block;
                                                                    width: 60px;
                                                                    /* Adjust the size of the button */
                                                                    height: 60px;
                                                                    /* Adjust the size of the button */
                                                                    background-color: #fdb137;
                                                                    /* Change to your preferred color */
                                                                    color: white;
                                                                    text-align: center;
                                                                    line-height: 60px;
                                                                    /* Vertically center the number inside the button */
                                                                    border-radius: 50%;
                                                                    /* Makes the button a circle */
                                                                    font-size: 18px;
                                                                    /* Adjust the font size as needed */
                                                                    border: none;
                                                                    /* Remove the default button border */
                                                                    cursor: pointer;
                                                                    /* Show pointer cursor when hovered */
                                                                    margin: 10px;
                                                                    /* Adds spacing between the buttons */
                                                                }
                                                                /* Optional: Hover effect for buttons */
                                                                
                                                                .image-item button:hover {
                                                                    background-color: #ff9900;
                                                                }
                                                                #multiplySection {
                                                                    color: #ffffff;
                                                                    background-color: #4a686a;
                                                                    color: #c1d1d1
                                                                    /* Purple background */
                                                                    padding: 20px;
                                                                    /* Optional: Add some padding for spacing */
                                                                    border-radius: 10px;
                                                                    /* Optional: Add rounded corners for a smoother look */
                                                                }
                                                                #divideSection {
                                                                    background-color: #c1d1d1;
                                                                    /* Light blue */
                                                                    padding: 20px;
                                                                    border-radius: 10px;
                                                                    text-align: center;
                                                                }
                                                                /* Center the image */
                                                                
                                                                #divideSection .image-item img {
                                                                    display: block;
                                                                    margin: 0 auto;
                                                                    max-width: 100%;
                                                                    /* Ensures responsiveness */
                                                                }
                                                                /* Labels in a single row */
                                                                
                                                                #divideSection .label-container {
                                                                    display: flex;
                                                                    justify-content: center;
                                                                    gap: 8px;
                                                                    /* Adjust spacing between labels */
                                                                    margin-top: 10px;
                                                                    max-width: 100%;
                                                                    /* Prevents overflow */
                                                                    white-space: nowrap;
                                                                    /* Prevents text from stacking */
                                                                    overflow: hidden;
                                                                }
                                                                /* Label Styling */
                                                                
                                                                #divideSection .label-container label {
                                                                    font-size: 14px;
                                                                    /* Smaller text to fit in one line */
                                                                    font-weight: bold;
                                                                    color: white;
                                                                    /* White text */
                                                                    background: none;
                                                                    padding: 5px;
                                                                    text-align: center;
                                                                }
                                                                header-h2 {
                                                                    color: #323143;
                                                                }
                                                                header h2,
                                                                header h3 {
                                                                    color: #323143;
                                                                    /* Darker blue */
                                                                }
                                                                #multiplySection h2,
                                                                #multiplySection h3 {
                                                                    text-align: center;
                                                                    font-size: 18px;
                                                                }
                                                                #divideSection h2 {
                                                                    font-size: 24px;
                                                                    /* Adjust the size as needed */
                                                                    font-weight: bold;
                                                                }
                                                                .grid-item.full-width {
                                                                    background-color: #c1d1d1;
                                                                }
                                                                #multiplySection {
                                                                    background-color: #c1d1d1;
                                                                    /* Lightest blue */
                                                                    padding: 20px;
                                                                    border-radius: 10px;
                                                                }
                                                                #multiplySection .image-item label {
                                                                    background-color: #fdb137;
                                                                    /* Orange */
                                                                    color: white;
                                                                    text-align: center;
                                                                    line-height: 40px;
                                                                    border-radius: 50%;
                                                                    font-size: 18px;
                                                                    margin-top: 10px;
                                                                    width: 40px;
                                                                    height: 40px;
                                                                }
                                                                /* Label background color when hovered */
                                                                
                                                                #multiplySection .image-item label:hover {
                                                                    background-color: #ff9900;
                                                                    /* Darker orange on hover */
                                                                }
                                                                /* Label background color when clicked and selected (stays dark) */
                                                                
                                                                #multiplySection .image-item label.selected {
                                                                    background-color: #ff9900;
                                                                    /* Darker orange */
                                                                }
                                                                /* Prevent hover effect from overriding selected state */
                                                                
                                                                #multiplySection .image-item label.selected:hover {
                                                                    background-color: #ff9900;
                                                                    /* Ensure hover stays the same for selected labels */
                                                                }
                                                                #convertMeasurement {
                                                                    background-color: #fdb137;
                                                                    /* Orange */
                                                                    color: white;
                                                                    /* White text */
                                                                    border: none;
                                                                    padding: 15px 30px;
                                                                    /* Adjust padding as needed */
                                                                    font-size: 18px;
                                                                    /* Adjust font size */
                                                                    border-radius: 10px;
                                                                    /* Rounded corners */
                                                                    cursor: pointer;
                                                                    /* Pointer on hover */
                                                                    transition: background-color 0.3s ease;
                                                                    font-family: Libre Baskerville;
                                                                    /* Smooth color transition */
                                                                }
                                                                /* Button hover effect */
                                                                
                                                                #convertMeasurement:hover {
                                                                    background-color: #4a686a;
                                                                    color: white;
                                                                    /* White text */
                                                                    border: none;
                                                                    padding: 15px 30px;
                                                                    /* Adjust padding as needed */
                                                                    font-size: 18px;
                                                                    /* Adjust font size */
                                                                    border-radius: 10px;
                                                                    /* Rounded corners */
                                                                    cursor: pointer;
                                                                    /* Pointer on hover */
                                                                    transition: background-color 0.3s ease;
                                                                    /* Darker orange on hover */
                                                                }