body{
background:#f4f6f9;
font-family:Arial,sans-serif;
}

.topbar{
background:#111827;
padding:15px;
color:#fff;
}

.hero{
padding:80px 20px;
text-align:center;
background:#2563eb;
color:#fff;
}

.card-box{
background:#fff;
padding:25px;
border-radius:12px;
box-shadow:0 0 15px rgba(0,0,0,0.08);
margin-bottom:20px;
}

.sidebar{
background:#1f2937;
min-height:100vh;
padding:20px;
}

.sidebar a{
display:block;
padding:12px;
margin-bottom:10px;
background:#374151;
border-radius:8px;
text-decoration:none;
color:#fff;
}

.sidebar a:hover{
background:#2563eb;
}

@media(max-width:768px){

.sidebar{
min-height:auto;
}

}