/* Adding a gradient to the entire page */
body {
    background: linear-gradient(#457081, #806868); /* Using the hex colors from your screenshots */
    margin: 0;
    height: 100vh;
}

/* Flexbox to center everything on the screen */
.container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
}


.circle-shape {
    width: 100px;
    height: 100px;
    background-color: white;
    border-radius: 50%; /* This turns a square into a circle */
    border: 2px solid #457081;
}


.pill-shape {
    width: 200px;
    height: 50px;
    background-color: #f0f0f0;
    border-radius: 50px; 
    margin-top: 20px;
}

.content {
    color: white;
    text-align: center;
    border: none; 
}