.button-55 {
    background-color: #fff;
    border: 2px solid;
    border-radius: 15px 225px 255px 15px 15px 255px 225px 15px;
    box-shadow: rgba(0, 0, 0, .2) 15px 28px 25px -18px;
    color: #41403e;
    cursor: pointer;
    display: inline-block;
    font-family: Neucha, sans-serif;
    font-size: 1.5rem;
    padding: .75rem;
    text-decoration: none;
    transition: all 235ms ease-in-out;
    margin: 5px 0;
}

.button-55:hover {
    box-shadow: rgba(0, 0, 0, .3) 2px 8px 8px -5px;
    transform: translate3d(0, 2px, 0);
}

.button-55:focus {
    box-shadow: rgba(0, 0, 0, .3) 2px 8px 4px -6px;
}

.large-button {
    display: inline-block; /* Makes it behave like a button */
    width: 90%; /* Takes up most of the screen width for easy tapping */
    max-width: 400px; /* Prevents it from getting too large on bigger screens */
    padding: 15px 20px; /* Adds enough spacing for a comfortable tap area */
    font-size: 2.5em; /* Large text for readability */
    font-weight: bold; /* Emphasizes the text */
    color: #ffffff; /* White text for contrast */
    background-color: #007bff; /* Nice blue color */
    border: none; /* Removes default border */
    border-radius: 12px; /* Rounded corners for a modern look */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Soft shadow for a lifted appearance */
    text-align: center; /* Centers text inside the button */
    cursor: pointer; /* Changes cursor to pointer on hover */
    margin: 10px auto; /* Adds spacing and centers button horizontally */
    margin-bottom: 50px;
    transition: background-color 0.3s, transform 0.2s; /* Smooth hover effects */
    
}

.large-button:hover {
    background-color: #0056b3; /* Slightly darker blue on hover */
    transform: translateY(-2px); /* Gives a subtle lift effect */
}

.large-button:active {
    background-color: #003f7f; /* Even darker blue when pressed */
    transform: translateY(2px); /* Pushes the button down slightly */
}