{
position: relative;
height: 100vh; /* Full viewport height */
width: 100vw; /* Full viewport width */
background: url('https://example.com/your-image.jpg') no-repeat center center/cover;
display: flex;
justify-content: center; /* Center content horizontally */
align-items: center; /* Center content vertically */
}
/* Style the container for the buttons */
.button-container {
display: flex;
flex-direction: column; /* Stack buttons vertically */
gap: 10px; /* Add space between buttons */
text-align: center;
}
/* Style the buttons */
.button-container button {
background-color: rgba(255, 255, 255, 0.8); /* Semi-transparent background */
border: 1px solid #ccc;
border-radius: 5px;
padding: 10px 20px;
font-size: 16px;
cursor: pointer;
transition: background-color 0.3s ease; /* Smooth hover transition */
}
/* Add hover effect */
.button-container button:hover {
background-color: #ddd;
}