/* Center the container and add a rounded border */
.container-sm {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 100vh; /* Ensure the container takes the full viewport height */
    padding: 20px; /* Add some padding */
}

.border {
    padding: 40px;
    border-radius: 15px; /* Add rounded border */
    border: 2px;
}

/* Center the audio element */
.audio-container {
    margin-top: 20px;
    margin-bottom: 6px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* Style for the title and dropdowns */
.title-and-dropdowns {
    display: flex;
    align-items: center;
    margin-bottom: 10px;
}

/* Style for dropdowns */
.form-control {
    margin-left: 10px;
    margin-right: 10px;
}

/* Reduce the width of the loopCount input */
#loopCount {
    width: 90px; /* Adjust the width as needed */
}

h1 {
    margin-bottom: 30px;
    text-align: center;
}
/* Center the paragraph text vertically */
p {
    margin: 0; /* Remove default margin */
    display: flex;
    align-items: center;
}

.btn:hover {
    background-color: #383939;
}