.dropdown {
    color: #00ffdd; /* Neutral color for text */
    border-radius:5px;
}
body { background: #161d33; /* Gradient background */
}
.sidebar {
    background-color: #161d33; /* Light background color */
    padding: 10px; /* Padding */
    border-right: 0px solid #f72900; /* Border on the right */
    color: #f15a0f00; /* Dark text color for readability */
    height: 175px; /* Adjust the height as desired */
    border-radius: 5px;
}
.content {
    padding: 0;
    margin: 100;
}

.dropdown {
    color: #091723; /* Neutral color for text */
    font-family: 'Helvetica', sans-serif; /* Modern sans-serif font */
    border: none; /* Remove the default border */
    background-color: #aa773d; /* Dark background color */
    padding: 10px; /* Add some padding */
    box-shadow: 0 3px 7px rgba(6, 196, 225, 0.48); /* Add a subtle shadow */
    appearance: none; /* Remove the default arrow */
    -webkit-appearance: none; /* Remove the default arrow (for Safari) */
    -moz-appearance: none; /* Remove the default arrow (for Firefox) */
    background-image: url('arrow.png'); /* Add a custom arrow */
    background-repeat: no-repeat; /* Don't repeat the arrow image */
    background-position: right center; /* Position the arrow on the right */
}
.small-bar-graph-container {
    width: 100%;
    height: 225px;
    margin: 0 auto;
    color: aqua;
    position: relative;
    overflow: hidden;
}
.small-bar-graph-container .js-plotly-plot,
.small-bar-graph-container .plot-container {
    height: 100% !important;
    width: 100% !important;
}
.bar-graph {
    color: #fff700;
}
/* In your assets/style.css file */
.centered-container {
    position: relative;
    width: 90%;
    height: 250px; /* Adjust the height as desired */
    margin: 10px auto 0;
}
#desc-window {
    color: #c1c1c1; /* or any color that makes the text readable */
}
#score-dis {
    color: #FFFFFF; /* or any color that makes the text readable */
}
#field-graph {
    height: 350px;
}
/* Hide the marks' labels for a slider with the class 'time-slider' */
#time-slider .rc-slider-mark-text {
    display: none !important;
}

/* Optional: Adjust the bottom margin of the slider track to reduce space */
#time-slider .rc-slider-rail,
#time-slider .rc-slider-track {
    margin-bottom: -10px !important; /* Adjust as needed */
}
.btnImg{
    border-radius: 25px; /* Rounded corners */
}
/* Style for when the button is clicked and held */
.btnImg:active {
    transform: scale(0.95);
    box-shadow: 0 2px 5px rgba(0, 244, 0, 0.2);
}