/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
 .dynamic-size-slider-container {
margin-bottom: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 70%;
}

.dynamic-size-final-result{
padding: 1rem;
width: auto;
margin-top: 20px;
border: 1px solid #ac7d4d;
background-color: #ac7d4d;
font-family: Arial, sans-serif;
font-size: 0.8vw;
display: flex;
justify-content: center;
align-items: center;
border-radius: 8px;
position: static;
color:white;
}

.dynamic-size-slider-form{
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 90%;
max-width: 600px;
padding: 20px; 

border-radius: 12px;

position: relative;
margin: 0 auto; 
}

.dynamic-size-measurement-title{
text-align: center;
font-weight: bold;
font-size: 2vw;
color: #333;
margin-bottom: 20px;
}

.dynamic-size-submit-slider {
background-color: #ac7d4d!important;
color: white;
border-radius: 8px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
border: none;
transition: background-color 0.3s ease, transform 0.2s ease;
}

.dynamic-size-submit-slider:hover{
background-color: white;
color:#ac7d4d;
}

.dynamic-size-slider-height-input,
.dynamic-size-slider-width-input {
width: 100%;
}

.dynamic-size-slider-width,
.dynamic-size-slider-height {
width: 100%;
text-align: center;
font-weight: 800;
}

.dynamic-size-find-div {
display: flex;
justify-content: center;
margin-top: 20px;
}

.dynamic-size-container {
width: 90%;
max-width: 600px;
padding: 20px;
border-radius: 12px;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}

.correct-output{
    display: flex !important;
    justify-content: center;
    background-color: #e7f3ff;
    color: black;
}
.incorrect-output{
    display: flex !important;
    justify-content: center;
    align-items: center;
    background-color: #ac7d4d !important;
    color: red;
	font-weight: 600;
    text-align: center;
    border-color: white !important;
} 
.error-output {
    display: block !important;
}