body {
background-color: #fce4ec; /* Pinkish background */
font-family: 'Arial', sans-serif;
color: #333;
margin: 0;
padding: 0;
}
#container {
width: 90%;
max-width: 1000px;
margin: 20px auto;
background-color: #fff;
border: 3px solid #f8bbd0;
padding: 15px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
header {
text-align: center;
padding: 10px;
background-color: #ffcdd2;
border: 2px dashed #f48fb1;
margin-bottom: 20px;
}
nav ul {
list-style: none;
padding: 0;
display: flex;
justify-content: center;
background-color: #e1bee7;
border: 2px solid #ce93d8;
margin: 0 0 20px 0;
}
nav li a {
display: block;
padding: 10px 20px;
text-decoration: none;
color: #4a148c;
font-weight: bold;
}
#content {
display: flex;
gap: 20px;
}
main {
flex: 3;
padding: 15px;
background-color: #fff8e1;
border: 2px solid #ffd54f;
}
aside {
flex: 1;
padding: 15px;
background-color: #e3f2fd;
border: 2px solid #90caf9;
}
footer {
text-align: center;
padding: 10px;
margin-top: 20px;
border-top: 2px solid #f8bbd0;
font-size: 0.8em;
}
/* Specific elements to mimic the style */
h1, h2, h3 {
color: #d81b60;
text-shadow: 1px 1px #f48fb1;
}
a:hover {
color: #ff4081;
}