.aros-button {
background-color: rgb(212, 100, 36);
color: white;
padding: 10px 20px;
border: none;
cursor: pointer;
transition: background-color 0.3s, transform 0.3s;
width: 80%; /* Set width to 80% */
height: 80px; /* Adjust the height value as needed */
box-shadow: 2px 4px 6px rgba(0, 0, 0, 0.4);
border-radius: 30px; /* Adds roundness */
font-size: 40px; /* Increases font size */
line-height: 1.5; /* Adjust line height as needed */
text-align: center; /* Centers the text horizontally */
white-space: nowrap; /* Prevents the text from wrapping to multiple lines */
overflow: hidden; /* Hides any overflowed text */
display: block; /* Converts the button into a block-level element */
font-family: 'NanumGothicCodingBold';
margin-left: auto;
margin-right: auto;
}
.aros-button:hover {
background-color: rgb(235, 161, 65);
transform: scale(1.1);
}
.aros-button.most-likely-to-click {
padding: 20px 30px; /* Increase padding to make the button bigger */
font-size: 50px; /* Increase font size for the most likely to click button */
}
@media only screen and (max-width: 600px) {
.aros-button {
font-size: 20px; /* Decreases font size for mobile devices */
width: 90%; /* Set width to 90% */
height: 60px; /* Adjust the height value as needed */
}
}
