app/page.module.css (44 lines of code) (raw):
.main {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
height: 100vh;
background-color: white;
}
.title {
font-size: 1.5em;
margin-bottom: 20px;
font-weight: 600;
}
.container {
display: flex;
flex-direction: row;
gap: 20px;
max-width: 1200px;
width: 100%;
padding: 20px;
box-sizing: border-box;
align-items: center;
justify-content: center;
}
.category {
color: black;
display: flex;
font-size: 1em;
border-radius: 32px;
justify-content: center;
align-items: center;
text-align: center;
background-color: #efefef;
cursor: pointer;
max-width: 600px;
width: 120px;
height: 120px;
padding: 20px;
transition: background-color 0.3s ease;
font-weight: 500;
}
.category:hover {
background-color: #e3e3eb;
}