2025-01-10 06:27:11 +00:00
<!DOCTYPE html>
< html lang = "en" >
< head >
< meta charset = "UTF-8" >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" >
2025-01-10 07:04:19 +00:00
< title > Minimalist Enhanced CSS Page< / title >
2025-01-10 07:01:54 +00:00
< style >
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
2025-01-10 07:04:19 +00:00
background-color: #f0f4f8;
2025-01-10 07:01:54 +00:00
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
padding: 1rem;
box-sizing: border-box;
2025-01-10 06:27:11 +00:00
}
2025-01-10 07:01:54 +00:00
.card {
background-color: white;
border-radius: 1rem;
padding: 2rem;
max-width: 28rem;
width: 100%;
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
2025-01-10 07:04:19 +00:00
transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
2025-01-10 07:01:54 +00:00
}
.card:hover {
2025-01-10 07:04:19 +00:00
box-shadow: 0 15px 30px -5px rgba(0, 0, 0, 0.15), 0 10px 10px -5px rgba(0, 0, 0, 0.1);
transform: translateY(-5px) scale(1.02);
2025-01-10 07:01:54 +00:00
}
h1 {
font-size: 1.875rem;
font-weight: 300;
2025-01-10 07:04:19 +00:00
color: #2c5282;
2025-01-10 07:01:54 +00:00
margin-bottom: 1rem;
text-align: center;
}
p {
2025-01-10 07:04:19 +00:00
color: #4a5568;
2025-01-10 07:01:54 +00:00
line-height: 1.625;
margin: 0;
}
< / style >
2025-01-10 06:27:11 +00:00
< / head >
2025-01-10 07:01:54 +00:00
< body >
< div class = "card" >
< h1 > Welcome< / h1 >
< p >
2025-01-10 06:27:11 +00:00
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.
< / p >
< / div >
< / body >
< / html >
